diff options
Diffstat (limited to 'handmade.css')
| -rw-r--r-- | handmade.css | 194 |
1 files changed, 194 insertions, 0 deletions
diff --git a/handmade.css b/handmade.css new file mode 100644 index 0000000..defd40b --- /dev/null +++ b/handmade.css @@ -0,0 +1,194 @@ +@font-face { + font-family: 'JetBrains Mono'; + src: url('./fonts/webfonts/JetBrainsMono-Regular.woff2'); + font-weight: normal; + font-style: normal; +} + +@font-face { + font-family: 'JetBrains Mono Bold'; + src: url('./fonts/webfonts/JetBrainsMono-Bold.woff2'); + font-weight: bold; + font-style: normal; +} + +@media print { + body { + width: 21cm; + height: 29.7cm; + margin-top: 20mm; + margin-bottom: 20mm; + margin-left: 10mm; + margin-right: 10mm; + } + + .vcontainer { + width: 50%; + } +} + +@media screen and (width >= 1000px) { + body { + width: 80%; + margin-top: 1em; + margin-left: 10%; + margin-right: 10%; + } + + .vcontainer { + width: 50%; + } +} + +@media screen and (width < 1000px) { + body { + width: 90%; + margin-top: 0.2em; + margin-left: 5%; + margin-right: 5%; + } + + .hcontainer { + flex-direction: column; + } + + .vcontainer { + width: 100%; + } + + ul { + padding-left: 1em; + } +} + +body { + display: flex; + align-items: center; + flex-direction: column; + justify-content: start; +} + +p { + margin-top: 0.2em; + margin-bottom: 0.2em; +} + +ul { + list-style-type: "|>"; +} + +* { + font-family: 'JetBrains Mono'; + font-size: 1rem; +} + +h1 { + font-size: 2rem; + text-align: start; + padding-left: 1em; + padding-right: 1em; +} + +h2 { + font-size: 1.7rem; + text-align: end; + padding-left: 1em; + padding-right: 1em; +} + +h3 { + padding-left: 1.4rem; +} + +.title { + display: flex; + justify-content: space-between; + align-items: baseline; + margin-top: 1em; + margin-left: 1em; + margin-right: 1em; + margin-bottom: 0.1em; +} + +@media print { + .title { + margin-left: 3em; + margin-right: 8em; + } +} + +.intro { + width: 90%; +} + +@media print { + .intro { + width: 90%; + } +} + +.hcontainer { + display: flex; + justify-content: space-between; + margin-left: 0.5em; + margin-right: 0.5em; +} + +@media print { + .hcontainer { + margin-left: 0; + margin-right: 0; + } +} + +.vcontainer { + display: flex; + flex-direction: column; + justify-content: start; + margin: 1rem; +} + +.vcontainer > div { + border: 0.2rem solid transparent; +} + +.vcontainer > div:hover { + border: 0.2rem solid; +} + +.highlight::before { + position: absolute; + backdrop-filter: blur(0.1rem); +} + +.heavy { + font-family: 'JetBrains Mono Bold'; + font-style: bold; +} + +.sub { + text-indent: -1em; + font-size: 0.8rem; +} + +.tags { + margin-left: 1.7em; +} + +@media print { + .tags { + margin-left: 0; + } +} + +@media screen and (width < 1000px) { + .tags { + margin-left: 0; + } +} + +.tags > p { + font-size: 0.8rem; +} + +/* vim:set et ts=4 sts=0 sw=0: */ |
