X-Git-Url: https://git.sesse.net/?p=remoteglot;a=blobdiff_plain;f=www%2Fcss%2Fremoteglot.css;h=e0f9444138a83842253f5b7ff9b10faaae9028c8;hp=ca956822dd69d01ad593df07fa02e5b5d274955e;hb=f71f5c94d093acda1b39d23cf7a71a21c6a3122b;hpb=aacc612ada3aa00ac9db0bbf785ea7b464deb344 diff --git a/www/css/remoteglot.css b/www/css/remoteglot.css index ca95682..e0f9444 100644 --- a/www/css/remoteglot.css +++ b/www/css/remoteglot.css @@ -1,14 +1,37 @@ body { font-family: sans-serif; + background: white; + color: black; +} +h1 { + margin-top: 0em; } h3 { margin-top: 1em; margin-bottom: 0; } -#score { +#scorecontainer { font-size: x-large; margin-top: 0; } +#score { + float: left; +} +#scoresparkcontainer { + overflow: hidden; +} +#scorespark { + margin-left: 0.5em; + margin-right: 0.5em; +} +#lowdepthcontainer { + font-size: x-small; + margin-top: 0; +} +#pvcontainer { + clear: left; + margin-top: 1em; +} .window { position: absolute; width: 0px; @@ -30,6 +53,9 @@ h3 { .vir path.l1arrow { opacity: 1.0; } +#news { + font-size: smaller; +} #credits { font-size: smaller; } @@ -80,14 +106,40 @@ p { #hiddenboard { display: none; } -#numviewers { +#bottompanel { display: block; width: 100%; - text-align: center; font-size: smaller; margin-top: 0.5em; margin-bottom: 0; } +#numviewers { + width: auto; + text-align: center; +} +#whiteinfo { + float: left; + text-align: left; + min-width: 20%; +} +#blackinfo { + float: right; + text-align: right; + min-width: 20%; + margin-right: 5px; +} +#whiteimbalance img, #blackimbalance img { + vertical-align: text-top; +} +#whiteimbalance { + margin-left: 5px; +} +#blackimbalance { + margin-right: 5px; +} +.running-clock { + font-weight: bold; +} #analysis { display: block; min-width: 400px; @@ -132,3 +184,45 @@ a.move:hover { #linenav { display: none; } +#lomonosov { + display: none; +} + +#games { + font-size: smaller; + margin-bottom: 0.5em; +} +.game { + padding: 0.25em 1em 0.25em 1em; + margin: 0; + background: #eee; + border-right: 1px solid #bbb; +} +.game:last-of-type { + border-right: none; +} + +.pv, #pv, #history, #lowdepth .depth { /* Mute move colors a bit. */ + color: #555; +} + +@media (prefers-color-scheme: dark) { + +body { + background: black; + color: #eee; +} +.pv, #pv, #history { /* Mute move colors a bit. */ + color: #bbb; +} +#numviewers { + color: #bbb; +} +a.move, a.move:link { + color: #eee; +} +a:link { + color: rgb(128,128,238); +} + +}