Something went wrong. Try again.
The latest iteration of my personal site. ethana.dev
Something went wrong. Try again.
2.4 kB · 66 lines
CSS
at master
12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667@font-face { font-family: "Lora"; src: url("/fonts/Lora-VariableFont_wght.ttf") format("truetype"); font-display: fallback;}
@font-face { font-family: "Gorton"; src: url("/fonts/GortonPerfectedVF.woff2") format("woff2"); font-display: fallback;}
/* Defaults */:root { --syntax-tab-size: 2; --font-family: "Gorton"; --secondary-font-family: "Lora"; --font-family-monospace: Consolas, Menlo, Monaco, Andale Mono WT, Andale Mono, Lucida Console, Lucida Sans Typewriter, DejaVu Sans Mono, Bitstream Vera Sans Mono, Liberation Mono, Nimbus Mono L, Courier New, Courier, monospace;}
/* Theme colors */:root { --colour-black: hsla(0, 0%, 0%, 1); --colour-yellow: hsla(61, 76%, 72%, 1); --colour-blue: hsla(165, 56%, 71%, 1); --colour-purple: hsla(300, 60%, 82%, 1); --colour-green: hsla(94, 48%, 80%, 1); --colour-red: hsla(0, 97%, 77%, 1); --colour-white: hsla(60, 51%, 91%, 1); --colour-paper: hsla(60, 100%, 98%, 1); --colour-orange: hsla(17, 89%, 60%, 1);
--colour-night: hsla(60, 6%, 9%, 1); --colour-dusk: hsla(60, 5%, 15%, 1);
--background-colour: light-dark(var(--colour-white), var(--colour-night)); --header-colour: light-dark(var(--colour-yellow), var(--colour-dusk)); --surface-colour: light-dark(var(--colour-paper), var(--colour-dusk)); --border-colour: light-dark(var(--colour-black), var(--colour-white));
--text-colour: light-dark(var(--colour-black), var(--colour-white)); --subtle-text-colour: light-dark(var(--colour-black), var(--colour-white)); --text-colour-link: light-dark(var(--colour-black), var(--colour-white)); --text-colour-header: light-dark(var(--colour-black), var(--colour-yellow));
--hover-link-background-colour: light-dark(var(--colour-black), var(--colour-yellow)); --hover-link-text-colour: light-dark(var(--colour-yellow), var(--colour-black));
--icon-fill-colour: light-dark(var(--colour-black), var(--colour-white));
--postlist-item-background-one-colour: light-dark(var(--colour-black), var(--colour-green)); --postlist-item-background-two-colour: light-dark(var(--colour-black), var(--colour-purple)); --postlist-item-background-three-colour: light-dark(var(--colour-black), var(--colour-blue)); --postlist-item-background-four-colour: light-dark(var(--colour-black), var(--colour-red));
color-scheme: light dark;}:root[data-theme="light"] { color-scheme: light;}:root[data-theme="dark"] { color-scheme: dark;}