my website
at main 129 lines 3.5 kB view raw
1@font-face { 2 font-family: 'Inter'; 3 font-style: normal; 4 font-weight: 100 900; 5 font-display: block; 6 src: url(fonts/InterVariable.fast.woff2) format('woff2'); 7 font-feature-settings: "cv10"; 8 unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD, U+0394, U+0398, U+0104, U+0106, U+0118, U+0141, U+0143, U+00D3, U+015A, U+0179, U+017B, U+0105, U+0107, U+0119, U+0142, U+0144, U+00F3, U+015B, U+017A, U+017C; 9} 10@font-face { 11 font-family: 'Inter'; 12 font-style: italic; 13 font-weight: 100 900; 14 font-display: block; 15 src: url(fonts/InterVariable-Italic.fast.woff2) format('woff2'); 16 font-feature-settings: "cv10"; 17 unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD, U+0394, U+0398, U+0104, U+0106, U+0118, U+0141, U+0143, U+00D3, U+015A, U+0179, U+017B, U+0105, U+0107, U+0119, U+0142, U+0144, U+00F3, U+015B, U+017A, U+017C; 18} 19/* todo: non-fast variants and generating this from the nix stuff too maybe lol */ 20 21:root { 22 color-scheme: light dark; 23 --color-fg: #000; 24 --color-bg: #fff; 25 --color-link: #7149ff; 26 --color-link-visited: #8d00ed; 27} 28 29@media (prefers-color-scheme: dark) { 30 :root { 31 --color-bg: #1a1a1a; 32 --color-fg: #fff; 33 --color-link: #aaf; 34 --color-link-visited: #dfa5ff; 35 } 36} 37 38body { 39 background-color: var(--color-bg); 40 color: var(--color-fg); 41 42 font-family: 'Inter', sans-serif; 43 font-optical-sizing: auto; 44 line-height: 1.5; 45 font-weight: 500; 46 47 margin: 3rem; 48 margin-top: 2rem; 49} 50 51a { color: var(--color-link); } 52a:visited { color: var(--color-link-visited); } 53 54img { 55 display: block; 56 max-width: 100%; 57} 58 59#fops { filter: drop-shadow(0 0 5px #ccc); } 60@media (prefers-color-scheme: dark) { 61 #fops { filter: drop-shadow(0 0 3px #f2f2f277); } 62} 63 64time { font-feature-settings: "tnum"; } 65 66nav #fops { display: inline; } 67nav { 68 display: flex; 69 gap: 1rem; 70 margin-bottom: 1rem; 71} 72nav > ul { 73 margin-block: auto; 74 font-size: 1.1em; 75} 76/* specificity hack lol */ 77nav a[href] { 78 color: var(--color-link); 79 text-decoration: none; 80} 81 82header > * { margin-block: 0; } 83header { 84 margin-top: 1rem; 85 margin-bottom: 1rem; 86} 87h1 { 88 font-size: 2.5em; /* shur up firefox */ 89 line-height: 1; 90 margin-bottom: 0.4rem; 91} 92 93.inline-list { 94 list-style-type: none; 95 padding-left: 0; 96} 97.inline-list > * { display: inline; } 98.inline-list.slashed > :not(:first-child)::before { 99 content: ' / '; 100 padding-inline: 0.25em; 101} 102 103.tag { 104 /* intentional swap */ 105 --fg: var(--color-bg); 106 --bg: var(--color-fg); 107 background-color: var(--bg); 108 color: var(--fg); 109 font-size: 0.9em; 110 border-radius: 0.3rem; 111 padding: 0.2rem 0.4rem; 112} 113 114.tag[data-tag='test'] { --bg: #f66151; --fg: #000; } 115.tag[data-tag='software'] { --bg: #8ff0a4; --fg: #000; } 116.tag[data-tag='hardware'] { --bg: #dc8add; --fg: #000; } 117.tag[data-tag='weather'] { --bg: #99c1f1; --fg: #000; } 118 119pre { 120 padding: 1rem; 121} 122pre, code { 123 font-family: 'Adwaita Mono', 'Fira Code', 'JetBrains Mono', 'Lucida Console', monospace; 124 font-size: 0.97em; 125 line-height: 1.25; 126} 127:not(.sourceCode) > pre:has(code), div.sourceCode { 128 border-radius: 1rem; 129}