X-Git-Url: https://git.sesse.net/?p=remoteglot;a=blobdiff_plain;f=www%2Fcss%2Fremoteglot.css;h=b0aadab79dffc7c6e39ab948216d252b42e50ad2;hp=543a5b62122fbe5e73ae3abc4421618ce63185fd;hb=f662b895fc40db21c3d667b16e5a8f2d3f55dfd7;hpb=b8f446ba1876d331cb43659eeb2d0737b174cb5c diff --git a/www/css/remoteglot.css b/www/css/remoteglot.css index 543a5b6..b0aadab 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; @@ -35,6 +39,11 @@ td { p { margin-top: 0; } +#sortbyscoreholder { + font-size: smaller; + margin: 0; + font-style: italic; +} #refutationlines { font-size: smaller; } @@ -57,16 +66,65 @@ p { .black-3c85d.nonuglyhighlight { background-color: #9ab6a6; } -#board { - display: block; - float: left; +#boardcontainer { width: 400px; - height: 400px; margin-right: 1em; margin-bottom: 1em; + float: left; +} +#board { + display: block; + width: 100%; + padding: 0; +} +#hiddenboard { + display: none; +} +#numviewers { + display: block; + width: 100%; + text-align: center; + font-size: smaller; + margin-top: 0.5em; + margin-bottom: 0; } #analysis { display: block; min-width: 400px; overflow: hidden; } + +/* 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) { + #boardcontainer { + width: 100%; + float: none; + } + #analysis { + min-width: 0; + } +} + +/* If there is almost space for the analysis, shrink the board a bit, too. */ +@media all and (min-width: 500px) and (max-width: 810px) { + #boardcontainer { + float: left; + width: 50%; + } + #analysis { + min-width: 0; + } +} +a.move { + color: black; + text-decoration: none; +} +a.move:hover { + font-weight: bold; + text-decoration: underline; +} + +#linenav { + display: none; +}