80 lines
1.1 KiB
CSS
80 lines
1.1 KiB
CSS
* {
|
|
padding: 0;
|
|
margin: 0;
|
|
box-sizing: border-box;
|
|
color: inherit;
|
|
line-height: 1;
|
|
}
|
|
|
|
nav, div, fieldset {
|
|
display: flex;
|
|
flex-flow: column nowrap;
|
|
padding: 0.5rem;
|
|
gap: 0.5rem;
|
|
}
|
|
|
|
nav {
|
|
flex-flow: row nowrap;
|
|
}
|
|
|
|
fieldset {
|
|
display: grid;
|
|
grid-template-columns: auto 1fr;
|
|
flex-grow: 999999;
|
|
|
|
overflow-x: auto;
|
|
}
|
|
|
|
fieldset > label:after {
|
|
content: ":";
|
|
pointer-events: none;
|
|
}
|
|
|
|
input[type=submit] {
|
|
grid-column: 1 / 3;
|
|
padding: 0.25rem;
|
|
cursor: pointer;
|
|
}
|
|
|
|
legend {
|
|
font-weight: bold;
|
|
}
|
|
|
|
/* Colors */
|
|
|
|
:root {
|
|
--cl-fg: #222;
|
|
--cl-bg-page: #eee;
|
|
--cl-bg-block: #ddd;
|
|
--cl-bg-input: #ccc;
|
|
}
|
|
|
|
@media (prefers-color-scheme: dark) {
|
|
:root {
|
|
--cl-fg: #ddd;
|
|
--cl-bg-page: #333;
|
|
--cl-bg-block: #222;
|
|
--cl-bg-input: #444;
|
|
}
|
|
}
|
|
|
|
:root {
|
|
font-family: sans-serif;
|
|
background: var(--cl-bg-page);
|
|
color: var(--cl-fg);
|
|
}
|
|
|
|
nav, fieldset, table {
|
|
background: var(--cl-bg-block);
|
|
}
|
|
|
|
input {
|
|
border: 1px solid var(--cl-fg);
|
|
background: var(--cl-bg-input);
|
|
}
|
|
|
|
input[type=submit]:hover,
|
|
tr:nth-child(even) {
|
|
background: var(--cl-bg-page);
|
|
}
|