diff --git a/src/assets/fonts/hyperlegible-mono/AtkinsonHyperlegibleMonoVF-Variable.woff2 b/src/assets/fonts/hyperlegible-mono/AtkinsonHyperlegibleMonoVF-Variable.woff2 deleted file mode 100644 index 7d8593b..0000000 Binary files a/src/assets/fonts/hyperlegible-mono/AtkinsonHyperlegibleMonoVF-Variable.woff2 and /dev/null differ diff --git a/src/assets/fonts/hyperlegible/AtkinsonHyperlegibleNextVF-Variable.woff2 b/src/assets/fonts/hyperlegible/AtkinsonHyperlegibleNextVF-Variable.woff2 deleted file mode 100644 index d65952f..0000000 Binary files a/src/assets/fonts/hyperlegible/AtkinsonHyperlegibleNextVF-Variable.woff2 and /dev/null differ diff --git a/src/assets/fonts/ia-writer-mono/iAWriterMonoV-Italic.ttf b/src/assets/fonts/ia-writer-mono/iAWriterMonoV-Italic.ttf new file mode 100644 index 0000000..b32825a Binary files /dev/null and b/src/assets/fonts/ia-writer-mono/iAWriterMonoV-Italic.ttf differ diff --git a/src/assets/fonts/ia-writer-mono/iAWriterMonoV.ttf b/src/assets/fonts/ia-writer-mono/iAWriterMonoV.ttf new file mode 100644 index 0000000..8bdb5e2 Binary files /dev/null and b/src/assets/fonts/ia-writer-mono/iAWriterMonoV.ttf differ diff --git a/src/assets/fonts/ia-writer-quattro/iAWriterQuattroV-Italic.ttf b/src/assets/fonts/ia-writer-quattro/iAWriterQuattroV-Italic.ttf new file mode 100644 index 0000000..b855d8e Binary files /dev/null and b/src/assets/fonts/ia-writer-quattro/iAWriterQuattroV-Italic.ttf differ diff --git a/src/assets/fonts/ia-writer-quattro/iAWriterQuattroV.ttf b/src/assets/fonts/ia-writer-quattro/iAWriterQuattroV.ttf new file mode 100644 index 0000000..6d50c14 Binary files /dev/null and b/src/assets/fonts/ia-writer-quattro/iAWriterQuattroV.ttf differ diff --git a/src/includes/css/blocks/media-grid.css b/src/includes/css/blocks/media-grid.css index 238b55d..31eaa6c 100644 --- a/src/includes/css/blocks/media-grid.css +++ b/src/includes/css/blocks/media-grid.css @@ -7,25 +7,24 @@ grid-gap: var(--spacing-2); li { - border: 1px solid var(--color-shadow); - overflow: hidden; + aspect-ratio: var(--aspect-ratio); + display: grid; position: relative; + overflow: hidden; a { + display: block; color: var(--color-white); picture { - border-radius: 0; height: 100%; + border-radius: 0; + } - img { - aspect-ratio: var(--aspect-ratio); - border-radius: 0; - width: 100%; - height: 100%; - object-fit: cover; - transition: transform 0.3s ease; - } + img { + height: 100%; + object-fit: cover; + transition: transform 0.3s ease; } .text-only { diff --git a/src/includes/css/blocks/site-logo.css b/src/includes/css/blocks/site-logo.css index e3a25cf..1279ae3 100644 --- a/src/includes/css/blocks/site-logo.css +++ b/src/includes/css/blocks/site-logo.css @@ -1,5 +1,6 @@ .site-logo .wordmark { text-decoration: none; + margin-top: calc(-1 * var(--spacing-1)); } .site-logo .logo img { diff --git a/src/includes/css/global/global-styles.css b/src/includes/css/global/global-styles.css index dc0f205..db37749 100644 --- a/src/includes/css/global/global-styles.css +++ b/src/includes/css/global/global-styles.css @@ -27,19 +27,11 @@ body { margin: 0; } -h1, -h2, -h3, -h4, -h5, -h6 { - font-family: var(--font-family-display); -} - h1 { font-size: 3rem; + font-family: var(--font-family-display); font-weight: var(--font-weight-black); - letter-spacing: -0.05rem; + letter-spacing: -0.1rem; line-height: 3rem; } diff --git a/src/includes/css/global/lilypad.css b/src/includes/css/global/lilypad.css index f365180..4de7450 100644 --- a/src/includes/css/global/lilypad.css +++ b/src/includes/css/global/lilypad.css @@ -1 +1 @@ -@font-face{font-display:swap;font-family:Atikinson Hyperlegible Next;font-stretch:75% 125%;font-style:normal;font-weight:125 950;src:local("Atikinson Hyperlegible Next"),local("AtikinsonHyperlegibleNext-Regular"),url(/assets/fonts/hyperlegible/AtkinsonHyperlegibleNextVF-Variable.woff2) format("woff2")}@font-face{font-display:swap;font-family:Atikinson Hyperlegible Mono;font-stretch:75% 125%;font-style:normal;font-weight:125 950;src:local("Atikinson Hyperlegible Mono"),local("AtikinsonHyperlegibleMono-Regular"),url(/assets/fonts/hyperlegible-mono/AtkinsonHyperlegibleMonoVF-Variable.woff2) format("woff2")}:root{--font-family-display:Atikinson Hyperlegible Next,ui-monospace,Cascadia Code,Source Code Pro,Menlo,Consolas,DejaVu Sans Mono,monospace;--font-family-body:Atikinson Hyperlegible Next,ui-monospace,Cascadia Code,Source Code Pro,Menlo,Consolas,DejaVu Sans Mono,monospace;--font-family-monospace:Atikinson Hyperlegible Mono,ui-monospace,Cascadia Code,Source Code Pro,Menlo,Consolas,DejaVu Sans Mono,monospace;--color-primary:oklch(0.6 0.1025 212.16);--color-secondary:oklch(0.61 0.2232 31.48);--color-background:oklch(0.98 0 0);--color-surface:oklch(0.96 0.0078 207.9);--color-border:oklch(0.87 0.045077 207.8465);--color-text:oklch(0.15 0 0);--color-fadeText:oklch(0.45 0.0214 207.84);--color-shadow:oklch(0.39 0.0688 212.35)}.text-primary{color:var(--color-primary)}.bg-primary{background-color:var(--color-primary)}.text-secondary{color:var(--color-secondary)}.bg-secondary{background-color:var(--color-secondary)}.text-background{color:var(--color-background)}.bg-background{background-color:var(--color-background)}.text-surface{color:var(--color-surface)}.bg-surface{background-color:var(--color-surface)}.text-border{color:var(--color-border)}.bg-border{background-color:var(--color-border)}.text-text{color:var(--color-text)}.bg-text{background-color:var(--color-text)}.text-fadeText{color:var(--color-fadeText)}.bg-fadeText{background-color:var(--color-fadeText)}.text-shadow{color:var(--color-shadow)}.bg-shadow{background-color:var(--color-shadow)}@media (prefers-color-scheme:dark){:root{--color-primary:oklch(0.57 0.0991 213.4);--color-secondary:oklch(0.55 0.1982 31.52);--color-background:oklch(0.2 0 0);--color-surface:oklch(0.26 0.0106 233.21);--color-border:oklch(0.27 0.0238 245.26);--color-text:oklch(0.98 0 0);--color-fadeText:oklch(0.78 0.018 207.85);--color-shadow:oklch(0.39 0.0688 212.35)}}:root{--spacing-0:0px;--spacing-1:4px;--spacing-2:8px;--spacing-3:12px;--spacing-4:16px;--spacing-5:20px;--spacing-6:24px;--spacing-7:28px;--spacing-8:32px;--spacing-9:36px;--spacing-10:40px}.m-0{margin:var(--spacing-0)}.my-0{margin-block-end:var(--spacing-0);margin-block-start:var(--spacing-0)}.mx-0{margin-inline-end:var(--spacing-0)}.ml-0,.mr-0,.mx-0{margin-inline-start:var(--spacing-0)}.mt-0{margin-block-start:var(--spacing-0)}.mb-0{margin-block-end:var(--spacing-0)}.p-0{padding:var(--spacing-0)}.py-0{padding-block-end:var(--spacing-0);padding-block-start:var(--spacing-0)}.px-0{padding-inline-end:var(--spacing-0)}.pl-0,.pr-0,.px-0{padding-inline-start:var(--spacing-0)}.pt-0{padding-block-start:var(--spacing-0)}.pb-0{padding-block-end:var(--spacing-0)}.w-0{width:var(--spacing-0)}.h-0,.size-0{height:var(--spacing-0)}.size-0{width:var(--spacing-0)}.radius-0{border-radius:var(--spacing-0)}.gap-0{gap:var(--spacing-0)}.row-gap-0{row-gap:var(--spacing-0)}.column-gap-0{column-gap:var(--spacing-0)}.flow-space-0{--flow-space:var(--spacing-0)}.m-1{margin:var(--spacing-1)}.my-1{margin-block-end:var(--spacing-1);margin-block-start:var(--spacing-1)}.mx-1{margin-inline-end:var(--spacing-1)}.ml-1,.mr-1,.mx-1{margin-inline-start:var(--spacing-1)}.mt-1{margin-block-start:var(--spacing-1)}.mb-1{margin-block-end:var(--spacing-1)}.p-1{padding:var(--spacing-1)}.py-1{padding-block-end:var(--spacing-1);padding-block-start:var(--spacing-1)}.px-1{padding-inline-end:var(--spacing-1)}.pl-1,.pr-1,.px-1{padding-inline-start:var(--spacing-1)}.pt-1{padding-block-start:var(--spacing-1)}.pb-1{padding-block-end:var(--spacing-1)}.w-1{width:var(--spacing-1)}.h-1,.size-1{height:var(--spacing-1)}.size-1{width:var(--spacing-1)}.radius-1{border-radius:var(--spacing-1)}.gap-1{gap:var(--spacing-1)}.row-gap-1{row-gap:var(--spacing-1)}.column-gap-1{column-gap:var(--spacing-1)}.flow-space-1{--flow-space:var(--spacing-1)}.m-2{margin:var(--spacing-2)}.my-2{margin-block-end:var(--spacing-2);margin-block-start:var(--spacing-2)}.mx-2{margin-inline-end:var(--spacing-2)}.ml-2,.mr-2,.mx-2{margin-inline-start:var(--spacing-2)}.mt-2{margin-block-start:var(--spacing-2)}.mb-2{margin-block-end:var(--spacing-2)}.p-2{padding:var(--spacing-2)}.py-2{padding-block-end:var(--spacing-2);padding-block-start:var(--spacing-2)}.px-2{padding-inline-end:var(--spacing-2)}.pl-2,.pr-2,.px-2{padding-inline-start:var(--spacing-2)}.pt-2{padding-block-start:var(--spacing-2)}.pb-2{padding-block-end:var(--spacing-2)}.w-2{width:var(--spacing-2)}.h-2,.size-2{height:var(--spacing-2)}.size-2{width:var(--spacing-2)}.radius-2{border-radius:var(--spacing-2)}.gap-2{gap:var(--spacing-2)}.row-gap-2{row-gap:var(--spacing-2)}.column-gap-2{column-gap:var(--spacing-2)}.flow-space-2{--flow-space:var(--spacing-2)}.m-3{margin:var(--spacing-3)}.my-3{margin-block-end:var(--spacing-3);margin-block-start:var(--spacing-3)}.mx-3{margin-inline-end:var(--spacing-3)}.ml-3,.mr-3,.mx-3{margin-inline-start:var(--spacing-3)}.mt-3{margin-block-start:var(--spacing-3)}.mb-3{margin-block-end:var(--spacing-3)}.p-3{padding:var(--spacing-3)}.py-3{padding-block-end:var(--spacing-3);padding-block-start:var(--spacing-3)}.px-3{padding-inline-end:var(--spacing-3)}.pl-3,.pr-3,.px-3{padding-inline-start:var(--spacing-3)}.pt-3{padding-block-start:var(--spacing-3)}.pb-3{padding-block-end:var(--spacing-3)}.w-3{width:var(--spacing-3)}.h-3,.size-3{height:var(--spacing-3)}.size-3{width:var(--spacing-3)}.radius-3{border-radius:var(--spacing-3)}.gap-3{gap:var(--spacing-3)}.row-gap-3{row-gap:var(--spacing-3)}.column-gap-3{column-gap:var(--spacing-3)}.flow-space-3{--flow-space:var(--spacing-3)}.m-4{margin:var(--spacing-4)}.my-4{margin-block-end:var(--spacing-4);margin-block-start:var(--spacing-4)}.mx-4{margin-inline-end:var(--spacing-4)}.ml-4,.mr-4,.mx-4{margin-inline-start:var(--spacing-4)}.mt-4{margin-block-start:var(--spacing-4)}.mb-4{margin-block-end:var(--spacing-4)}.p-4{padding:var(--spacing-4)}.py-4{padding-block-end:var(--spacing-4);padding-block-start:var(--spacing-4)}.px-4{padding-inline-end:var(--spacing-4)}.pl-4,.pr-4,.px-4{padding-inline-start:var(--spacing-4)}.pt-4{padding-block-start:var(--spacing-4)}.pb-4{padding-block-end:var(--spacing-4)}.w-4{width:var(--spacing-4)}.h-4,.size-4{height:var(--spacing-4)}.size-4{width:var(--spacing-4)}.radius-4{border-radius:var(--spacing-4)}.gap-4{gap:var(--spacing-4)}.row-gap-4{row-gap:var(--spacing-4)}.column-gap-4{column-gap:var(--spacing-4)}.flow-space-4{--flow-space:var(--spacing-4)}.m-5{margin:var(--spacing-5)}.my-5{margin-block-end:var(--spacing-5);margin-block-start:var(--spacing-5)}.mx-5{margin-inline-end:var(--spacing-5)}.ml-5,.mr-5,.mx-5{margin-inline-start:var(--spacing-5)}.mt-5{margin-block-start:var(--spacing-5)}.mb-5{margin-block-end:var(--spacing-5)}.p-5{padding:var(--spacing-5)}.py-5{padding-block-end:var(--spacing-5);padding-block-start:var(--spacing-5)}.px-5{padding-inline-end:var(--spacing-5)}.pl-5,.pr-5,.px-5{padding-inline-start:var(--spacing-5)}.pt-5{padding-block-start:var(--spacing-5)}.pb-5{padding-block-end:var(--spacing-5)}.w-5{width:var(--spacing-5)}.h-5,.size-5{height:var(--spacing-5)}.size-5{width:var(--spacing-5)}.radius-5{border-radius:var(--spacing-5)}.gap-5{gap:var(--spacing-5)}.row-gap-5{row-gap:var(--spacing-5)}.column-gap-5{column-gap:var(--spacing-5)}.flow-space-5{--flow-space:var(--spacing-5)}.m-6{margin:var(--spacing-6)}.my-6{margin-block-end:var(--spacing-6);margin-block-start:var(--spacing-6)}.mx-6{margin-inline-end:var(--spacing-6)}.ml-6,.mr-6,.mx-6{margin-inline-start:var(--spacing-6)}.mt-6{margin-block-start:var(--spacing-6)}.mb-6{margin-block-end:var(--spacing-6)}.p-6{padding:var(--spacing-6)}.py-6{padding-block-end:var(--spacing-6);padding-block-start:var(--spacing-6)}.px-6{padding-inline-end:var(--spacing-6)}.pl-6,.pr-6,.px-6{padding-inline-start:var(--spacing-6)}.pt-6{padding-block-start:var(--spacing-6)}.pb-6{padding-block-end:var(--spacing-6)}.w-6{width:var(--spacing-6)}.h-6,.size-6{height:var(--spacing-6)}.size-6{width:var(--spacing-6)}.radius-6{border-radius:var(--spacing-6)}.gap-6{gap:var(--spacing-6)}.row-gap-6{row-gap:var(--spacing-6)}.column-gap-6{column-gap:var(--spacing-6)}.flow-space-6{--flow-space:var(--spacing-6)}.m-7{margin:var(--spacing-7)}.my-7{margin-block-end:var(--spacing-7);margin-block-start:var(--spacing-7)}.mx-7{margin-inline-end:var(--spacing-7)}.ml-7,.mr-7,.mx-7{margin-inline-start:var(--spacing-7)}.mt-7{margin-block-start:var(--spacing-7)}.mb-7{margin-block-end:var(--spacing-7)}.p-7{padding:var(--spacing-7)}.py-7{padding-block-end:var(--spacing-7);padding-block-start:var(--spacing-7)}.px-7{padding-inline-end:var(--spacing-7)}.pl-7,.pr-7,.px-7{padding-inline-start:var(--spacing-7)}.pt-7{padding-block-start:var(--spacing-7)}.pb-7{padding-block-end:var(--spacing-7)}.w-7{width:var(--spacing-7)}.h-7,.size-7{height:var(--spacing-7)}.size-7{width:var(--spacing-7)}.radius-7{border-radius:var(--spacing-7)}.gap-7{gap:var(--spacing-7)}.row-gap-7{row-gap:var(--spacing-7)}.column-gap-7{column-gap:var(--spacing-7)}.flow-space-7{--flow-space:var(--spacing-7)}.m-8{margin:var(--spacing-8)}.my-8{margin-block-end:var(--spacing-8);margin-block-start:var(--spacing-8)}.mx-8{margin-inline-end:var(--spacing-8)}.ml-8,.mr-8,.mx-8{margin-inline-start:var(--spacing-8)}.mt-8{margin-block-start:var(--spacing-8)}.mb-8{margin-block-end:var(--spacing-8)}.p-8{padding:var(--spacing-8)}.py-8{padding-block-end:var(--spacing-8);padding-block-start:var(--spacing-8)}.px-8{padding-inline-end:var(--spacing-8)}.pl-8,.pr-8,.px-8{padding-inline-start:var(--spacing-8)}.pt-8{padding-block-start:var(--spacing-8)}.pb-8{padding-block-end:var(--spacing-8)}.w-8{width:var(--spacing-8)}.h-8,.size-8{height:var(--spacing-8)}.size-8{width:var(--spacing-8)}.radius-8{border-radius:var(--spacing-8)}.gap-8{gap:var(--spacing-8)}.row-gap-8{row-gap:var(--spacing-8)}.column-gap-8{column-gap:var(--spacing-8)}.flow-space-8{--flow-space:var(--spacing-8)}.m-9{margin:var(--spacing-9)}.my-9{margin-block-end:var(--spacing-9);margin-block-start:var(--spacing-9)}.mx-9{margin-inline-end:var(--spacing-9)}.ml-9,.mr-9,.mx-9{margin-inline-start:var(--spacing-9)}.mt-9{margin-block-start:var(--spacing-9)}.mb-9{margin-block-end:var(--spacing-9)}.p-9{padding:var(--spacing-9)}.py-9{padding-block-end:var(--spacing-9);padding-block-start:var(--spacing-9)}.px-9{padding-inline-end:var(--spacing-9)}.pl-9,.pr-9,.px-9{padding-inline-start:var(--spacing-9)}.pt-9{padding-block-start:var(--spacing-9)}.pb-9{padding-block-end:var(--spacing-9)}.w-9{width:var(--spacing-9)}.h-9,.size-9{height:var(--spacing-9)}.size-9{width:var(--spacing-9)}.radius-9{border-radius:var(--spacing-9)}.gap-9{gap:var(--spacing-9)}.row-gap-9{row-gap:var(--spacing-9)}.column-gap-9{column-gap:var(--spacing-9)}.flow-space-9{--flow-space:var(--spacing-9)}.m-10{margin:var(--spacing-10)}.my-10{margin-block-end:var(--spacing-10);margin-block-start:var(--spacing-10)}.mx-10{margin-inline-end:var(--spacing-10)}.ml-10,.mr-10,.mx-10{margin-inline-start:var(--spacing-10)}.mt-10{margin-block-start:var(--spacing-10)}.mb-10{margin-block-end:var(--spacing-10)}.p-10{padding:var(--spacing-10)}.py-10{padding-block-end:var(--spacing-10);padding-block-start:var(--spacing-10)}.px-10{padding-inline-end:var(--spacing-10)}.pl-10,.pr-10,.px-10{padding-inline-start:var(--spacing-10)}.pt-10{padding-block-start:var(--spacing-10)}.pb-10{padding-block-end:var(--spacing-10)}.w-10{width:var(--spacing-10)}.h-10,.size-10{height:var(--spacing-10)}.size-10{width:var(--spacing-10)}.radius-10{border-radius:var(--spacing-10)}.gap-10{gap:var(--spacing-10)}.row-gap-10{row-gap:var(--spacing-10)}.column-gap-10{column-gap:var(--spacing-10)}.flow-space-10{--flow-space:var(--spacing-10)}.w-full{width:100%}.h-full{height:100%}.w-fit{width:fit-content}.w-max{width:max-content}.w-min{width:min-content}.flex{display:flex}.flex-col{flex-direction:column}.items-start{align-items:flex-start}.items-center{align-items:center}.items-end{align-items:flex-end}.justify-center{justify-content:center}.justify-between{justify-content:space-between}.flex-wrap{flex-wrap:wrap}.flex-1{flex:1}.flow>*+*{margin-block-start:var(--flow-space,1em)}.flow-space-default{--flow-space:1em}.list-none{list-style-type:none}.list-disc{list-style-type:disc}.list-decimal{list-style-type:decimal}.visually-hidden{border:0;clip:rect(0 0 0 0);height:0;margin:0;overflow:hidden;padding:0;position:absolute;white-space:nowrap;width:1px} +@font-face{font-display:swap;font-family:iA Writer Quattro;font-stretch:75% 125%;font-style:normal;font-weight:125 950;src:local("iA Writer Quattro"),local("iAWriterQuattro-Regular"),url(/assets/fonts/ia-writer-quattro/iAWriterQuattroV.ttf) format("truetype")}@font-face{font-display:swap;font-family:iA Writer Quattro;font-stretch:75% 125%;font-style:italic;font-weight:125 950;src:local("iA Writer Quattro"),local("iAWriterQuattro-Italic"),url(/assets/fonts/ia-writer-quattro/iAWriterQuattroV-Italic.ttf) format("truetype")}@font-face{font-display:swap;font-family:iA Writer Mono;font-stretch:75% 125%;font-style:normal;font-weight:125 950;src:local("iA Writer Mono"),local("iAWriterMono-Regular"),url(/assets/fonts/ia-writer-mono/iaWriterMonoV.ttf) format("truetype")}@font-face{font-display:swap;font-family:iA Writer Mono;font-stretch:75% 125%;font-style:italic;font-weight:125 950;src:local("iA Writer Mono"),local("iAWriterMono-Italic"),url(/assets/fonts/ia-writer-mono/iaWriterMonoV-Italic.ttf) format("truetype")}:root{--font-family-display:iA Writer Quattro,ui-monospace,Cascadia Code,Source Code Pro,Menlo,Consolas,DejaVu Sans Mono,monospace;--font-family-body:iA Writer Quattro,ui-monospace,Cascadia Code,Source Code Pro,Menlo,Consolas,DejaVu Sans Mono,monospace;--font-family-monospace:iA Writer Mono,ui-monospace,Cascadia Code,Source Code Pro,Menlo,Consolas,DejaVu Sans Mono,monospace;--color-primary:oklch(0.6 0.1025 212.16);--color-secondary:oklch(0.61 0.2232 31.48);--color-background:oklch(0.98 0 0);--color-surface:oklch(0.96 0.0078 207.9);--color-border:oklch(0.87 0.045077 207.8465);--color-text:oklch(0.15 0 0);--color-fadeText:oklch(0.45 0.0214 207.84);--color-shadow:oklch(0.39 0.0688 212.35)}.text-primary{color:var(--color-primary)}.bg-primary{background-color:var(--color-primary)}.text-secondary{color:var(--color-secondary)}.bg-secondary{background-color:var(--color-secondary)}.text-background{color:var(--color-background)}.bg-background{background-color:var(--color-background)}.text-surface{color:var(--color-surface)}.bg-surface{background-color:var(--color-surface)}.text-border{color:var(--color-border)}.bg-border{background-color:var(--color-border)}.text-text{color:var(--color-text)}.bg-text{background-color:var(--color-text)}.text-fadeText{color:var(--color-fadeText)}.bg-fadeText{background-color:var(--color-fadeText)}.text-shadow{color:var(--color-shadow)}.bg-shadow{background-color:var(--color-shadow)}@media (prefers-color-scheme:dark){:root{--color-primary:oklch(0.57 0.0991 213.4);--color-secondary:oklch(0.55 0.1982 31.52);--color-background:oklch(0.2 0 0);--color-surface:oklch(0.26 0.0106 233.21);--color-border:oklch(0.27 0.0238 245.26);--color-text:oklch(0.98 0 0);--color-fadeText:oklch(0.78 0.018 207.85);--color-shadow:oklch(0.39 0.0688 212.35)}}:root{--spacing-0:0px;--spacing-1:4px;--spacing-2:8px;--spacing-3:12px;--spacing-4:16px;--spacing-5:20px;--spacing-6:24px;--spacing-7:28px;--spacing-8:32px;--spacing-9:36px;--spacing-10:40px}.m-0{margin:var(--spacing-0)}.my-0{margin-block-end:var(--spacing-0);margin-block-start:var(--spacing-0)}.mx-0{margin-inline-end:var(--spacing-0)}.ml-0,.mr-0,.mx-0{margin-inline-start:var(--spacing-0)}.mt-0{margin-block-start:var(--spacing-0)}.mb-0{margin-block-end:var(--spacing-0)}.p-0{padding:var(--spacing-0)}.py-0{padding-block-end:var(--spacing-0);padding-block-start:var(--spacing-0)}.px-0{padding-inline-end:var(--spacing-0)}.pl-0,.pr-0,.px-0{padding-inline-start:var(--spacing-0)}.pt-0{padding-block-start:var(--spacing-0)}.pb-0{padding-block-end:var(--spacing-0)}.w-0{width:var(--spacing-0)}.h-0,.size-0{height:var(--spacing-0)}.size-0{width:var(--spacing-0)}.radius-0{border-radius:var(--spacing-0)}.gap-0{gap:var(--spacing-0)}.row-gap-0{row-gap:var(--spacing-0)}.column-gap-0{column-gap:var(--spacing-0)}.flow-space-0{--flow-space:var(--spacing-0)}.m-1{margin:var(--spacing-1)}.my-1{margin-block-end:var(--spacing-1);margin-block-start:var(--spacing-1)}.mx-1{margin-inline-end:var(--spacing-1)}.ml-1,.mr-1,.mx-1{margin-inline-start:var(--spacing-1)}.mt-1{margin-block-start:var(--spacing-1)}.mb-1{margin-block-end:var(--spacing-1)}.p-1{padding:var(--spacing-1)}.py-1{padding-block-end:var(--spacing-1);padding-block-start:var(--spacing-1)}.px-1{padding-inline-end:var(--spacing-1)}.pl-1,.pr-1,.px-1{padding-inline-start:var(--spacing-1)}.pt-1{padding-block-start:var(--spacing-1)}.pb-1{padding-block-end:var(--spacing-1)}.w-1{width:var(--spacing-1)}.h-1,.size-1{height:var(--spacing-1)}.size-1{width:var(--spacing-1)}.radius-1{border-radius:var(--spacing-1)}.gap-1{gap:var(--spacing-1)}.row-gap-1{row-gap:var(--spacing-1)}.column-gap-1{column-gap:var(--spacing-1)}.flow-space-1{--flow-space:var(--spacing-1)}.m-2{margin:var(--spacing-2)}.my-2{margin-block-end:var(--spacing-2);margin-block-start:var(--spacing-2)}.mx-2{margin-inline-end:var(--spacing-2)}.ml-2,.mr-2,.mx-2{margin-inline-start:var(--spacing-2)}.mt-2{margin-block-start:var(--spacing-2)}.mb-2{margin-block-end:var(--spacing-2)}.p-2{padding:var(--spacing-2)}.py-2{padding-block-end:var(--spacing-2);padding-block-start:var(--spacing-2)}.px-2{padding-inline-end:var(--spacing-2)}.pl-2,.pr-2,.px-2{padding-inline-start:var(--spacing-2)}.pt-2{padding-block-start:var(--spacing-2)}.pb-2{padding-block-end:var(--spacing-2)}.w-2{width:var(--spacing-2)}.h-2,.size-2{height:var(--spacing-2)}.size-2{width:var(--spacing-2)}.radius-2{border-radius:var(--spacing-2)}.gap-2{gap:var(--spacing-2)}.row-gap-2{row-gap:var(--spacing-2)}.column-gap-2{column-gap:var(--spacing-2)}.flow-space-2{--flow-space:var(--spacing-2)}.m-3{margin:var(--spacing-3)}.my-3{margin-block-end:var(--spacing-3);margin-block-start:var(--spacing-3)}.mx-3{margin-inline-end:var(--spacing-3)}.ml-3,.mr-3,.mx-3{margin-inline-start:var(--spacing-3)}.mt-3{margin-block-start:var(--spacing-3)}.mb-3{margin-block-end:var(--spacing-3)}.p-3{padding:var(--spacing-3)}.py-3{padding-block-end:var(--spacing-3);padding-block-start:var(--spacing-3)}.px-3{padding-inline-end:var(--spacing-3)}.pl-3,.pr-3,.px-3{padding-inline-start:var(--spacing-3)}.pt-3{padding-block-start:var(--spacing-3)}.pb-3{padding-block-end:var(--spacing-3)}.w-3{width:var(--spacing-3)}.h-3,.size-3{height:var(--spacing-3)}.size-3{width:var(--spacing-3)}.radius-3{border-radius:var(--spacing-3)}.gap-3{gap:var(--spacing-3)}.row-gap-3{row-gap:var(--spacing-3)}.column-gap-3{column-gap:var(--spacing-3)}.flow-space-3{--flow-space:var(--spacing-3)}.m-4{margin:var(--spacing-4)}.my-4{margin-block-end:var(--spacing-4);margin-block-start:var(--spacing-4)}.mx-4{margin-inline-end:var(--spacing-4)}.ml-4,.mr-4,.mx-4{margin-inline-start:var(--spacing-4)}.mt-4{margin-block-start:var(--spacing-4)}.mb-4{margin-block-end:var(--spacing-4)}.p-4{padding:var(--spacing-4)}.py-4{padding-block-end:var(--spacing-4);padding-block-start:var(--spacing-4)}.px-4{padding-inline-end:var(--spacing-4)}.pl-4,.pr-4,.px-4{padding-inline-start:var(--spacing-4)}.pt-4{padding-block-start:var(--spacing-4)}.pb-4{padding-block-end:var(--spacing-4)}.w-4{width:var(--spacing-4)}.h-4,.size-4{height:var(--spacing-4)}.size-4{width:var(--spacing-4)}.radius-4{border-radius:var(--spacing-4)}.gap-4{gap:var(--spacing-4)}.row-gap-4{row-gap:var(--spacing-4)}.column-gap-4{column-gap:var(--spacing-4)}.flow-space-4{--flow-space:var(--spacing-4)}.m-5{margin:var(--spacing-5)}.my-5{margin-block-end:var(--spacing-5);margin-block-start:var(--spacing-5)}.mx-5{margin-inline-end:var(--spacing-5)}.ml-5,.mr-5,.mx-5{margin-inline-start:var(--spacing-5)}.mt-5{margin-block-start:var(--spacing-5)}.mb-5{margin-block-end:var(--spacing-5)}.p-5{padding:var(--spacing-5)}.py-5{padding-block-end:var(--spacing-5);padding-block-start:var(--spacing-5)}.px-5{padding-inline-end:var(--spacing-5)}.pl-5,.pr-5,.px-5{padding-inline-start:var(--spacing-5)}.pt-5{padding-block-start:var(--spacing-5)}.pb-5{padding-block-end:var(--spacing-5)}.w-5{width:var(--spacing-5)}.h-5,.size-5{height:var(--spacing-5)}.size-5{width:var(--spacing-5)}.radius-5{border-radius:var(--spacing-5)}.gap-5{gap:var(--spacing-5)}.row-gap-5{row-gap:var(--spacing-5)}.column-gap-5{column-gap:var(--spacing-5)}.flow-space-5{--flow-space:var(--spacing-5)}.m-6{margin:var(--spacing-6)}.my-6{margin-block-end:var(--spacing-6);margin-block-start:var(--spacing-6)}.mx-6{margin-inline-end:var(--spacing-6)}.ml-6,.mr-6,.mx-6{margin-inline-start:var(--spacing-6)}.mt-6{margin-block-start:var(--spacing-6)}.mb-6{margin-block-end:var(--spacing-6)}.p-6{padding:var(--spacing-6)}.py-6{padding-block-end:var(--spacing-6);padding-block-start:var(--spacing-6)}.px-6{padding-inline-end:var(--spacing-6)}.pl-6,.pr-6,.px-6{padding-inline-start:var(--spacing-6)}.pt-6{padding-block-start:var(--spacing-6)}.pb-6{padding-block-end:var(--spacing-6)}.w-6{width:var(--spacing-6)}.h-6,.size-6{height:var(--spacing-6)}.size-6{width:var(--spacing-6)}.radius-6{border-radius:var(--spacing-6)}.gap-6{gap:var(--spacing-6)}.row-gap-6{row-gap:var(--spacing-6)}.column-gap-6{column-gap:var(--spacing-6)}.flow-space-6{--flow-space:var(--spacing-6)}.m-7{margin:var(--spacing-7)}.my-7{margin-block-end:var(--spacing-7);margin-block-start:var(--spacing-7)}.mx-7{margin-inline-end:var(--spacing-7)}.ml-7,.mr-7,.mx-7{margin-inline-start:var(--spacing-7)}.mt-7{margin-block-start:var(--spacing-7)}.mb-7{margin-block-end:var(--spacing-7)}.p-7{padding:var(--spacing-7)}.py-7{padding-block-end:var(--spacing-7);padding-block-start:var(--spacing-7)}.px-7{padding-inline-end:var(--spacing-7)}.pl-7,.pr-7,.px-7{padding-inline-start:var(--spacing-7)}.pt-7{padding-block-start:var(--spacing-7)}.pb-7{padding-block-end:var(--spacing-7)}.w-7{width:var(--spacing-7)}.h-7,.size-7{height:var(--spacing-7)}.size-7{width:var(--spacing-7)}.radius-7{border-radius:var(--spacing-7)}.gap-7{gap:var(--spacing-7)}.row-gap-7{row-gap:var(--spacing-7)}.column-gap-7{column-gap:var(--spacing-7)}.flow-space-7{--flow-space:var(--spacing-7)}.m-8{margin:var(--spacing-8)}.my-8{margin-block-end:var(--spacing-8);margin-block-start:var(--spacing-8)}.mx-8{margin-inline-end:var(--spacing-8)}.ml-8,.mr-8,.mx-8{margin-inline-start:var(--spacing-8)}.mt-8{margin-block-start:var(--spacing-8)}.mb-8{margin-block-end:var(--spacing-8)}.p-8{padding:var(--spacing-8)}.py-8{padding-block-end:var(--spacing-8);padding-block-start:var(--spacing-8)}.px-8{padding-inline-end:var(--spacing-8)}.pl-8,.pr-8,.px-8{padding-inline-start:var(--spacing-8)}.pt-8{padding-block-start:var(--spacing-8)}.pb-8{padding-block-end:var(--spacing-8)}.w-8{width:var(--spacing-8)}.h-8,.size-8{height:var(--spacing-8)}.size-8{width:var(--spacing-8)}.radius-8{border-radius:var(--spacing-8)}.gap-8{gap:var(--spacing-8)}.row-gap-8{row-gap:var(--spacing-8)}.column-gap-8{column-gap:var(--spacing-8)}.flow-space-8{--flow-space:var(--spacing-8)}.m-9{margin:var(--spacing-9)}.my-9{margin-block-end:var(--spacing-9);margin-block-start:var(--spacing-9)}.mx-9{margin-inline-end:var(--spacing-9)}.ml-9,.mr-9,.mx-9{margin-inline-start:var(--spacing-9)}.mt-9{margin-block-start:var(--spacing-9)}.mb-9{margin-block-end:var(--spacing-9)}.p-9{padding:var(--spacing-9)}.py-9{padding-block-end:var(--spacing-9);padding-block-start:var(--spacing-9)}.px-9{padding-inline-end:var(--spacing-9)}.pl-9,.pr-9,.px-9{padding-inline-start:var(--spacing-9)}.pt-9{padding-block-start:var(--spacing-9)}.pb-9{padding-block-end:var(--spacing-9)}.w-9{width:var(--spacing-9)}.h-9,.size-9{height:var(--spacing-9)}.size-9{width:var(--spacing-9)}.radius-9{border-radius:var(--spacing-9)}.gap-9{gap:var(--spacing-9)}.row-gap-9{row-gap:var(--spacing-9)}.column-gap-9{column-gap:var(--spacing-9)}.flow-space-9{--flow-space:var(--spacing-9)}.m-10{margin:var(--spacing-10)}.my-10{margin-block-end:var(--spacing-10);margin-block-start:var(--spacing-10)}.mx-10{margin-inline-end:var(--spacing-10)}.ml-10,.mr-10,.mx-10{margin-inline-start:var(--spacing-10)}.mt-10{margin-block-start:var(--spacing-10)}.mb-10{margin-block-end:var(--spacing-10)}.p-10{padding:var(--spacing-10)}.py-10{padding-block-end:var(--spacing-10);padding-block-start:var(--spacing-10)}.px-10{padding-inline-end:var(--spacing-10)}.pl-10,.pr-10,.px-10{padding-inline-start:var(--spacing-10)}.pt-10{padding-block-start:var(--spacing-10)}.pb-10{padding-block-end:var(--spacing-10)}.w-10{width:var(--spacing-10)}.h-10,.size-10{height:var(--spacing-10)}.size-10{width:var(--spacing-10)}.radius-10{border-radius:var(--spacing-10)}.gap-10{gap:var(--spacing-10)}.row-gap-10{row-gap:var(--spacing-10)}.column-gap-10{column-gap:var(--spacing-10)}.flow-space-10{--flow-space:var(--spacing-10)}.w-full{width:100%}.h-full{height:100%}.w-fit{width:fit-content}.w-max{width:max-content}.w-min{width:min-content}.flex{display:flex}.flex-col{flex-direction:column}.items-start{align-items:flex-start}.items-center{align-items:center}.items-end{align-items:flex-end}.justify-center{justify-content:center}.justify-between{justify-content:space-between}.flex-wrap{flex-wrap:wrap}.flex-1{flex:1}.flow>*+*{margin-block-start:var(--flow-space,1em)}.flow-space-default{--flow-space:1em}.list-none{list-style-type:none}.list-disc{list-style-type:disc}.list-decimal{list-style-type:decimal}.visually-hidden{border:0;clip:rect(0 0 0 0);height:0;margin:0;overflow:hidden;padding:0;position:absolute;white-space:nowrap;width:1px} diff --git a/src/includes/css/utilities/wrapper.css b/src/includes/css/utilities/wrapper.css index 0785285..2fc21e6 100644 --- a/src/includes/css/utilities/wrapper.css +++ b/src/includes/css/utilities/wrapper.css @@ -7,7 +7,7 @@ .wrapper { container-type: inline-size; width: 90vw; - width: clamp(16rem, 90vw, 80ch); + width: clamp(16rem, 90vw, 72ch); margin-left: auto; margin-right: auto; padding-left: 0.5rem; diff --git a/src/pages/changelog.md b/src/pages/changelog.md index bd57b15..6467425 100644 --- a/src/pages/changelog.md +++ b/src/pages/changelog.md @@ -10,6 +10,11 @@ All the changes that are fit to read! If preferred, the [commit log is available here][commits]. +## May 30th, 2025 + +- As much as I tried, I just couldn't give up **iA Writer Quattro** as my body font. So it's back! Perhaps in the future I can use Hyperlegible as a toggle option. +- I also gave a very minor design pass to clean things up. One thing I changed was the page width. Felt like my most recent change was too wide, so back to being a bit narrower! + ## May 29th, 2025 - I updated my CSS pipeline! [My PR](https://git.cloud.haska.me/wonderfulfrog/wonderfulfrog.com/pulls/4) has more information, if you're curious. tl;dr: I decreased my build times! @@ -134,7 +139,7 @@ If preferred, the [commit log is available here][commits]. - Built with [Eleventy][11ty] - [Read all of the changes][v3] -[commits]: https://github.com/wonderfulfrog/wonderfulfrog.com/commits/main/ +[commits]: https://git.cloud.haska.me/wonderfulfrog/wonderfulfrog.com/commits/branch/main [11ty]: https://www.11ty.dev/ [v3]: /posts/version-3/ [blogroll]: /blogroll/ diff --git a/src/pages/colophon.md b/src/pages/colophon.md index 2aca1be..0427294 100644 --- a/src/pages/colophon.md +++ b/src/pages/colophon.md @@ -36,7 +36,7 @@ Code formatting is applied by [Prism][prismjs] and uses a tweaked version of the ## Design -The global font is [Atkinson Hyperlegible Next](https://www.brailleinstitute.org/freefont/), except for monospace fonts which uses the Mono variant of Atkinson Hyperlegible. +The global font is [iA Writer Quattro](https://github.com/iaolo/iA-Fonts), and the monospace font uses [iA Writer Mono](https://github.com/iaolo/iA-Fonts). The colour palette is viewable on the [styleguide][styleguide] page.