X-Git-Url: https://git.sesse.net/?a=blobdiff_plain;f=www%2Fcss%2Fremoteglot.css;h=09b6b089cee4884d7bbcff3eab857d37c4efafd4;hb=HEAD;hp=672e583d7032d80049b90cad9d112f923cb387f6;hpb=df46572ddfcbd6a247b8f37b0e7a3842b7b402d2;p=remoteglot diff --git a/www/css/remoteglot.css b/www/css/remoteglot.css index 672e583..a2e221f 100644 --- a/www/css/remoteglot.css +++ b/www/css/remoteglot.css @@ -1,4 +1,4 @@ -:root { +html { color-scheme: light dark; font-family: sans-serif; background: white; @@ -14,42 +14,41 @@ h3 { #scorecontainer { font-size: x-large; margin-top: 0; + display: grid; + grid-template-columns: max-content 1fr; + gap: 12px; } #score { - float: left; + grid-column: 1; } #scoresparkcontainer { + grid-column: 2; overflow: hidden; + height: 0.85em; + margin-top: 0.15em; + width: 100%; } -#scorespark { - margin-left: 0.5em; - margin-right: 0.5em; +#sparklinehover { + position: absolute; + display: none; + background-color: rgba(0, 0, 0, 0.6); + color: white; + font-size: 10px; + white-space: nowrap; + padding: 5px; + border: 1px solid white; + z-index: 10000; } #pvcontainer { clear: left; margin-top: 1em; } -.window { - position: absolute; - width: 0px; - height: 0px; - opacity: 0.0; -} .c1 { opacity: 0.75; } -.l1arrow { - opacity: 1.0; -} .hidden { display: none; } -.vir path { - opacity: 0.0; -} -.vir path.l1arrow { - opacity: 1.0; -} #news { font-size: smaller; } @@ -99,13 +98,14 @@ p { display: block; width: 100%; padding: 0; + transform: translate(0,0); /* Make it a containing block. */ } #hiddenboard { display: none; } #bottompanel { display: block; - width: 100%; + width: calc(100% + 4px); font-size: smaller; margin-top: 0.5em; margin-bottom: 0; @@ -181,9 +181,6 @@ a.move:hover { #linenav { display: none; } -#lomonosov { - display: none; -} #games { font-size: smaller; @@ -208,6 +205,11 @@ a.move:hover { filter: invert(1); } +.imbalance-piece, .imbalance-inverted-piece { + width: 15px; + height: 15px; +} + @media (prefers-color-scheme: dark) { :root { @@ -232,3 +234,5 @@ a:link { .imbalance-inverted-piece { display: initial; } + +}