diff --git a/common.css b/common.css new file mode 100644 index 0000000..d407864 --- /dev/null +++ b/common.css @@ -0,0 +1,84 @@ +:root { + --color-primary: oklch(0.33 0.07 160); + --color-text: oklch(from var(--color-primary) 1 c h); +} + +body { + background-color: var(--color-primary); + color: var(--color-text); + + max-width: 42em; + padding: 0 1em; + margin: auto; +} + +nav { + display: flex; + gap: 0.5em; + + font-family: monospace; +} + +:root { + /* colors 😈 */ + --gradient-pride: repeating-linear-gradient( + to right, + red, + orange, + yellow, + green, + blue, + purple + ); + --gradient-enby: repeating-linear-gradient( + to right, + yellow, + white, + purple, + black + ); +} + +h1 { + font-family: monospace; + margin-bottom: 0; +} + +/* See */ +h1:hover { + background: var(--gradient-enby); + background-clip: text; + color: transparent; + + animation: slide 1s linear infinite; + background-size: calc(12em * 4); +} + +@keyframes slide { + from { + background-position: calc(12em * 4); + } + to { + background-position: 0; + } +} + +a { + color: oklch(from var(--color-primary) 0.9 calc(c * 3) h); + text-decoration: none; +} + +a:hover, +a:focus, +a:focus-visible, +a:active { + text-decoration: underline; +} + +a.selected { + color: var(--color-text); +} + +.btn88x31 { + image-rendering: pixelated; +} diff --git a/index.html b/index.html index 408da91..f4d5d5f 100644 --- a/index.html +++ b/index.html @@ -6,79 +6,7 @@ Gavin Morrow - +

Gavin Morrow