X-Git-Url: https://git.sesse.net/?p=remoteglot;a=blobdiff_plain;f=www%2Fcss%2Fremoteglot.css;h=32402b2ecde5352c5a1f8c9a9fb617ea99f84b89;hp=6009a24cd7b2d41cdf6203f5f7c91796f12274cb;hb=7dfa8135cabec7261a2a255e7b5edd679e75da0b;hpb=86873d4101b0bcd4e96ae79a975279c65d889619 diff --git a/www/css/remoteglot.css b/www/css/remoteglot.css index 6009a24..32402b2 100644 --- a/www/css/remoteglot.css +++ b/www/css/remoteglot.css @@ -5,6 +5,10 @@ h3 { margin-top: 1em; margin-bottom: 0; } +#score { + font-size: x-large; + margin-top: 0; +} .window { position: absolute; width: 0px; @@ -26,6 +30,9 @@ h3 { .vir path.l1arrow { opacity: 1.0; } +#news { + font-size: smaller; +} #credits { font-size: smaller; } @@ -35,6 +42,11 @@ td { p { margin-top: 0; } +#sortbyscoreholder { + font-size: smaller; + margin: 0; + font-style: italic; +} #refutationlines { font-size: smaller; } @@ -57,14 +69,45 @@ p { .black-3c85d.nonuglyhighlight { background-color: #9ab6a6; } -#board { - display: block; - float: left; +#boardcontainer { width: 400px; margin-right: 1em; margin-bottom: 1em; + float: left; +} +#board { + display: block; + width: 100%; padding: 0; } +#hiddenboard { + display: none; +} +#bottompanel { + display: block; + width: 100%; + font-size: smaller; + margin-top: 0.5em; + margin-bottom: 0; +} +#numviewers { + width: auto; + text-align: center; +} +#whiteclock { + float: left; + width: 20%; + text-align: left; +} +#blackclock { + float: right; + width: 20%; + text-align: right; + margin-right: 5px; +} +.running-clock { + font-weight: bold; +} #analysis { display: block; min-width: 400px; @@ -74,7 +117,7 @@ p { /* If the board is too wide for the screen, shrink it to fit, * and then put the analysis below. */ @media all and (max-width: 400px) { - #board { + #boardcontainer { width: 100%; float: none; } @@ -85,7 +128,7 @@ p { /* If there is almost space for the analysis, shrink the board a bit, too. */ @media all and (min-width: 500px) and (max-width: 810px) { - #board { + #boardcontainer { float: left; width: 50%; } @@ -93,3 +136,54 @@ p { min-width: 0; } } +a.move { + color: black; + text-decoration: none; +} +a.move.highlight { + color: red; + font-weight: bold; +} +a.move:hover { + font-weight: bold; + text-decoration: underline; +} + +#linenav { + display: none; +} + +/* Opening display */ +.num { + padding-left: 0.5em; + padding-right: 0.5em; + text-align: right; +} +.winbars { + width: 20em; + font-size: small; + font-weight: bold; + text-align: center; +} +.winbars table { + border: 1px solid black; + width: 100%; + border-collapse: collapse; +} +.winbars table td { + border: 1px solid black; + overflow: hidden; + max-width: 0px; +} +.winbars table td.white { + background-color: white; + color: black; +} +.winbars table td.draw { + background-color: gray; + color: white; +} +.winbars table td.black { + background-color: black; + color: white; +}