jlkruger/singular-particular-space
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Font refactor: replace generic display fonts across Videos + Writings

Browse Source 
Renegade Storyteller:
- Ribeye Marrow → Amarante (Art Nouveau, cleaner mobile rendering)
- h1 floor reduced 4rem → 3rem
- h1::before letter-spacing tightened on mobile (was overflowing narrow screens)

Writings (11 files via script):
- Bebas Neue → Fredericka the Great (4 files)
- Anton → Rubik Glitch (2 files)
- Cinzel / Cinzel Decorative → Glass Antiqua (5 files)

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
JL Kruger
2026-03-27 15:50:20 +02:00
parent 2f5c06fee8
commit fc60904e69
12 changed files with 113 additions and 109 deletions
Download Patch File Download Diff File Expand all files Collapse all files

26
Writings/lastmenstanding-annotated.html
View File

@@ -5,7 +5,7 @@
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>LAST MEN STANDING — Annotated</title>
<link rel="preconnect" href="https://fonts.googleapis.com">
<link href="https://fonts.googleapis.com/css2?family=Bebas+Neue&family=Special+Elite&family=Courier+Prime:ital@0;1&display=swap" rel="stylesheet">
<link href="https://fonts.googleapis.com/css2?family=Fredericka+the+Great&family=Special+Elite&family=Courier+Prime:ital@0;1&display=swap" rel="stylesheet">
<style>
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0;}
html{font-size:16px;scroll-behavior:smooth;}
@@ -90,7 +90,7 @@ body {
}
h1 {
font-family: 'Bebas Neue', sans-serif;
font-family: 'Fredericka the Great', sans-serif;
font-size: clamp(3.5rem, 14vw, 8.5rem);
letter-spacing: 0.05em;
line-height: 0.9;
@@ -135,7 +135,7 @@ h1 span { color: var(--amber); }
background:transparent; border:none;
border-bottom: 3px solid transparent;
color: var(--smoke);
font-family:'Bebas Neue', sans-serif;
font-family:'Fredericka the Great', sans-serif;
font-size:1rem; letter-spacing:0.18em;
padding: 0.85rem 1.5rem 0.65rem;
cursor:pointer; transition:all 0.15s;
@@ -204,7 +204,7 @@ h1 span { color: var(--amber); }
/* The anti-climax */
.nothing-happens {
font-family:'Bebas Neue', sans-serif;
font-family:'Fredericka the Great', sans-serif;
font-size:1.1rem;
letter-spacing:0.3em;
color: var(--smoke-faint);
@@ -221,7 +221,7 @@ h1 span { color: var(--amber); }
border-left: 3px solid var(--amber);
}
.challenge-box .ch-label {
font-family:'Bebas Neue', sans-serif;
font-family:'Fredericka the Great', sans-serif;
font-size:0.78rem;
letter-spacing:0.28em;
color: var(--amber-dim);
@@ -275,13 +275,13 @@ h1 span { color: var(--amber); }
.decode-label {
display:block;
font-family:'Bebas Neue', sans-serif;
font-family:'Fredericka the Great', sans-serif;
font-size:0.68rem; letter-spacing:0.3em;
color: var(--amber-dim); margin-bottom:0.25rem;
}
.decode-term {
display:block;
font-family:'Bebas Neue', sans-serif;
font-family:'Fredericka the Great', sans-serif;
font-size:1.05rem; letter-spacing:0.1em;
color: var(--amber); margin-bottom:0.4rem;
}
@@ -334,7 +334,7 @@ h1 span { color: var(--amber); }
.mn-label {
display:block;
font-family:'Bebas Neue', sans-serif;
font-family:'Fredericka the Great', sans-serif;
font-size:0.68rem; letter-spacing:0.3em;
color: var(--smoke); margin-bottom:0.25rem;
}
@@ -380,7 +380,7 @@ h1 span { color: var(--amber); }
background: var(--paper-mid); position:sticky; top:0;
}
.lb-title {
font-family:'Bebas Neue', sans-serif;
font-family:'Fredericka the Great', sans-serif;
font-size:1.1rem; letter-spacing:0.15em; color: var(--ink);
}
.lb-close {
@@ -393,7 +393,7 @@ h1 span { color: var(--amber); }
.lb-close:hover { background:var(--ink); color:var(--paper); }
.lb-body { padding:1.5rem; }
.lb-body h3 {
font-family:'Bebas Neue', sans-serif;
font-family:'Fredericka the Great', sans-serif;
font-size:0.85rem; letter-spacing:0.25em;
color: var(--amber-dim); margin:1.4rem 0 0.5rem;
padding-bottom:0.35rem; border-bottom:1px solid var(--paper-dark);
@@ -413,7 +413,7 @@ h1 span { color: var(--amber); }
background:var(--paper-mid); border:none; width:100%;
text-align:left; padding:0.9rem 1.1rem; cursor:pointer;
display:flex; justify-content:space-between; align-items:center;
font-family:'Bebas Neue', sans-serif; font-size:0.95rem;
font-family:'Fredericka the Great', sans-serif; font-size:0.95rem;
letter-spacing:0.12em; color:var(--smoke);
transition:all 0.15s; gap:1rem;
}
@@ -442,7 +442,7 @@ h1 span { color: var(--amber); }
padding:3.5rem 1.5rem 6rem;
}
.edu-wrap > h2 {
font-family:'Bebas Neue', sans-serif;
font-family:'Fredericka the Great', sans-serif;
font-size:clamp(2rem,6vw,3rem);
letter-spacing:0.1em; color:var(--ink);
margin-bottom:0.15rem;
@@ -456,7 +456,7 @@ h1 span { color: var(--amber); }
/* ── FURTHER READING ────────────────────────── */
.reading-section h3 {
font-family:'Bebas Neue', sans-serif;
font-family:'Fredericka the Great', sans-serif;
font-size:0.85rem; letter-spacing:0.28em;
color:var(--amber-dim); margin:2rem 0 0.6rem;
padding-bottom:0.4rem; border-bottom:2px solid var(--paper-dark);