X-Git-Url: https://git.nubati.net/cgi-bin/gitweb.cgi?p=e-DoKo.git;a=blobdiff_plain;f=css%2Fstandard.css;h=d536394e7b10bea4985b0a12ce140386e8364649;hp=ca170e028ae4c02476e5aa8391d537ffd76b6473;hb=5db5f9e9ee3544b1a2b82ad1dc4e250530dd8e64;hpb=9db97c855d40d089037410aad3595893f68f6d6a diff --git a/css/standard.css b/css/standard.css index ca170e0..d536394 100644 --- a/css/standard.css +++ b/css/standard.css @@ -1,25 +1,82 @@ .header { - background-color:white; - text-align:center; - border-bottom:3px solid gray; -} -.footer { - margin:0; - margin-top:0.3em; - padding:0; - border-top: 2px solid #444; - font-size:smaller; - clear:both; - } -.footer .right{ float:right; } -.footer .left{ float:left; } - -.card { + background-color: white; + text-align: center; + height: 4em; + border-bottom: 3px solid gray; +} + +.lastlogin { + position:absolute; + font-size:smaller; + top:0; + left:0; +} + +.main { + min-height: 40em; +} + +.footer { + margin:0; + margin-top:0.3em; + padding:0; + border-top: 2px solid #444; + font-size:smaller; + clear:both; +} +.footer .right { float:right; } +.footer .left { float:left; } + +.status { + position:absolute; + right:1em; + top:0.1em; + font-size: smaller; +} + +.joingame,.sickness,.poverty,.total,.message { + position: absolute; + width: 20%; + top:22em; + left:40%; + right:40%; + text-align: center; + z-index:22 +} + + +.total .re { + position: absolute; + left: -4em; + top:8em; + background-color: #fff; + z-index:15; +} +.total .contra { + position: absolute; + right: -4em; + top:8em; + background-color: #fff; + z-index:15; +} + +.poverty { + top:32em; + z-index:15; + background-color:#fff; +} + +.rules { +margin-top:20em; +} + + +.card { position:absolute; z-index:20; top:18em; left:28em; - text-aling:center; + text-align:center; background-color:white; border:2px solid gray; } @@ -28,45 +85,53 @@ /* display the table and the names */ div.table { position:absolute; + width:99%; + height:35em; margin:0; padding:0; -/* border: 5px solid blue;*/ - top: 14em; - left: 20em; +// border: 3px solid blue; + top: 8.2em; + text-align:center; } -div.table img { - height:20em; - width:20em; +div.table img.table { + position:absolute; + width:25%; + top:20%; + height:22em; + left:37.5%; z-index:9; + display: block; + margin:0; + padding:0; } -div.table span { +div.table div { /*background-color:green;*/ position:absolute; - width:13em; + width:12.5%; + text-align:center; + z-index:20; } -div.table span.table0 { - top:9em; - left:-15em; - text-align:right; +div.table div img{ + /*background-color:green;*/ + width:20%; } -div.table span.table1 { - top:-3.5em; - left: 0em; - width:20em; - text-align:center; + +div.table div.table0 { + top:45%; + right:62.5%; } -div.table span.table2 { - top:9em; - left:22em; - text-align:left; - vertical-align:center; +div.table div.table1 { + top:5%; + left:43.75%; } -div.table span.table3 { - top:21.5em; - left: 0em; - width:20em; - text-align:center; +div.table div.table2 { + top:45%; + left:62.5%; +} +div.table div.table3 { + bottom:5%; + left: 43.75%; } ul.tricks { @@ -75,32 +140,31 @@ ul.tricks { margin:3px; padding:0; padding-bottom:3px; - /*background-color:yellow;*/ text-align:center; border-bottom:1px solid #444; } ul.tricks a { text-decoration:none; color:#000;} ul.tricks li { /*background-color:blue;*/ - margin:0; - padding:0.2em 0.5em; + margin:0.1em; + padding:0.2em 0.5em; display:inline; } ul.tricks li.old { background-color:#fff; } ul.tricks li:hover { background-color: #bbb;} ul.tricks li.nohighlight:hover { background-color: #fff;} - ul.tricks li div.trick { position:absolute; + width:100%; + height:35em; + top:1.2em; margin:0; padding:0; -/* border: 5px solid green;*/ - top: 8em; - left: 20em; - height:20em; - width:20em; - z-index:9; +// border: 2px solid red; + display:block; +} +ul.tricks li div.trick { display:none; } @@ -108,112 +172,122 @@ ul.tricks li div.trick img.arrow { position:absolute; margin:0; padding:0; - top: 4em; - left: 3em; - height:14em; - z-index:-2; +/* border: 5px solid blue;*/ + text-align:center; + width:16%; + height:16em; + left:42%; + right:42%; + top:9em; + z-index:8; } hr {clear:both;} /*ul.tricks li:hover div.table{ display:block; }*/ -ul.tricks li div div.card0 { +ul.tricks li div div.card0 img,ul.tricks li div div.card0 .score{ position:absolute; margin:0; padding:0; /*border: 1px solid red;*/ - top: 9em; - right:27em; + top: 40%; + left:37.5%; + right:56x.5%; + width:6%; + z-index:9; } -ul.tricks li div div.card1 { +ul.tricks li div div.card0 span.comment{ position:absolute; margin:0; padding:0; /*border: 1px solid red;*/ - top: -3em; - left:-3em; - width:28em; - text-align:center; + top: 5%; + right:66.5%; + left:17.5%; + width:16%; } -ul.tricks li div div.card2 { +ul.tricks li div div.card1 img,ul.tricks li div div.card1 .score { position:absolute; margin:0; padding:0; /*border: 1px solid red;*/ - top: 9em; - right:-2em; + top: 20%; + left:47%; + right:47%; + width:6%; + text-align:center; + z-index:9; } -ul.tricks li div div.card3 { +ul.tricks li div div.card1 span.comment{ position:absolute; margin:0; padding:0; /*border: 1px solid red;*/ - top: 20em; - left:-3em; - width:28em; + top: 5%; + left:66.5%; + right:17.5%; + width:16%; text-align:center; } - -ul.tricks li div div img { +ul.tricks li div div.card2 img,ul.tricks li div div.card2 .score{ position:absolute; - height:6em; margin:0; padding:0; + /*border: 1px solid red;*/ + top: 40%; + right:37.5%; + left:56x.5%; + width:6%; + z-index:9; } - -ul.tricks li div div.card0 img { - top: -2em; - left:5em; -} -ul.tricks li div div.card1 img { - top: 3em; - left:10em; -} -ul.tricks li div div.card2 img { - top: -2em; - left:-6em; -} -ul.tricks li div div.card3 img { - top: -6em; - left:10em; -} - - -ul.tricks li div div span { +ul.tricks li div div.card2 span.comment{ position:absolute; - background-color:white; margin:0; padding:0; - width:10em; - border: 1px solid yellow; - z-index:11; + /*border: 1px solid red;*/ + top: 80%; + left:66.5%; + right:17.5%; + width:16%; + text-align:center; } -ul.tricks li div div.card0 span{ - top:4em; - left:-10em; - border: 3px solid green; +ul.tricks li div div.card3 img,ul.tricks li div div.card3 .score{ + position:absolute; + margin:0; + padding:0; + /*border: 1px solid red;*/ + bottom: 20%; + left:47%; + right:47%; + width:6%; + text-align:center; + z-index:9; } -ul.tricks li div div.card1 span{ - top:-2em; - left:1em; - border: 3px solid green; +ul.tricks li div div.card3 span.comment{ + position:absolute; + margin:0; + padding:0; + /*border: 1px solid red;*/ + top: 80%; + right:66.5%; + left:17.5%; + width:16%; } -ul.tricks li div div.card2 span{ - top:-2em; - left:0em; - border: 3px solid green; + +span.comment{ + border: 3px solid green; } -ul.tricks li div div.card3 span{ - top:2em; - left:20em; - border: 3px solid green; + +ul.tricks li div div span.comment span{ + display:block; + text-align:left; + border-top:1px solid green; } .mycards { - clear:both; margin:0; - margin-top:33em; + margin-top:34.5em; padding:0; border:1px solid red; background-color:yellow; @@ -242,56 +316,107 @@ ul.tricks li div div.card3 span{ padding:0; } +.session { + border-bottom:1px solid black; + text-align:center; +} -.ruleset { +.gameinfo, .useroptions { position:absolute; - top:17.5em; -// top:7.5em; - border:2px solid gray; + top:10em; + right:0em; + margin:1em; + margin-top:0em; + margin-right:0em; + + width:12em; + + border-top: 2px solid gray; + border-left: 2px solid gray; + border-bottom: 2px solid gray; + padding:0.3em; - margin:0; -} -.time { - float:left; - border:2px solid gray; - border-top:0; + background-color: #eee; } -.bug { +.usermenu { position:absolute; - top:24.5em; -// top:14.5em; - width:10em; - border:2px solid gray; - padding-top:0.5em; - clear:left; + top:10em; + left:0; + margin:1em; + margin-top:0em; + margin-left:0em; + + width: 12em; + + border-top: 2px solid gray; + border-right: 2px solid gray; + border-bottom: 2px solid gray; + + padding:0.3em; + + background-color: #eee; } -.over { +.user { margin-left:25%;margin-right:25%; } + +.over { text-align:center; margin-bottom:0.1em; } -.submitbutton { - border:0; - background-color: #efe; - } +.submitbutton { + border:0; + background-color: #efe; +} + +.submitbutton:hover { + background-color:#afa; +} + + +.cardinput { + display:inline; + position:relative; + border: 1px solid black; +} + +.cardinput img { + width: 4em; +} + +.cardinput:hover{ + background-color:red; +} -.submitbutton:hover { -background-color:#afa; +div span img.button { + width: 2em; } -.useroptions{ - float:right; - padding-left:0.3em; - border-left: 1px solid #aaa; - border-bottom: 1px solid #aaa; +.gamestatuspre { + padding: 0 0.3em; + + background-color: #fd8901; } -.useroptions h4 { - margin:0.1em; - margin-left:0em; - padding:0.1em; - padding-left:0em; - text-aling:left; +.gamestatusover { + padding:0 0.3em; + background-color: #f82c20 ; +} +.gamestatusplay { + padding:0 0.3em; + background-color: #15de26; +} + +.scoretable{ + height:10em; + overflow: auto; +} +table.score { + width:10em; + border-collapse:collapse; +} + +.bigger { + font-size:larger; } \ No newline at end of file