website/static/main.css
2024-11-12 22:09:20 -07:00

140 lines
No EOL
2.2 KiB
CSS

@import url('https://fonts.googleapis.com/css?family=JetBrains Mono');
@font-face {
font-family: "JetBrains Mono", monospace;
src: url("/fonts/JetBrainsMono-Regular.woff2")
}
body {
background-color: #0a0a0a;
max-width: max(800px, 45%);
height: 100vh;
margin: auto;
padding-left: 8px;
padding-right: 8px;
display: flex;
flex-direction: column;
justify-content: flex-start;
}
:is(h1, h2, h3) {
font-family: "JetBrains Mono", monospace;
color: #8aadf4;
}
:is(a:link, a:visited) {
color: #91d7e3;
}
a:hover {
color: #8eeacd;
}
.subtitle {
color: #8bd5ca
}
.content {
}
header {
font-family: "JetBrains Mono", monospace;
padding: 10px;
nav {
display: flex;
flex-direction: row;
justify-content: flex-end;
a {
padding-left: 4px;
padding-right: 4px;
color: #8aadf4;
}
}
}
footer {
align-self: flex-end;
justify-self: flex-end;
width: 100%;
margin-top: auto;
div {
align-self: center;
padding: 5px;
}
hr {
border: 2px dotted #89b4fa
}
text-align: center;
font-size: 14px;
font-family: "JetBrains Mono", monospace;
}
.insert-note {
border-style: dotted;
border-width: 3px;
border-radius: 5px;
padding: 8px;
background-color: hsl(199deg, 76%, 20%);
border-color: hsl(189deg, 71%, 30%);
}
.insert-warning {
border-style: dashed;
border-width: 3px;
border-radius: 5px;
padding: 8px;
background-color: hsl(343deg, 81%, 20%);
border-color: hsl(23deg, 92%, 40%);
}
.insert-important {
border-style: dashed;
border-width: 3px;
border-radius: 5px;
padding: 8px;
background-color: hsl(23deg, 92%, 30%);
border-color: hsl(350deg, 65%, 77%);
}
figure {
img {
max-width: 100%;
display: block;
margin: 0 auto;
}
margin: 0 auto;
}
figcaption {
width: 100%;
text-align: center;
margin: 5px auto;
}
#new-site-warning {
margin-top: 10px;
padding: 8px;
background-color: hsl(343deg, 81%, 20%);
border-color: hsl(23deg, 92%, 40%);
border-style: dashed;
border-radius: 5px;
border-width: 3px;
}