From b9c5f3e252ab1f5725d653528cc8a719e6822f6d Mon Sep 17 00:00:00 2001 From: Arun Persaud Date: Mon, 26 Apr 2010 23:35:41 -0700 Subject: added an About page --- css/standard025.css | 709 ------------------------------------------------- css/standard026.css | 744 ++++++++++++++++++++++++++++++++++++++++++++++++++++ 2 files changed, 744 insertions(+), 709 deletions(-) delete mode 100644 css/standard025.css create mode 100644 css/standard026.css (limited to 'css') diff --git a/css/standard025.css b/css/standard025.css deleted file mode 100644 index 5a5d22f..0000000 --- a/css/standard025.css +++ /dev/null @@ -1,709 +0,0 @@ -/* Copyright 2006, 2007, 2008, 2009, 2010 Arun Persaud - * - * This file is part of e-DoKo. - * - * e-DoKo is free software: you can redistribute it and/or modify - * it under the terms of the GNU General Public License as published by - * the Free Software Foundation, either version 3 of the License, or - * (at your option) any later version. - * - * e-DoKo is distributed in the hope that it will be useful, - * but WITHOUT ANY WARRANTY; without even the implied warranty of - * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the - * GNU General Public License for more details. - * - * You should have received a copy of the GNU General Public License - * along with e-DoKo. If not, see . - * - */ - -/* 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-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; -} - -/* sessions */ -.session { - width: 100%; - border-bottom: 1px solid #000; - text-align: center; -} -.session div.sessionrules { - width: 19em; - float: left; - text-align: left; -} -.session div.sessionrules div{ - display:none; - background-color: #fff; - border: 1px solid #000; - position:absolute; - z-index: 30; - padding:0.5em; -} -.session div.sessionrules:hover div{ display:block; } -.session div.sessionscore { - width: 19em; - float: right; - text-align: right; -} -.session div.sessionscore div{ - position:absolute; - width:12em; - right:3em; - display:none; - background-color: #fff; - border: 1px solid #000; - z-index: 30; -} -.session div.sessionscore:hover div{ display:block;} -.session img.rulesicon{ height: 1em; } - -.session .scoretable{ - height:20em; - overflow: auto; -} -.session table.score { - margin:0.5em; - width:10em; - border-collapse:collapse; -} - -/* 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 -} - -.total { - top:11em; - width: 14%; - left: 43%; -} -/* scoring */ -.total .re { - position: absolute; - left: -12em; - top:8em; - background-color: #eee; - z-index:15; -} -.total .contra { - position: absolute; - right: -14em; - top:8em; - background-color: #eee; - 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:37em; - margin:0; - left:0; - padding:0; -/* border: 3px solid blue; */ - top: 9.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:0%; - left:43.75%; -} -div.table div.table2 { - top:45%; - left:62.5%; -} -div.table div.table3 { - bottom:0%; - 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;*/ - padding:0.1em; - margin: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:2.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; - max-height:6em; - overflow: auto; - word-wrap: break-word; -} - -ul.tricks li div div span.comment span{ - display:block; - text-align:left; - border-top:1px solid green; -} - -.mycards { - margin:0; - margin-top:38.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; -} - -.gameinfo { - position:relative; - top:0em; - margin:0em; - padding:0em; - width:100%; - border-top: 2px solid gray; - background-color: #efaaaa; - text-align:center; -} - -.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%; } - -div.user ul { - list-style:none; -} - -div.user ul li { - position: relative; - padding:3px; - margin: 0px; - width: 80%; - min-height: 1.2em; - border-left: 2px solid #babdb6 ; - border-right: 2px solid #babdb6 ; - border-bottom: 2px solid #babdb6 ; -} - -div.user ul li:first-child { - border-top: 2px solid #babdb6 ; -} -.gamessession { - display:none; -} -.link { - text-decoration:underline; - color: blue; -} - -.user .gameid { - float: left; - width: 5em; -} -.user .turn { - padding-left: 1em; - float: left; - width: 20em; -} -.user .gameshidesession { - float:right; - width: 10em; -} - -.wide { margin-left:5%;margin-right:5%; } - -.over { - text-align:center; - margin-bottom:0.1em; -} - -.cardinput { - display:inline; - position:relative; - border: 1px solid #000; -} - -.cardinput img { width: 4em;} - -.cardinput:hover{ background-color:red;} - -div span img.button { width: 2em;} -div span img.tinybutton { width: 1.4em;} - -.gamestatuspre { - padding: 0 0.3em; - background-color: #f57900; -} -.gamestatusover { - padding:0 0.3em; - background-color: #e9b96e ; - color: #fff; -} -.gamestatusplay { - padding:0 0.3em; - background-color: #8ae234; -} - -.bigger{ font-size:larger;} - - -/* statistics using jquery*/ -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 tbody tr.odd td { background-color:#aeaeae; } -table.stats tbody tr.even td { 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 } - -table.stats thead tr .header { - background-image: url(bg.png); - background-repeat: no-repeat; - background-position: center right; - cursor: pointer; -} -table.stats tbody td { - padding: 4px; - background-color: #eaeaea; - vertical-align: top; -} -table.stats thead tr .headerSortUp { - background-image: url(asc.png); -} -table.stats thead tr .headerSortDown { - background-image: url(desc.png); -} -table.stats thead tr .headerSortDown, table.tablesorter thead tr .headerSortUp { - background-color: #8dbdd8; -} - - - -/* 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; -} - -/* the login form */ -.login form{ - width: 24em; - margin: 0.5em auto; - padding: 0.5em 0.5em 1.5em; - text-align: center; -} - -fieldset { - border: 2px solid #000; - padding: 0.5em 0.5em 0.75em; - background-color: #eee; -} - -.login label, .login input{ margin: 0.5em 0.5em 0.75em;} - -.login label{ - float:left; - width:7em; - text-align: left; -} - -.login input #email, .login input #password{ - width:9em; - float:right; -} - -.login .submitbutton { background-color: #fff;} -.login .submitbutton:hover { background-color: #aaa;} - -#openid_url { - background: #FFFFFF url('openid-icon-small.gif') no-repeat scroll 0pt 50%; - padding-left: 18px; -} - -table.openid td, table.openid th{ - padding: 0.0em 0.3em;; -} - -.newbiehint { - background-color: #fee; -} - -.vacation { - color: #666; - background-color: #fc3; -} - -div.table div img.gravatar, img.gravatar { - width: 4em; - height: 4em; - border: 3px solid #aaa; -} - -.highcall { - background-color: #fc3; -} diff --git a/css/standard026.css b/css/standard026.css new file mode 100644 index 0000000..7f9d145 --- /dev/null +++ b/css/standard026.css @@ -0,0 +1,744 @@ +/* Copyright 2006, 2007, 2008, 2009, 2010 Arun Persaud + * + * This file is part of e-DoKo. + * + * e-DoKo is free software: you can redistribute it and/or modify + * it under the terms of the GNU General Public License as published by + * the Free Software Foundation, either version 3 of the License, or + * (at your option) any later version. + * + * e-DoKo is distributed in the hope that it will be useful, + * but WITHOUT ANY WARRANTY; without even the implied warranty of + * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the + * GNU General Public License for more details. + * + * You should have received a copy of the GNU General Public License + * along with e-DoKo. If not, see . + * + */ + +/* 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-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; +} + +/* sessions */ +.session { + width: 100%; + border-bottom: 1px solid #000; + text-align: center; +} +.session div.sessionrules { + width: 19em; + float: left; + text-align: left; +} +.session div.sessionrules div{ + display:none; + background-color: #fff; + border: 1px solid #000; + position:absolute; + z-index: 30; + padding:0.5em; +} +.session div.sessionrules:hover div{ display:block; } +.session div.sessionscore { + width: 19em; + float: right; + text-align: right; +} +.session div.sessionscore div{ + position:absolute; + width:12em; + right:3em; + display:none; + background-color: #fff; + border: 1px solid #000; + z-index: 30; +} +.session div.sessionscore:hover div{ display:block;} +.session img.rulesicon{ height: 1em; } + +.session .scoretable{ + height:20em; + overflow: auto; +} +.session table.score { + margin:0.5em; + width:10em; + border-collapse:collapse; +} + +/* 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 +} + +.total { + top:11em; + width: 14%; + left: 43%; +} +/* scoring */ +.total .re { + position: absolute; + left: -12em; + top:8em; + background-color: #eee; + z-index:15; +} +.total .contra { + position: absolute; + right: -14em; + top:8em; + background-color: #eee; + 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:37em; + margin:0; + left:0; + padding:0; +/* border: 3px solid blue; */ + top: 9.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:0%; + left:43.75%; +} +div.table div.table2 { + top:45%; + left:62.5%; +} +div.table div.table3 { + bottom:0%; + 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;*/ + padding:0.1em; + margin: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:2.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; + max-height:6em; + overflow: auto; + word-wrap: break-word; +} + +ul.tricks li div div span.comment span{ + display:block; + text-align:left; + border-top:1px solid green; +} + +.mycards { + margin:0; + margin-top:38.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; +} + +.gameinfo { + position:relative; + top:0em; + margin:0em; + padding:0em; + width:100%; + border-top: 2px solid gray; + background-color: #efaaaa; + text-align:center; +} + +.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%; } + +div.user ul { + list-style:none; +} + +div.user ul li { + position: relative; + padding:3px; + margin: 0px; + width: 80%; + min-height: 1.2em; + border-left: 2px solid #babdb6 ; + border-right: 2px solid #babdb6 ; + border-bottom: 2px solid #babdb6 ; +} + +div.user ul li:first-child { + border-top: 2px solid #babdb6 ; +} +.gamessession { + display:none; +} +.link { + text-decoration:underline; + color: blue; +} + +.user .gameid { + float: left; + width: 5em; +} +.user .turn { + padding-left: 1em; + float: left; + width: 20em; +} +.user .gameshidesession { + float:right; + width: 10em; +} + +.wide { margin-left:5%;margin-right:5%; } + +.over { + text-align:center; + margin-bottom:0.1em; +} + +.cardinput { + display:inline; + position:relative; + border: 1px solid #000; +} + +.cardinput img { width: 4em;} + +.cardinput:hover{ background-color:red;} + +div span img.button { width: 2em;} +div span img.tinybutton { width: 1.4em;} + +.gamestatuspre { + padding: 0 0.3em; + background-color: #f57900; +} +.gamestatusover { + padding:0 0.3em; + background-color: #e9b96e ; + color: #fff; +} +.gamestatusplay { + padding:0 0.3em; + background-color: #8ae234; +} + +.bigger{ font-size:larger;} + + +/* statistics using jquery*/ +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 tbody tr.odd td { background-color:#aeaeae; } +table.stats tbody tr.even td { 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 } + +table.stats thead tr .header { + background-image: url(bg.png); + background-repeat: no-repeat; + background-position: center right; + cursor: pointer; +} +table.stats tbody td { + padding: 4px; + background-color: #eaeaea; + vertical-align: top; +} +table.stats thead tr .headerSortUp { + background-image: url(asc.png); +} +table.stats thead tr .headerSortDown { + background-image: url(desc.png); +} +table.stats thead tr .headerSortDown, table.tablesorter thead tr .headerSortUp { + background-color: #8dbdd8; +} + + + +/* 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; +} + +/* the login form */ +.login form{ + width: 24em; + margin: 0.5em auto; + padding: 0.5em 0.5em 1.5em; + text-align: center; +} + +fieldset { + border: 2px solid #000; + padding: 0.5em 0.5em 0.75em; + background-color: #eee; +} + +.login label, .login input{ margin: 0.5em 0.5em 0.75em;} + +.login label{ + float:left; + width:7em; + text-align: left; +} + +.login input #email, .login input #password{ + width:9em; + float:right; +} + +.login .submitbutton { background-color: #fff;} +.login .submitbutton:hover { background-color: #aaa;} + +#openid_url { + background: #FFFFFF url('openid-icon-small.gif') no-repeat scroll 0pt 50%; + padding-left: 18px; +} + +table.openid td, table.openid th{ + padding: 0.0em 0.3em;; +} + +.newbiehint { + background-color: #fee; +} + +.vacation { + color: #666; + background-color: #fc3; +} + +div.table div img.gravatar, img.gravatar { + width: 4em; + height: 4em; + border: 3px solid #aaa; +} + +.highcall { + background-color: #fc3; +} + +.about { + margin-left: 20%; + margin-right: 20%; + padding-top: 10%; +} + +.about ul { + margin-left: 2em; +} + +.about div { + width:12em; + height: 6em; + margin: 2em; + padding: 1em; + float:left; + border: 1px solid black; +} + +.about .code { + background-color: #729fcf; +} +.about .database { + background-color: #8ae234; +} +.about .graphics { + background-color: #e9b96e; +} +.about .translation { + background-color: #fce94f; +} + + + -- cgit v1.2.3-18-g5258 From 5e3f5fe45c7d05a85f5e36637b3dd937e1ac3596 Mon Sep 17 00:00:00 2001 From: Arun Persaud Date: Tue, 4 May 2010 21:44:30 -0700 Subject: improved jquery on user home page the text will now say either show or hide not both depending on the situation. --- css/standard026.css | 744 --------------------------------------------------- css/standard027.css | 745 ++++++++++++++++++++++++++++++++++++++++++++++++++++ 2 files changed, 745 insertions(+), 744 deletions(-) delete mode 100644 css/standard026.css create mode 100644 css/standard027.css (limited to 'css') diff --git a/css/standard026.css b/css/standard026.css deleted file mode 100644 index 7f9d145..0000000 --- a/css/standard026.css +++ /dev/null @@ -1,744 +0,0 @@ -/* Copyright 2006, 2007, 2008, 2009, 2010 Arun Persaud - * - * This file is part of e-DoKo. - * - * e-DoKo is free software: you can redistribute it and/or modify - * it under the terms of the GNU General Public License as published by - * the Free Software Foundation, either version 3 of the License, or - * (at your option) any later version. - * - * e-DoKo is distributed in the hope that it will be useful, - * but WITHOUT ANY WARRANTY; without even the implied warranty of - * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the - * GNU General Public License for more details. - * - * You should have received a copy of the GNU General Public License - * along with e-DoKo. If not, see . - * - */ - -/* 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-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; -} - -/* sessions */ -.session { - width: 100%; - border-bottom: 1px solid #000; - text-align: center; -} -.session div.sessionrules { - width: 19em; - float: left; - text-align: left; -} -.session div.sessionrules div{ - display:none; - background-color: #fff; - border: 1px solid #000; - position:absolute; - z-index: 30; - padding:0.5em; -} -.session div.sessionrules:hover div{ display:block; } -.session div.sessionscore { - width: 19em; - float: right; - text-align: right; -} -.session div.sessionscore div{ - position:absolute; - width:12em; - right:3em; - display:none; - background-color: #fff; - border: 1px solid #000; - z-index: 30; -} -.session div.sessionscore:hover div{ display:block;} -.session img.rulesicon{ height: 1em; } - -.session .scoretable{ - height:20em; - overflow: auto; -} -.session table.score { - margin:0.5em; - width:10em; - border-collapse:collapse; -} - -/* 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 -} - -.total { - top:11em; - width: 14%; - left: 43%; -} -/* scoring */ -.total .re { - position: absolute; - left: -12em; - top:8em; - background-color: #eee; - z-index:15; -} -.total .contra { - position: absolute; - right: -14em; - top:8em; - background-color: #eee; - 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:37em; - margin:0; - left:0; - padding:0; -/* border: 3px solid blue; */ - top: 9.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:0%; - left:43.75%; -} -div.table div.table2 { - top:45%; - left:62.5%; -} -div.table div.table3 { - bottom:0%; - 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;*/ - padding:0.1em; - margin: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:2.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; - max-height:6em; - overflow: auto; - word-wrap: break-word; -} - -ul.tricks li div div span.comment span{ - display:block; - text-align:left; - border-top:1px solid green; -} - -.mycards { - margin:0; - margin-top:38.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; -} - -.gameinfo { - position:relative; - top:0em; - margin:0em; - padding:0em; - width:100%; - border-top: 2px solid gray; - background-color: #efaaaa; - text-align:center; -} - -.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%; } - -div.user ul { - list-style:none; -} - -div.user ul li { - position: relative; - padding:3px; - margin: 0px; - width: 80%; - min-height: 1.2em; - border-left: 2px solid #babdb6 ; - border-right: 2px solid #babdb6 ; - border-bottom: 2px solid #babdb6 ; -} - -div.user ul li:first-child { - border-top: 2px solid #babdb6 ; -} -.gamessession { - display:none; -} -.link { - text-decoration:underline; - color: blue; -} - -.user .gameid { - float: left; - width: 5em; -} -.user .turn { - padding-left: 1em; - float: left; - width: 20em; -} -.user .gameshidesession { - float:right; - width: 10em; -} - -.wide { margin-left:5%;margin-right:5%; } - -.over { - text-align:center; - margin-bottom:0.1em; -} - -.cardinput { - display:inline; - position:relative; - border: 1px solid #000; -} - -.cardinput img { width: 4em;} - -.cardinput:hover{ background-color:red;} - -div span img.button { width: 2em;} -div span img.tinybutton { width: 1.4em;} - -.gamestatuspre { - padding: 0 0.3em; - background-color: #f57900; -} -.gamestatusover { - padding:0 0.3em; - background-color: #e9b96e ; - color: #fff; -} -.gamestatusplay { - padding:0 0.3em; - background-color: #8ae234; -} - -.bigger{ font-size:larger;} - - -/* statistics using jquery*/ -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 tbody tr.odd td { background-color:#aeaeae; } -table.stats tbody tr.even td { 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 } - -table.stats thead tr .header { - background-image: url(bg.png); - background-repeat: no-repeat; - background-position: center right; - cursor: pointer; -} -table.stats tbody td { - padding: 4px; - background-color: #eaeaea; - vertical-align: top; -} -table.stats thead tr .headerSortUp { - background-image: url(asc.png); -} -table.stats thead tr .headerSortDown { - background-image: url(desc.png); -} -table.stats thead tr .headerSortDown, table.tablesorter thead tr .headerSortUp { - background-color: #8dbdd8; -} - - - -/* 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; -} - -/* the login form */ -.login form{ - width: 24em; - margin: 0.5em auto; - padding: 0.5em 0.5em 1.5em; - text-align: center; -} - -fieldset { - border: 2px solid #000; - padding: 0.5em 0.5em 0.75em; - background-color: #eee; -} - -.login label, .login input{ margin: 0.5em 0.5em 0.75em;} - -.login label{ - float:left; - width:7em; - text-align: left; -} - -.login input #email, .login input #password{ - width:9em; - float:right; -} - -.login .submitbutton { background-color: #fff;} -.login .submitbutton:hover { background-color: #aaa;} - -#openid_url { - background: #FFFFFF url('openid-icon-small.gif') no-repeat scroll 0pt 50%; - padding-left: 18px; -} - -table.openid td, table.openid th{ - padding: 0.0em 0.3em;; -} - -.newbiehint { - background-color: #fee; -} - -.vacation { - color: #666; - background-color: #fc3; -} - -div.table div img.gravatar, img.gravatar { - width: 4em; - height: 4em; - border: 3px solid #aaa; -} - -.highcall { - background-color: #fc3; -} - -.about { - margin-left: 20%; - margin-right: 20%; - padding-top: 10%; -} - -.about ul { - margin-left: 2em; -} - -.about div { - width:12em; - height: 6em; - margin: 2em; - padding: 1em; - float:left; - border: 1px solid black; -} - -.about .code { - background-color: #729fcf; -} -.about .database { - background-color: #8ae234; -} -.about .graphics { - background-color: #e9b96e; -} -.about .translation { - background-color: #fce94f; -} - - - diff --git a/css/standard027.css b/css/standard027.css new file mode 100644 index 0000000..0af0e3b --- /dev/null +++ b/css/standard027.css @@ -0,0 +1,745 @@ +/* Copyright 2006, 2007, 2008, 2009, 2010 Arun Persaud + * + * This file is part of e-DoKo. + * + * e-DoKo is free software: you can redistribute it and/or modify + * it under the terms of the GNU General Public License as published by + * the Free Software Foundation, either version 3 of the License, or + * (at your option) any later version. + * + * e-DoKo is distributed in the hope that it will be useful, + * but WITHOUT ANY WARRANTY; without even the implied warranty of + * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the + * GNU General Public License for more details. + * + * You should have received a copy of the GNU General Public License + * along with e-DoKo. If not, see . + * + */ + +/* 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-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; +} + +/* sessions */ +.session { + width: 100%; + border-bottom: 1px solid #000; + text-align: center; +} +.session div.sessionrules { + width: 19em; + float: left; + text-align: left; +} +.session div.sessionrules div{ + display:none; + background-color: #fff; + border: 1px solid #000; + position:absolute; + z-index: 30; + padding:0.5em; +} +.session div.sessionrules:hover div{ display:block; } +.session div.sessionscore { + width: 19em; + float: right; + text-align: right; +} +.session div.sessionscore div{ + position:absolute; + width:12em; + right:3em; + display:none; + background-color: #fff; + border: 1px solid #000; + z-index: 30; +} +.session div.sessionscore:hover div{ display:block;} +.session img.rulesicon{ height: 1em; } + +.session .scoretable{ + height:20em; + overflow: auto; +} +.session table.score { + margin:0.5em; + width:10em; + border-collapse:collapse; +} + +/* 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 +} + +.total { + top:11em; + width: 14%; + left: 43%; +} +/* scoring */ +.total .re { + position: absolute; + left: -12em; + top:8em; + background-color: #eee; + z-index:15; +} +.total .contra { + position: absolute; + right: -14em; + top:8em; + background-color: #eee; + 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:37em; + margin:0; + left:0; + padding:0; +/* border: 3px solid blue; */ + top: 9.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:0%; + left:43.75%; +} +div.table div.table2 { + top:45%; + left:62.5%; +} +div.table div.table3 { + bottom:0%; + 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;*/ + padding:0.1em; + margin: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:2.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; + max-height:6em; + overflow: auto; + word-wrap: break-word; +} + +ul.tricks li div div span.comment span{ + display:block; + text-align:left; + border-top:1px solid green; +} + +.mycards { + margin:0; + margin-top:38.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; +} + +.gameinfo { + position:relative; + top:0em; + margin:0em; + padding:0em; + width:100%; + border-top: 2px solid gray; + background-color: #efaaaa; + text-align:center; +} + +.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%; } + +div.user ul { + list-style:none; +} + +div.user ul li { + position: relative; + padding:3px; + margin: 0px; + width: 80%; + min-height: 1.2em; + border-left: 2px solid #babdb6 ; + border-right: 2px solid #babdb6 ; + border-bottom: 2px solid #babdb6 ; +} + +div.user ul li:first-child { + border-top: 2px solid #babdb6 ; +} +.gamessession { + display:none; +} + +.user .gameid { + float: left; + width: 5em; +} +.user .turn { + padding-left: 1em; + float: left; + width: 20em; +} + +.user .gameshidesession { + display: none; +} + +.user .gameshidesession , .user .gamesshowsession { + float:right; + width: 10em; +} + +.wide { margin-left:5%;margin-right:5%; } + +.over { + text-align:center; + margin-bottom:0.1em; +} + +.cardinput { + display:inline; + position:relative; + border: 1px solid #000; +} + +.cardinput img { width: 4em;} + +.cardinput:hover{ background-color:red;} + +div span img.button { width: 2em;} +div span img.tinybutton { width: 1.4em;} + +.gamestatuspre { + padding: 0 0.3em; + background-color: #f57900; +} +.gamestatusover { + padding:0 0.3em; + background-color: #e9b96e ; + color: #fff; +} +.gamestatusplay { + padding:0 0.3em; + background-color: #8ae234; +} + +.bigger{ font-size:larger;} + + +/* statistics using jquery*/ +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 tbody tr.odd td { background-color:#aeaeae; } +table.stats tbody tr.even td { 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 } + +table.stats thead tr .header { + background-image: url(bg.png); + background-repeat: no-repeat; + background-position: center right; + cursor: pointer; +} +table.stats tbody td { + padding: 4px; + background-color: #eaeaea; + vertical-align: top; +} +table.stats thead tr .headerSortUp { + background-image: url(asc.png); +} +table.stats thead tr .headerSortDown { + background-image: url(desc.png); +} +table.stats thead tr .headerSortDown, table.tablesorter thead tr .headerSortUp { + background-color: #8dbdd8; +} + + + +/* 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; +} + +/* the login form */ +.login form{ + width: 24em; + margin: 0.5em auto; + padding: 0.5em 0.5em 1.5em; + text-align: center; +} + +fieldset { + border: 2px solid #000; + padding: 0.5em 0.5em 0.75em; + background-color: #eee; +} + +.login label, .login input{ margin: 0.5em 0.5em 0.75em;} + +.login label{ + float:left; + width:7em; + text-align: left; +} + +.login input #email, .login input #password{ + width:9em; + float:right; +} + +.login .submitbutton { background-color: #fff;} +.login .submitbutton:hover { background-color: #aaa;} + +#openid_url { + background: #FFFFFF url('openid-icon-small.gif') no-repeat scroll 0pt 50%; + padding-left: 18px; +} + +table.openid td, table.openid th{ + padding: 0.0em 0.3em;; +} + +.newbiehint { + background-color: #fee; +} + +.vacation { + color: #666; + background-color: #fc3; +} + +div.table div img.gravatar, img.gravatar { + width: 4em; + height: 4em; + border: 3px solid #aaa; +} + +.highcall { + background-color: #fc3; +} + +.about { + margin-left: 20%; + margin-right: 20%; + padding-top: 10%; +} + +.about ul { + margin-left: 2em; +} + +.about div { + width:12em; + height: 6em; + margin: 2em; + padding: 1em; + float:left; + border: 1px solid black; +} + +.about .code { + background-color: #729fcf; +} +.about .database { + background-color: #8ae234; +} +.about .graphics { + background-color: #e9b96e; +} +.about .translation { + background-color: #fce94f; +} + + + -- cgit v1.2.3-18-g5258 From 6521e1d46f2541a7144c28e39e0a25bfea62a880 Mon Sep 17 00:00:00 2001 From: Arun Persaud Date: Tue, 29 Jun 2010 21:53:08 -0700 Subject: LAYOUT: fixed issue on user page when one player is on vacation used to have two floats, but when the second one went over two lines (due to vacation message) the layout didn't show up correctly anymore when collapsed. --- css/standard027.css | 745 ---------------------------------------------------- css/standard028.css | 744 +++++++++++++++++++++++++++++++++++++++++++++++++++ 2 files changed, 744 insertions(+), 745 deletions(-) delete mode 100644 css/standard027.css create mode 100644 css/standard028.css (limited to 'css') diff --git a/css/standard027.css b/css/standard027.css deleted file mode 100644 index 0af0e3b..0000000 --- a/css/standard027.css +++ /dev/null @@ -1,745 +0,0 @@ -/* Copyright 2006, 2007, 2008, 2009, 2010 Arun Persaud - * - * This file is part of e-DoKo. - * - * e-DoKo is free software: you can redistribute it and/or modify - * it under the terms of the GNU General Public License as published by - * the Free Software Foundation, either version 3 of the License, or - * (at your option) any later version. - * - * e-DoKo is distributed in the hope that it will be useful, - * but WITHOUT ANY WARRANTY; without even the implied warranty of - * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the - * GNU General Public License for more details. - * - * You should have received a copy of the GNU General Public License - * along with e-DoKo. If not, see . - * - */ - -/* 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-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; -} - -/* sessions */ -.session { - width: 100%; - border-bottom: 1px solid #000; - text-align: center; -} -.session div.sessionrules { - width: 19em; - float: left; - text-align: left; -} -.session div.sessionrules div{ - display:none; - background-color: #fff; - border: 1px solid #000; - position:absolute; - z-index: 30; - padding:0.5em; -} -.session div.sessionrules:hover div{ display:block; } -.session div.sessionscore { - width: 19em; - float: right; - text-align: right; -} -.session div.sessionscore div{ - position:absolute; - width:12em; - right:3em; - display:none; - background-color: #fff; - border: 1px solid #000; - z-index: 30; -} -.session div.sessionscore:hover div{ display:block;} -.session img.rulesicon{ height: 1em; } - -.session .scoretable{ - height:20em; - overflow: auto; -} -.session table.score { - margin:0.5em; - width:10em; - border-collapse:collapse; -} - -/* 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 -} - -.total { - top:11em; - width: 14%; - left: 43%; -} -/* scoring */ -.total .re { - position: absolute; - left: -12em; - top:8em; - background-color: #eee; - z-index:15; -} -.total .contra { - position: absolute; - right: -14em; - top:8em; - background-color: #eee; - 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:37em; - margin:0; - left:0; - padding:0; -/* border: 3px solid blue; */ - top: 9.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:0%; - left:43.75%; -} -div.table div.table2 { - top:45%; - left:62.5%; -} -div.table div.table3 { - bottom:0%; - 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;*/ - padding:0.1em; - margin: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:2.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; - max-height:6em; - overflow: auto; - word-wrap: break-word; -} - -ul.tricks li div div span.comment span{ - display:block; - text-align:left; - border-top:1px solid green; -} - -.mycards { - margin:0; - margin-top:38.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; -} - -.gameinfo { - position:relative; - top:0em; - margin:0em; - padding:0em; - width:100%; - border-top: 2px solid gray; - background-color: #efaaaa; - text-align:center; -} - -.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%; } - -div.user ul { - list-style:none; -} - -div.user ul li { - position: relative; - padding:3px; - margin: 0px; - width: 80%; - min-height: 1.2em; - border-left: 2px solid #babdb6 ; - border-right: 2px solid #babdb6 ; - border-bottom: 2px solid #babdb6 ; -} - -div.user ul li:first-child { - border-top: 2px solid #babdb6 ; -} -.gamessession { - display:none; -} - -.user .gameid { - float: left; - width: 5em; -} -.user .turn { - padding-left: 1em; - float: left; - width: 20em; -} - -.user .gameshidesession { - display: none; -} - -.user .gameshidesession , .user .gamesshowsession { - float:right; - width: 10em; -} - -.wide { margin-left:5%;margin-right:5%; } - -.over { - text-align:center; - margin-bottom:0.1em; -} - -.cardinput { - display:inline; - position:relative; - border: 1px solid #000; -} - -.cardinput img { width: 4em;} - -.cardinput:hover{ background-color:red;} - -div span img.button { width: 2em;} -div span img.tinybutton { width: 1.4em;} - -.gamestatuspre { - padding: 0 0.3em; - background-color: #f57900; -} -.gamestatusover { - padding:0 0.3em; - background-color: #e9b96e ; - color: #fff; -} -.gamestatusplay { - padding:0 0.3em; - background-color: #8ae234; -} - -.bigger{ font-size:larger;} - - -/* statistics using jquery*/ -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 tbody tr.odd td { background-color:#aeaeae; } -table.stats tbody tr.even td { 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 } - -table.stats thead tr .header { - background-image: url(bg.png); - background-repeat: no-repeat; - background-position: center right; - cursor: pointer; -} -table.stats tbody td { - padding: 4px; - background-color: #eaeaea; - vertical-align: top; -} -table.stats thead tr .headerSortUp { - background-image: url(asc.png); -} -table.stats thead tr .headerSortDown { - background-image: url(desc.png); -} -table.stats thead tr .headerSortDown, table.tablesorter thead tr .headerSortUp { - background-color: #8dbdd8; -} - - - -/* 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; -} - -/* the login form */ -.login form{ - width: 24em; - margin: 0.5em auto; - padding: 0.5em 0.5em 1.5em; - text-align: center; -} - -fieldset { - border: 2px solid #000; - padding: 0.5em 0.5em 0.75em; - background-color: #eee; -} - -.login label, .login input{ margin: 0.5em 0.5em 0.75em;} - -.login label{ - float:left; - width:7em; - text-align: left; -} - -.login input #email, .login input #password{ - width:9em; - float:right; -} - -.login .submitbutton { background-color: #fff;} -.login .submitbutton:hover { background-color: #aaa;} - -#openid_url { - background: #FFFFFF url('openid-icon-small.gif') no-repeat scroll 0pt 50%; - padding-left: 18px; -} - -table.openid td, table.openid th{ - padding: 0.0em 0.3em;; -} - -.newbiehint { - background-color: #fee; -} - -.vacation { - color: #666; - background-color: #fc3; -} - -div.table div img.gravatar, img.gravatar { - width: 4em; - height: 4em; - border: 3px solid #aaa; -} - -.highcall { - background-color: #fc3; -} - -.about { - margin-left: 20%; - margin-right: 20%; - padding-top: 10%; -} - -.about ul { - margin-left: 2em; -} - -.about div { - width:12em; - height: 6em; - margin: 2em; - padding: 1em; - float:left; - border: 1px solid black; -} - -.about .code { - background-color: #729fcf; -} -.about .database { - background-color: #8ae234; -} -.about .graphics { - background-color: #e9b96e; -} -.about .translation { - background-color: #fce94f; -} - - - diff --git a/css/standard028.css b/css/standard028.css new file mode 100644 index 0000000..bd34cb3 --- /dev/null +++ b/css/standard028.css @@ -0,0 +1,744 @@ +/* Copyright 2006, 2007, 2008, 2009, 2010 Arun Persaud + * + * This file is part of e-DoKo. + * + * e-DoKo is free software: you can redistribute it and/or modify + * it under the terms of the GNU General Public License as published by + * the Free Software Foundation, either version 3 of the License, or + * (at your option) any later version. + * + * e-DoKo is distributed in the hope that it will be useful, + * but WITHOUT ANY WARRANTY; without even the implied warranty of + * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the + * GNU General Public License for more details. + * + * You should have received a copy of the GNU General Public License + * along with e-DoKo. If not, see . + * + */ + +/* 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-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; +} + +/* sessions */ +.session { + width: 100%; + border-bottom: 1px solid #000; + text-align: center; +} +.session div.sessionrules { + width: 19em; + float: left; + text-align: left; +} +.session div.sessionrules div{ + display:none; + background-color: #fff; + border: 1px solid #000; + position:absolute; + z-index: 30; + padding:0.5em; +} +.session div.sessionrules:hover div{ display:block; } +.session div.sessionscore { + width: 19em; + float: right; + text-align: right; +} +.session div.sessionscore div{ + position:absolute; + width:12em; + right:3em; + display:none; + background-color: #fff; + border: 1px solid #000; + z-index: 30; +} +.session div.sessionscore:hover div{ display:block;} +.session img.rulesicon{ height: 1em; } + +.session .scoretable{ + height:20em; + overflow: auto; +} +.session table.score { + margin:0.5em; + width:10em; + border-collapse:collapse; +} + +/* 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 +} + +.total { + top:11em; + width: 14%; + left: 43%; +} +/* scoring */ +.total .re { + position: absolute; + left: -12em; + top:8em; + background-color: #eee; + z-index:15; +} +.total .contra { + position: absolute; + right: -14em; + top:8em; + background-color: #eee; + 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:37em; + margin:0; + left:0; + padding:0; +/* border: 3px solid blue; */ + top: 9.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:0%; + left:43.75%; +} +div.table div.table2 { + top:45%; + left:62.5%; +} +div.table div.table3 { + bottom:0%; + 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;*/ + padding:0.1em; + margin: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:2.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; + max-height:6em; + overflow: auto; + word-wrap: break-word; +} + +ul.tricks li div div span.comment span{ + display:block; + text-align:left; + border-top:1px solid green; +} + +.mycards { + margin:0; + margin-top:38.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; +} + +.gameinfo { + position:relative; + top:0em; + margin:0em; + padding:0em; + width:100%; + border-top: 2px solid gray; + background-color: #efaaaa; + text-align:center; +} + +.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%; } + +div.user ul { + list-style:none; +} + +div.user ul li { + position: relative; + padding:3px; + margin: 0px; + width: 80%; + min-height: 1.2em; + border-left: 2px solid #babdb6 ; + border-right: 2px solid #babdb6 ; + border-bottom: 2px solid #babdb6 ; +} + +div.user ul li:first-child { + border-top: 2px solid #babdb6 ; +} +.gamessession { + display:none; +} + +.user .gameid { + float: left; + width: 5em; +} +.user .turn { + padding-left: 1em; + width: 20em; +} + +.user .gameshidesession { + display: none; +} + +.user .gameshidesession , .user .gamesshowsession { + float:right; + width: 10em; +} + +.wide { margin-left:5%;margin-right:5%; } + +.over { + text-align:center; + margin-bottom:0.1em; +} + +.cardinput { + display:inline; + position:relative; + border: 1px solid #000; +} + +.cardinput img { width: 4em;} + +.cardinput:hover{ background-color:red;} + +div span img.button { width: 2em;} +div span img.tinybutton { width: 1.4em;} + +.gamestatuspre { + padding: 0 0.3em; + background-color: #f57900; +} +.gamestatusover { + padding:0 0.3em; + background-color: #e9b96e ; + color: #fff; +} +.gamestatusplay { + padding:0 0.3em; + background-color: #8ae234; +} + +.bigger{ font-size:larger;} + + +/* statistics using jquery*/ +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 tbody tr.odd td { background-color:#aeaeae; } +table.stats tbody tr.even td { 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 } + +table.stats thead tr .header { + background-image: url(bg.png); + background-repeat: no-repeat; + background-position: center right; + cursor: pointer; +} +table.stats tbody td { + padding: 4px; + background-color: #eaeaea; + vertical-align: top; +} +table.stats thead tr .headerSortUp { + background-image: url(asc.png); +} +table.stats thead tr .headerSortDown { + background-image: url(desc.png); +} +table.stats thead tr .headerSortDown, table.tablesorter thead tr .headerSortUp { + background-color: #8dbdd8; +} + + + +/* 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; +} + +/* the login form */ +.login form{ + width: 24em; + margin: 0.5em auto; + padding: 0.5em 0.5em 1.5em; + text-align: center; +} + +fieldset { + border: 2px solid #000; + padding: 0.5em 0.5em 0.75em; + background-color: #eee; +} + +.login label, .login input{ margin: 0.5em 0.5em 0.75em;} + +.login label{ + float:left; + width:7em; + text-align: left; +} + +.login input #email, .login input #password{ + width:9em; + float:right; +} + +.login .submitbutton { background-color: #fff;} +.login .submitbutton:hover { background-color: #aaa;} + +#openid_url { + background: #FFFFFF url('openid-icon-small.gif') no-repeat scroll 0pt 50%; + padding-left: 18px; +} + +table.openid td, table.openid th{ + padding: 0.0em 0.3em;; +} + +.newbiehint { + background-color: #fee; +} + +.vacation { + color: #666; + background-color: #fc3; +} + +div.table div img.gravatar, img.gravatar { + width: 4em; + height: 4em; + border: 3px solid #aaa; +} + +.highcall { + background-color: #fc3; +} + +.about { + margin-left: 20%; + margin-right: 20%; + padding-top: 10%; +} + +.about ul { + margin-left: 2em; +} + +.about div { + width:12em; + height: 6em; + margin: 2em; + padding: 1em; + float:left; + border: 1px solid black; +} + +.about .code { + background-color: #729fcf; +} +.about .database { + background-color: #8ae234; +} +.about .graphics { + background-color: #e9b96e; +} +.about .translation { + background-color: #fce94f; +} + + + -- cgit v1.2.3-18-g5258