161 lines
2.6 KiB
CSS
161 lines
2.6 KiB
CSS
|
|
@font-face {
|
|
font-family: "JetBrains Mono";
|
|
src: url("fonts/JetBrainsMono-Regular.woff2");
|
|
}
|
|
|
|
body {
|
|
background-color: #0a0a0a;
|
|
color: #fafafa;
|
|
|
|
max-width: clamp(600px, 35%, 800px);
|
|
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;
|
|
}
|
|
|
|
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-radius: 5px;
|
|
border-style: solid;
|
|
border-color: #8aadf4;
|
|
background-color: #242e42;
|
|
|
|
padding: 2px 8px 2px 15px;
|
|
}
|
|
|
|
.insert-warning {
|
|
border-radius: 5px;
|
|
border-style: solid;
|
|
border-color: #e71853;
|
|
background-color: #42242c;
|
|
|
|
padding: 2px 8px 2px 15px;
|
|
}
|
|
|
|
.insert-important {
|
|
border-radius: 5px;
|
|
border-style: solid;
|
|
border-color: #f5640a;
|
|
background-color: #32241b;
|
|
|
|
padding: 2px 8px 2px 15px;
|
|
}
|
|
|
|
.subtitle {
|
|
font-family: "JetBrains Mono", monospace;
|
|
color: #8bd5ca
|
|
}
|
|
|
|
|
|
blockquote {
|
|
border-left-width: 4px;
|
|
border-left-color: #8aadf4;
|
|
border-left-style: solid;
|
|
padding-left: 10px;
|
|
margin-left: 20px;
|
|
margin-right: 20px;
|
|
}
|
|
|
|
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;
|
|
|
|
border-radius: 5px;
|
|
border-style: solid;
|
|
border-color: #e71853;
|
|
background-color: #42242c;
|
|
|
|
padding: 8px 8px 8px 15px;
|
|
}
|
|
|
|
/*
|
|
Suggested css snippet for making code blocks suck less
|
|
see https://www.getzola.org/documentation/content/syntax-highlighting/
|
|
*/
|
|
pre {
|
|
padding: 1rem;
|
|
overflow: auto;
|
|
}
|
|
pre[data-linenos] {
|
|
padding: 1rem 0;
|
|
}
|
|
pre table td {
|
|
padding: 0;
|
|
}
|
|
pre table td:nth-of-type(1) {
|
|
text-align: center;
|
|
user-select: none;
|
|
}
|
|
pre table {
|
|
width: 100%;
|
|
border-collapse: collapse;
|
|
}
|