diff options
Diffstat (limited to 'css/standard011.css')
-rw-r--r-- | css/standard011.css | 624 |
1 files changed, 624 insertions, 0 deletions
diff --git a/css/standard011.css b/css/standard011.css new file mode 100644 index 0000000..90abd69 --- /dev/null +++ b/css/standard011.css @@ -0,0 +1,624 @@ +/* reset CSS (taken from blueprint and modified a bit) */ + +html, body, div, span, +h1, h2, h3, h4, h5, h6, p, +a,img, dl, dt, dd, ol, ul, li, +fieldset, form, label, legend, +table, tbody, tfoot, thead, tr, th, td { + margin: 0; + padding: 0; + border: 0; + vertical-align: baseline; +} +table { border-collapse: separate; border-spacing: 0; } +caption, th, td { text-align: left; font-weight: normal; } +table, td, th { vertical-align: middle; } + +/* end reset */ + +/* some general layout */ +h1, h2, h3, h4, h5, h6, p {margin: 2px; padding: 1px;} + +body { background-color: #ddd; } + + +/* the header, footer, etc */ +.header { + background-color: #fff; + text-align: center; + height: 4em; + padding-top: 1.5em; + margin-left: 3em; + margin-right: 3em; + border-bottom: 3px solid gray; +} + +.lastlogin { + position:absolute; + top:0; + left:3em; +} +.lastlogin span { + font-size:smaller; +} + +.main { + background-color: #fff; + margin-left: 3em; + margin-right: 3em; + min-height: 40em; +} + +.footer { + background-color: #fff; + margin:0; + margin-left: 3em; + margin-right: 3em; + padding:0; + border-top: 2px solid gray; + clear:both; + height: 8em; +} +.footer .right { float:right; font-size:smaller; +} +.footer .left { float:left; font-size:smaller; + } + +.status { + position:absolute; + right:4em; + top:0.1em; + font-size: smaller; +} + +/* all kind of message that should appear in the middle of the page/table */ +.joingame,.sickness,.poverty,.total,.message { + position: absolute; + background-color: #fff; + width: 20%; + top:19em; + left:40%; + right:40%; + text-align: center; + z-index:22 +} + + +/* scoring */ +.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; +} + +/* output possible rules for a new game */ +.rules { + margin-top:24em; +} + +/* playing cards*/ +.card { + position:absolute; + z-index:20; + top:18em; + left:28em; + text-align:center; + background-color:#fff; + border:2px solid gray; +} +.card img { width:8em; } + +/* display the table and the names */ +div.table { + position:absolute; + width:100%; + height:35em; + margin:0; + left:0; + padding:0; +/* border: 3px solid blue; */ + top: 8.2em; + text-align:center; +} + +div.table img.table { + position:absolute; + width:25%; + top:20%; + height:22em; + left:37.5%; + z-index:5; + display: block; + margin:0; + padding:0; +} +div.table div { + /*background-color:green;*/ + position:absolute; + width:12.5%; + text-align:center; + z-index:20; +} +div.table div img{ + /*background-color:green;*/ + width:20%; +} + +div.table div.table0 { + top:45%; + right:62.5%; +} +div.table div.table1 { + top:7.5%; + left:43.75%; +} +div.table div.table2 { + top:45%; + left:62.5%; +} +div.table div.table3 { + bottom:5%; + left: 43.75%; +} + +/* display the card tricks */ + +ul.tricks { + position:relative; + zoom:1; /* fixes an IE6 issue and hopefully doesn't mess up anything else */ + list-style:none; + margin:3px; + padding:0; + padding-bottom:3px; + text-align:center; + border-bottom:1px solid #444; +} +ul.tricks a { text-decoration:none; color:#000;} +ul.tricks li { + /*background-color:blue;*/ + 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; + left: 0; + margin:0; + padding:0; +/* border: 2px solid red;*/ + display:block; +} +ul.tricks li div.trick { + display:none; +} + +ul.tricks li div.trick img.arrow { + position:absolute; + margin:0; + padding:0; +/* border: 5px solid blue;*/ + text-align:center; + width:16%; + height:16em; + left:42%; + right:42%; + top:10em; + z-index:8; +} + +#trick0 img { float:left; width: 3em; } + +hr {clear:both;} + +/*ul.tricks li:hover div.table{ display:block; }*/ + +/* left player */ +ul.tricks li div div.card0 img,ul.tricks li div div.card0 .score, .vorbehalt0 { + position:absolute; + margin:0; + padding:0; + /*border: 1px solid red;*/ + top: 40%; + left:37.5%; + right:56.5%; + width:6%; + z-index:30; +} +.vorbehalt0 { + left:37.5%; + right:57.5%; + width:10%; + text-align:left; +} +ul.tricks li div div.card0 span.comment{ + position:absolute; + margin:0; + padding:0; + /*border: 1px solid red;*/ + top: 5%; + right:66.5%; + left:17.5%; + width:16%; +} + +/* top player */ +ul.tricks li div div.card1 img,ul.tricks li div div.card1 .score, .vorbehalt1 { + position:absolute; + margin:0; + padding:0; + /*border: 1px solid red;*/ + top: 22%; + left:47%; + right:47%; + width:6%; + text-align:center; + z-index:30; +} +.vorbehalt1{ + left:45%; + right:45%; + width:10%; + z-index:30; +} +ul.tricks li div div.card1 span.comment{ + position:absolute; + margin:0; + padding:0; + /*border: 1px solid red;*/ + top: 5%; + left:66.5%; + right:17.5%; + width:16%; + text-align:center; +} + +/* right player */ +ul.tricks li div div.card2 img,ul.tricks li div div.card2 .score, .vorbehalt2{ + position:absolute; + margin:0; + padding:0; + /*border: 1px solid red;*/ + top: 40%; + right:37.5%; + left:56.5%; + width:6%; + z-index:30; +} +.vorbehalt2{ + left:auto; + right:38%; + width:10%; + text-align:right; +} +ul.tricks li div div.card2 span.comment{ + position:absolute; + margin:0; + padding:0; + /*border: 1px solid red;*/ + top: 85%; + left:66.5%; + right:17.5%; + width:16%; + text-align:center; +} + +/* bottom player */ +ul.tricks li div div.card3 img,ul.tricks li div div.card3 .score, .vorbehalt3{ + position:absolute; + margin:0; + padding:0; + /*border: 1px solid red;*/ + bottom: 20%; + left:47%; + right:47%; + width:6%; + text-align:center; + z-index:30; +} +.vorbehalt3{ + left:45%; + right:45%; + width:10%; + text-align:center; +} +ul.tricks li div div.card3 span.comment{ + position:absolute; + margin:0; + padding:0; + /*border: 1px solid red;*/ + top: 85%; + right:66.5%; + left:17.5%; + width:16%; +} + +span.comment{ + border: 3px solid green; +} + +ul.tricks li div div span.comment span{ + display:block; + text-align:left; + border-top:1px solid green; +} + +.mycards { + margin:0; + margin-top:34.5em; + padding:0; + border-top: 2px solid gray; +/* border-bottom: 2px solid green;*/ + background-color: #faffc7; + text-align:center; +} + +.mycards img { + 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; + margin:0; + padding:0; +} + + +/* sessions */ +.session { + border-bottom:1px solid #000; + text-align:center; +} +div.session div.sessionrules { + width:19em; + float:left ; + text-align: left; +} +div.session div.sessionscore { + width:19em; + float:right ; + text-align: right; +} +div.session div.sessionrules div{ + display:none; + background-color: #fff; + border: 1px solid #000; + position:absolute; + z-index: 30; + padding:0.5em; +} +div.session div.sessionrules:hover div{ + display:block; +} +div.session div.sessionscore div{ + position:absolute; + width:12em; + right:3em; + display:none; + background-color: #fff; + border: 1px solid #000; + z-index: 30; +} +div.session div.sessionscore:hover div{ + display:block; +} +div.session img.rulesicon { + height: 1em; +} + +.scoretable{ + height:20em; + overflow: auto; +} +table.score { + margin:0.5em; + width:10em; + border-collapse:collapse; +} + +.gameinfo { + position:absolute; + top:27em; + right:0em; + margin:1em; + margin-top:0em; + margin-right:3em; + + width:12em; + + padding:0.3em; + + border: 2px solid gray; + background-color: #efefef; +} + +.usermenu { + position:absolute; + top:10em; + left:3em; + margin:1em; + margin-top:0em; + margin-left:0em; + + width: 12em; + + border: 2px solid gray; + + padding:0.3em; + + background-color: #eee; +} + +.notes { + position:absolute; + top:27em; + left:0; + margin:1em; + margin-top:0em; + margin-left:3em; + + width: 12em; + + border: 2px solid gray; + + padding:0.3em; + + background-color: #efefef; + + height:10em; + overflow: auto; + z-index:50; +} + +.user { margin-left:25%;margin-right:5%; } +.user td.usergames { width:50%; } +.wide { margin-left:5%;margin-right:5%; } + +.over { + text-align:center; + margin-bottom:0.1em; +} + +.submitbutton { + padding: 0.2em; + padding-bottom: 0.3em; + border:0; + background-color: #efe; +} + +.submitbutton:hover { + background-color:#afa; +} + + +.cardinput { + display:inline; + position:relative; + border: 1px solid #000; +} + +.cardinput img { + width: 4em; +} + +.cardinput:hover{ + background-color:red; +} + +div span img.button { + width: 2em; +} + +.gamestatuspre { + padding: 0 0.3em; + + background-color: #fd8901; +} +.gamestatusover { + padding:0 0.3em; + background-color: #f82c20 ; +} +.gamestatusplay { + padding:0 0.3em; + background-color: #15de26; +} + +.bigger { + font-size:larger; +} + +caption { + text-align: center; + margin: 0.5em; + padding: 0.5em; + padding-bottom: 0em; + margin-bottom: 0; + } +table.stats { margin: 0.5em 1em; + border: solid 0.2em #aeaeae; + -moz-border-radius: 0.5em ; + float: left; +} +table.stats tr.odd { background-color:#aeaeae; } +table.stats tr.even { background-color:#eaeaea; } +table.stats td, table.stats th { + margin-left: 0.2em; + margin-right: 0.2em; + padding-left: 0.2em; + padding-right: 0.2em; + border-right: solid 0.1em #000; +} +table.stats tr td:last-child, table.stats tr th:last-child { border-right: solid 0 #000; } + +table.stats th { border-bottom: solid 0.2em #000 } + + +/* the login window */ +.login { + text-align:center; + padding-top: 1em; +} + +.login p, { + padding: 0.1em 0.1em 0.15em; +} +.login h4 { + padding: 0.3em 0.3em 0.45em; +} + +.login form{ + width: 20em; + margin: 0.5em auto; + padding: 0.5em 0.5em 1.5em; + text-align: center; +} + +.login legend, .login label, .login input{ + padding: 0.5em 0.5em 0.75em; +} + +.login fieldset { + border: 2px solid #000; + padding: 0.5em 0.5em 0.75em; + background-color: #eee; +} + +.login .submitbutton { + background-color: #fff; +} + +.login .submitbutton:hover { + background-color: #aaa; +} + +.login tr.center td{ + text-align: center; +} |