1
0

Reorganised CSS. Set min-height for body to 100vh.

This commit is contained in:
Alexander Andreev 2023-08-23 04:49:30 +04:00
parent c06eaecbfc
commit 8b39e60a01
Signed by: Arav
GPG Key ID: D22A817D95815393

View File

@ -30,6 +30,8 @@
::placeholder { color: var(--primary-color); } ::placeholder { color: var(--primary-color); }
.hidden { display: none; }
a { a {
color: var(--primary-color); color: var(--primary-color);
text-decoration: none; } text-decoration: none; }
@ -58,8 +60,6 @@ h2 {
font-size: 1.4rem; font-size: 1.4rem;
margin: 1rem 0; } margin: 1rem 0; }
.hidden { display: none; }
html { margin-left: calc(100vw - 100%); } html { margin-left: calc(100vw - 100%); }
body { body {
@ -69,6 +69,7 @@ body {
font-size: 1.1rem; font-size: 1.1rem;
margin: 0 auto; margin: 0 auto;
max-width: 960px; max-width: 960px;
min-height: 100vh;
width: 98%; } width: 98%; }
header { header {
@ -93,7 +94,6 @@ header svg text:last-child { font-size: .88rem; }
@-moz-document url-prefix() { @-moz-document url-prefix() {
header svg text:first-child { font-size: 2rem; } } header svg text:first-child { font-size: 2rem; } }
nav { margin-top: .5rem; } nav { margin-top: .5rem; }
nav a { font-variant: small-caps; } nav a { font-variant: small-caps; }
@ -104,6 +104,60 @@ nav h1 {
section { margin-top: 1rem; } section { margin-top: 1rem; }
input[name="filter"] {
background-color: var(--background-color);
border: none;
border-bottom: 1px solid var(--primary-color);
color: var(--text-color);
font: inherit;
width: 100%; }
table {
overflow-y: scroll;
width: 100%; }
tr { vertical-align: top; }
tr:hover,
tr:focus-within {
background-color: var(--primary-color);
color: white; }
tr:hover a,
tr:focus-within a { color: white; }
th { text-align: left; }
th:nth-child(2),
th:last-child {
width: 1%;
white-space: nowrap; }
th,
td { line-break: strict; }
th:nth-child(2),
td:nth-child(2) { padding: 0 1rem; }
td a {
display: block;
width: 100%; }
td a:hover { transition: none; }
td:nth-child(2),
td:last-child { white-space: nowrap; }
thead tr th.clickable { cursor: pointer; }
thead tr th.clickable:hover { color: var(--secondary-color); }
thead tr th.clickable:not(.sort-up):not(.sort-down)::after { content: '⇅'; }
thead tr th.clickable.sort-up::after { content: '↑'; }
thead tr th.clickable.sort-down::after { content: '↓'; }
#overlay { #overlay {
align-items: center; align-items: center;
background-color: var(--overlay-background-color); background-color: var(--overlay-background-color);
@ -151,52 +205,6 @@ section { margin-top: 1rem; }
background-color: var(--background-color); background-color: var(--background-color);
color: var(--primary-color); } color: var(--primary-color); }
input[name="filter"] {
background-color: var(--background-color);
border: none;
border-bottom: 1px solid var(--primary-color);
color: var(--text-color);
font: inherit;
width: 100%; }
table { overflow-y: scroll; width: 100%; }
tr { vertical-align: top; }
tr:hover,
tr:focus-within { background-color: var(--primary-color); color: white; }
tr:hover a,
tr:focus-within a { color: white; }
th { text-align: left; }
th:nth-child(2),
th:last-child { width: 1%; white-space: nowrap; }
th,
td { line-break: strict; }
th:nth-child(2),
td:nth-child(2) { padding: 0 1rem; }
td a { display: block; width: 100%; }
td a:hover { transition: none; }
td:nth-child(2),
td:last-child { white-space: nowrap; }
thead tr th.clickable { cursor: pointer; }
thead tr th.clickable:hover { color: var(--secondary-color); }
thead tr th.clickable:not(.sort-up):not(.sort-down)::after { content: '⇅'; }
thead tr th.clickable.sort-up::after { content: '↑'; }
thead tr th.clickable.sort-down::after { content: '↓'; }
#error { #error {
font-size: 3.5rem; font-size: 3.5rem;
line-height: 5rem; line-height: 5rem;