datatrash/static/index.css

118 lines
1.4 KiB
CSS
Raw Normal View History

2020-08-03 00:41:36 +00:00
:root {
2020-08-19 14:25:03 +00:00
--bg: #222222;
2020-08-03 00:41:36 +00:00
--fg: #e9e9e9;
}
2020-08-19 14:25:03 +00:00
2021-06-27 23:11:10 +00:00
html {
box-sizing: border-box;
}
*,
*::before,
*::after {
box-sizing: inherit;
}
2020-07-08 19:26:46 +00:00
body {
2020-08-19 14:25:03 +00:00
background-color: var(--bg);
2021-09-09 20:18:42 +00:00
min-height: 100vh;
margin: 0;
2020-07-08 19:26:46 +00:00
}
main {
2020-08-03 00:41:36 +00:00
color: var(--fg);
font-family: sans;
2020-07-08 19:26:46 +00:00
max-width: 1200px;
margin: 0 auto;
padding: 1rem;
2020-07-08 19:26:46 +00:00
}
2020-07-09 17:27:24 +00:00
h1 > a,
h1 > a:visited {
2020-08-03 00:41:36 +00:00
color: var(--fg);
2020-07-09 17:27:24 +00:00
}
a {
color: cornflowerblue;
}
a:visited {
color: mediumorchid;
}
label {
2020-08-03 00:41:36 +00:00
display: inline-block;
margin-right: 0.25em;
2020-08-03 00:41:36 +00:00
margin-bottom: 0.5em;
}
2020-07-09 17:27:24 +00:00
input,
select,
textarea,
.button {
display: inline-block;
2020-08-19 14:25:03 +00:00
background-color: var(--bg);
2020-08-03 00:41:36 +00:00
color: var(--fg);
2020-07-09 17:27:24 +00:00
padding: 0.5rem;
2020-08-03 00:41:36 +00:00
border: 2px solid var(--fg);
2020-07-09 17:27:24 +00:00
border-radius: 5px;
margin-bottom: 1rem;
max-width: calc(100vw - 2rem);
2020-07-09 17:27:24 +00:00
}
textarea {
height: 30vh;
}
2021-09-09 20:18:42 +00:00
.hidden {
display: none;
}
input[type="checkbox"] {
margin-bottom: 1.5rem;
}
.button {
cursor: pointer;
2021-08-18 21:22:50 +00:00
font-family: sans;
font-weight: normal;
font-size: 1rem;
2021-09-09 20:18:42 +00:00
margin-right: 0.5rem;
user-select: none;
}
a.button {
text-decoration: none;
}
a.button:visited {
2020-08-03 00:41:36 +00:00
color: var(--fg);
}
.button:hover {
background-color: #444444;
}
.button.main {
2020-08-03 00:41:36 +00:00
background-color: #007600;
2020-07-09 17:27:24 +00:00
}
.button.main:hover {
background-color: forestgreen;
}
.usage {
margin-top: 2em;
overflow: auto;
}
2021-09-09 20:18:42 +00:00
.large-link {
display: block;
margin-bottom: 1em;
max-height: 60vh;
overflow-y: auto;
font-size: clamp(1rem, 3vw, 1.5rem);
overflow-wrap: anywhere;
}