168 lines
2 KiB
CSS
168 lines
2 KiB
CSS
@import url("/css/fonts.css");
|
|
|
|
html {
|
|
background: hsl(249, 19%, 13%);
|
|
}
|
|
|
|
html, body, button, input {
|
|
margin: 0;
|
|
color: white;
|
|
font-family: "Fredoka", Arial, Helvetica, sans-serif;
|
|
}
|
|
|
|
* {
|
|
box-sizing: border-box;
|
|
}
|
|
|
|
*, *:before, *:after {
|
|
box-sizing: inherit;
|
|
}
|
|
|
|
a {
|
|
color: hsl(240 100% 80%);
|
|
}
|
|
|
|
button, input {
|
|
padding: 0.125rem 0.25rem;
|
|
background: hsl(251, 17%, 20%);
|
|
border: 1px solid hsl(248 11% 46%);
|
|
border-radius: 0.25rem;
|
|
}
|
|
|
|
.nm {
|
|
margin: 0;
|
|
}
|
|
|
|
.nmb {
|
|
margin-bottom: 0;
|
|
}
|
|
|
|
.nmbb {
|
|
margin-top: 0;
|
|
margin-left: 0;
|
|
margin-right: 0;
|
|
}
|
|
|
|
.err,
|
|
.suc {
|
|
width: 100%;
|
|
padding: 3px;
|
|
border-radius: 4px;
|
|
margin-bottom: 2vh;
|
|
}
|
|
|
|
.err {
|
|
background: hsl(0, 100%, 50%);
|
|
color: white;
|
|
}
|
|
|
|
.suc {
|
|
background: hsl(150, 100%, 50%);
|
|
color: black;
|
|
}
|
|
|
|
.err p,
|
|
.suc p {
|
|
margin: 0;
|
|
}
|
|
|
|
.err a {
|
|
color: white;
|
|
}
|
|
|
|
.suc a {
|
|
color: black;
|
|
}
|
|
|
|
.field {
|
|
margin-bottom: 1vh;
|
|
}
|
|
|
|
.header {
|
|
padding: 1rem;
|
|
padding-bottom: 2.1rem;
|
|
text-align: center;
|
|
background: hsl(249 15% 28%);
|
|
}
|
|
|
|
.top-of-header {
|
|
text-align: right;
|
|
margin-bottom: 1rem;
|
|
}
|
|
|
|
.header a {
|
|
display: inline-block;
|
|
width: fit-content;
|
|
}
|
|
|
|
.header h2 {
|
|
width: fit-content;
|
|
margin: 0 auto;
|
|
}
|
|
|
|
.header p {
|
|
margin: 10px auto;
|
|
}
|
|
|
|
.modal {
|
|
padding: 1rem;
|
|
padding-bottom: 2rem;
|
|
}
|
|
|
|
.modal {
|
|
max-width: 1000px;
|
|
margin: 0 auto;
|
|
}
|
|
|
|
.footer {
|
|
text-align: center;
|
|
}
|
|
|
|
.require-script {
|
|
display: none; /* dont mess with this as it fucks with users w/o js */
|
|
}
|
|
|
|
.prgbar {
|
|
width: 100%;
|
|
background: hsl(253, 100%, 50%);
|
|
height: 10px;
|
|
}
|
|
|
|
.prgbar .inner {
|
|
background: hsl(240 100% 80%);
|
|
height: 10px;
|
|
width: 0%;
|
|
transition: width 0.2s;
|
|
}
|
|
|
|
@media (prefers-reduced-motion) {
|
|
.prgbar .inner {
|
|
transition: none;
|
|
}
|
|
}
|
|
|
|
pre.preview {
|
|
width: calc(100 - 2vw);
|
|
background: white;
|
|
color: black;
|
|
padding: 2vh 2vw;
|
|
overflow: auto;
|
|
border: 0;
|
|
height: 50vh;
|
|
}
|
|
|
|
code {
|
|
background: #000000;
|
|
color: #ffffff;
|
|
padding: 2px;
|
|
}
|
|
|
|
code.nbg {
|
|
background: transparent;
|
|
color: inherit;
|
|
}
|
|
|
|
.fw {
|
|
min-width: 100%;
|
|
display: inline-block;
|
|
} |