diff --git a/serve/assets/css/style.css b/serve/assets/css/style.css index fb23669..eab6f0d 100644 --- a/serve/assets/css/style.css +++ b/serve/assets/css/style.css @@ -1,3 +1,25 @@ +@font-face { + font-family: OverpassNerd; + src: url("/assets/fonts/overpass/OverpassNerdFont-Regular.otf") format("opentype"); +} +:root { + --main-bg-color: #111317; + --main-fg-color: #d7afaf; + --theme-white: #e4e4e4; + --secondary-bg-color: color-mix(in srgb, var(--main-bg-color) 35%, var(--main-fg-color) 65%); +} + +body { + background-color: rgba(from var(--main-bg-color) r g b / 1); +} + +h1,h2,h3 { + text-align: center; +} +h1,h2,h3,p,a { + font-family: 'OverpassNerd', sans-serif; + color: rgba(from var(--main-fg-color) r g b / 1); +} .body { display: flex; @@ -12,10 +34,10 @@ min-width: 30%; max-width: 400px; flex-grow: 1; - background-color: rgba(255,0,0,0.3); +/* background-color: rgba(255,0,0,0.3);*/ } .content { - background-color: rgba(0,255,0,0.3); +/* background-color: rgba(0,255,0,0.3);*/ max-width: 60vmax; } @@ -23,9 +45,30 @@ img { display: block; margin: auto; - width: 60%; +/* width: 60%;*/ + width: 12em; aspect-ratio: 88 / 31; } + h1 { + border-top: 1px dashed; + padding-top: 1vh; + } + h2 { +/* line-height: 0.25;*/ + border-top: 1px dotted; + padding-top: 1vh; + } + p { + text-align: center; + font-size: 1.1em; + } +} +#rats { + img { + display: block; + margin: auto; + width: 90%; + } } img { @@ -34,5 +77,6 @@ img { .markdown-module { padding: 1vmax 2vmax; margin: 1vmax 0; - background-color: #f0f0f044; + background-color: rgba(from var(--secondary-bg-color) r g b / 0.2); + border-radius: 8px; } diff --git a/serve/assets/fonts/overpass/OverpassNerdFont-Regular.otf b/serve/assets/fonts/overpass/OverpassNerdFont-Regular.otf new file mode 100644 index 0000000..4614dfd Binary files /dev/null and b/serve/assets/fonts/overpass/OverpassNerdFont-Regular.otf differ