I messed up the format so it went to pull the file grom github instead of the server, oops
131 lines
2.5 KiB
CSS
131 lines
2.5 KiB
CSS
/* @font-face {
|
|
font-family: "Noto Sans";
|
|
src: local("Noto Sans"), url("/static/fonts/NotoSansDisplay-Regular.ttf")
|
|
format("truetype"), url("/static/fonts/NotoSans-Regular.ttf")
|
|
format("truetype");
|
|
} */
|
|
|
|
@font-face {
|
|
font-family: "Comic Shanns";
|
|
src: local("Comic Shanns Regular");
|
|
/* ,url("/static/fonts/comic shanns.otf")
|
|
format("opentype"), url("/static/fonts/comic shanns 2.ttf")
|
|
format("truetype"); */
|
|
}
|
|
|
|
@font-face {
|
|
font-family: "Comic Mono";
|
|
src: local("Comic Mono"), url("/static/fonts/ComicMono.ttf")
|
|
format("truetype"),
|
|
url("https://dtinth.github.io/comic-mono-font/ComicMono.ttf")
|
|
format("truetype");
|
|
}
|
|
|
|
:root {
|
|
--first-colour: #16111a;
|
|
--second-colour: #21042c;
|
|
--third-colour: #2e236c;
|
|
--fourth-colour: #f5efff;
|
|
|
|
--border: #27272a;
|
|
}
|
|
|
|
html {
|
|
background-color: var(--first-colour);
|
|
font-family: "Comic Mono", "Comic Shanns", "Comic Sans", "Comic Sans MS",
|
|
"Chalkboard", "ChalkboardSE-Regular", "Noto Sans", sans-serif;
|
|
font-size: larger;
|
|
display: flex;
|
|
flex-direction: column;
|
|
align-items: center;
|
|
justify-content: center;
|
|
}
|
|
|
|
body {
|
|
/* margin: 0 auto; */
|
|
/* width: 100%; */
|
|
/* max-width: 40em; */
|
|
padding: 2em;
|
|
/* padding: 1rem; */
|
|
/* line-height: 1.5; */
|
|
color: var(--fourth-colour);
|
|
}
|
|
|
|
@media screen and (max-width: 899px) {
|
|
body {
|
|
width: 95%;
|
|
padding-top: 0.5em;
|
|
padding-left: 0;
|
|
padding-right: 0;
|
|
flex-wrap: wrap;
|
|
}
|
|
}
|
|
|
|
a {
|
|
color: var(--fourth-colour);
|
|
text-decoration: underline 2px;
|
|
text-underline-offset: 2px;
|
|
text-decoration-color: #00000000;
|
|
}
|
|
|
|
a:hover {
|
|
text-decoration-color: #fff;
|
|
transition: text-decoration-color 0.25s;
|
|
}
|
|
|
|
/* h1 { */
|
|
/* margin: 1rem 0; */
|
|
/* font-size: 2.5rem; */
|
|
/* } */
|
|
|
|
/* footer { */
|
|
/* display: flex; */
|
|
/* gap: 1rem; */
|
|
/* margin-top: 2rem; */
|
|
/* background-color: var(--third-colour); */
|
|
/* border-radius: 4px; */
|
|
/* padding: 0.5rem; */
|
|
/* } */
|
|
|
|
.badge {
|
|
image-rendering: pixelated;
|
|
min-width: 88px;
|
|
min-height: 31px;
|
|
padding: 4px;
|
|
}
|
|
|
|
.linked-buttons {
|
|
outline-style: dashed;
|
|
width: fit-content;
|
|
display: inline-flex;
|
|
}
|
|
|
|
.container {
|
|
background-color: var(--second-colour);
|
|
border-radius: 8px;
|
|
padding: 16px;
|
|
display: flex;
|
|
flex-direction: column;
|
|
/* flex: content; */
|
|
}
|
|
|
|
.greetButton {
|
|
color: var(--fourth-colour);
|
|
background-color: var(--second-colour);
|
|
border-color: var(--second-colour);
|
|
transition-duration: 0.4s;
|
|
}
|
|
|
|
.greetButton:hover {
|
|
color: var(--third-colour);
|
|
background-color: var(--fourth-colour);
|
|
border-color: var(--fourth-colour);
|
|
}
|
|
|
|
.svg-inline {
|
|
overflow: visible;
|
|
box-sizing: content-box;
|
|
display: inline-block;
|
|
height: 1em;
|
|
vertical-align: -0.125em;
|
|
}
|