X-Git-Url: https://git.nubati.net/cgi-bin/gitweb.cgi?p=e-DoKo.git;a=blobdiff_plain;f=css%2Fstandard.css;h=5bca2aea8a422816fcb58e7f14287ce28cb341e1;hp=028930305fcd72750f48cb53b124c85b5d2fd5bf;hb=2e9d5e97305ccbd1b975013511922f924d53fffd;hpb=198ab37015dbe1f999f149dbd887dcb814202585 diff --git a/css/standard.css b/css/standard.css index 0289303..5bca2ae 100644 --- a/css/standard.css +++ b/css/standard.css @@ -1,181 +1,266 @@ .header { - background-color:white; - text-align:center; - border-bottom:3px solid gray; + background-color: white; + text-align: center; + height: 4em; + border-bottom: 3px solid gray; +} + +.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 { + position: absolute; + width: 18em; + + top:21em; + left:22em; + + text-align: center; +} + +.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; } .card img { width:8em; } +/* display the table and the names */ +div.table { + position:absolute; + margin:0; + padding:0; +/* border: 5px solid blue;*/ + top: 14em; + left: 20em; +} + +div.table img { + height:20em; + width:20em; + z-index:9; +} +div.table span { + /*background-color:green;*/ + position:absolute; + width:13em; +} +div.table span span{ + /*background-color:green;*/ + position:relative; +} + +div.table span.table0 { + top:9em; + left:-15em; + text-align:right; +} +div.table span.table1 { + top:-3.5em; + left: 0em; + width:20em; + text-align:center; +} +div.table span.table2 { + top:9em; + left:22em; + text-align:left; + vertical-align:center; +} +div.table span.table3 { + top:21.5em; + left: 0em; + width:20em; + text-align:center; +} -ul.oldtrick { +ul.tricks { position:relative; list-style:none; margin:3px; padding:0; - /*background-color:yellow;*/ + padding-bottom:3px; text-align:center; - + border-bottom:1px solid #444; } - -ul.oldtrick a { text-decoration:none; color:#000;} - -ul.oldtrick li { +ul.tricks a { text-decoration:none; color:#000;} +ul.tricks li { /*background-color:blue;*/ - margin:0.2em 0.5em; + margin:0; + padding:0.2em 0.5em; display:inline; } -ul.oldtrick li:hover { - background-color: yellow; -} +ul.tricks li.old { background-color:#fff; } +ul.tricks li:hover { background-color: #bbb;} +ul.tricks li.nohighlight:hover { background-color: #fff;} -ul.oldtrick li div.table img.table { +ul.tricks li div.trick { position:absolute; margin:0; padding:0; - top: 4em; - left: 3em; - height:22em; - z-index:-2; +/* border: 5px solid green;*/ + top: 8em; + left: 20em; + height:20em; + width:20em; + z-index:9; + display:none; } -ul.oldtrick li div.table { +ul.tricks li div.trick img.arrow { position:absolute; margin:0; padding:0; - /*border: 5px solid green;*/ - top: 10em; - left: 18em; - height:28em; - width:28em; - z-index:9; - display:none; + top: 4em; + left: 3em; + height:14em; + z-index:-2; } hr {clear:both;} -/*ul.oldtrick li:hover div.table{ display:block; }*/ +/*ul.tricks li:hover div.table{ display:block; }*/ -ul.oldtrick li div div.card0 { +ul.tricks li div div.card0 { position:absolute; margin:0; padding:0; /*border: 1px solid red;*/ - top: 14em; - right:25em; + top: 7em; + right:22em; } -ul.oldtrick li div div.card1 { +ul.tricks li div div.card1 { position:absolute; margin:0; padding:0; /*border: 1px solid red;*/ - top: 0; - left:0em; + top: 1em; + left:-7em; width:28em; text-align:center; } -ul.oldtrick li div div.card2 { +ul.tricks li div div.card2 { position:absolute; margin:0; padding:0; /*border: 1px solid red;*/ - top: 14em; - right:0em; + top: 7em; + left: 15em; } -ul.oldtrick li div div.card3 { +ul.tricks li div div.card3 { position:absolute; margin:0; padding:0; /*border: 1px solid red;*/ - top: 29em; - left:0; + top: 15em; + left:-7em; width:28em; text-align:center; } -ul.oldtrick li div div img { +ul.tricks li div div img { position:absolute; height:6em; margin:0; padding:0; } -ul.oldtrick li div div.card0 img { - top: -2em; - left:5em; -} -ul.oldtrick li div div.card1 img { - top: 3em; - left:12em; -} -ul.oldtrick li div div.card2 img { - top: -2em; - left:-6em; -} -ul.oldtrick li div div.card3 img { - top: -6em; - left:12em; +ul.tricks li div div span.comment { + position:absolute; + background-color:white; + margin:0; + padding:0; + width:10em; + border: 1px solid yellow; + z-index:-11; } - -ul.oldtrick li div div span { - /*background-color:green;*/ +ul.tricks li div div span.score { + position:absolute; + width:5em; + background-color: #fff; } -ul.oldtrick li div div.card0 span { - text-align:right; +ul.tricks li div div.card0 span.score { + top: 1em; + left: 2em; } -ul.oldtrick li div div.card1 span { - text-align:center; +ul.tricks li div div.card1 span.score { + top: -1em; + left: 14em; } -ul.oldtrick li div div.card0 span { - text-align:left; +ul.tricks li div div.card2 span.score { + top: 1em; + left: -1em; } -ul.oldtrick li div div.card0 span { - text-align:center; +ul.tricks li div div.card3 span.score { + top: 2em; + left: 14em; } -ul.oldtrick li div div span span { - position:absolute; - background-color:white; - margin:0; - padding:0; - width:10em; - border: 1px solid yellow; +ul.tricks li div div span.comment:hover { z-index:11; } -ul.oldtrick li div div.card0 span span{ - top:1em; - left:-14em; +ul.tricks li div div span.comment { + z-index:-11; +} +ul.tricks li div div.card0 span.comment{ + top:6em; + left:-15em; border: 3px solid green; } -ul.oldtrick li div div.card1 span span{ - top:-1em; - left:3em; +ul.tricks li div div.card1 span.comment{ + top:-5em; + left:-4em; border: 3px solid green; } -ul.oldtrick li div div.card2 span span{ - top:-2em; - left:3em; +ul.tricks li div div.card2 span.comment{ + top:-8em; + left:6em; border: 3px solid green; } -ul.oldtrick li div div.card3 span span{ - top:-1em; - left:3em; +ul.tricks li div div.card3 span.comment{ + top:5em; + left:27em; border: 3px solid green; } +ul.tricks li div div span.comment span{ + display:block; + width:10em; + text-align:left; + border-top:1px solid green; +} .mycards { - clear:both; margin:0; - margin-top:38em; + margin-top:33em; padding:0; border:1px solid red; background-color:yellow; @@ -185,6 +270,18 @@ ul.oldtrick li div div.card3 span span{ height:6em; } +.exchange { + clear:both; + margin:0; + padding:0; + border:1px solid red; + background-color:yellow; +} + +.exchange img { + height:6em; +} + .line{ clear:both; border-top:2px solid gray; @@ -192,21 +289,88 @@ ul.oldtrick li div div.card3 span span{ padding:0; } -.info { - float:right; - border:2px solid gray; - border-top:0; +.session { + border-bottom:1px solid black; + text-align:center; } -.time,.over { +.gameinfo { + position:absolute; + top:9em; + right:0em; + + width:12em; + + border-top: 2px solid gray; + border-left: 2px solid gray; + border-bottom: 2px solid gray; + + padding:0.3em; + + background-color: #eee; +} + + +.usermenu { + position:absolute; + top:9em; + 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 { + text-align:center; + margin-bottom:0.1em; +} + +.submitbutton { + border:0; + background-color: #efe; +} + +.submitbutton:hover { + background-color:#afa; +} + +.useroptions{ float:right; - border:2px solid black; - clear:right; - } + padding-left:0.3em; + border-left: 1px solid #aaa; + border-bottom: 1px solid #aaa; +} +.useroptions h4 { + margin:0.1em; + margin-left:0em; + padding:0.1em; + padding-left:0em; + text-align:left; +} + +.cardinput { + display:inline; + position:relative; + border: 1px solid black; +} + +.cardinput img { + width: 4em; +} + +.cardinput:hover{ + background-color:red; +} + +div span img.button { + height: 2em; + width: 2em; -.bug { - float:left; - width:10em; - border:2px solid gray; - border-top:0; } \ No newline at end of file