Videos: font swap from JL's list + lightbox QoL fixes

Fonts (display/heading only — body untouched):
- Cringe Pit: Bebas Neue → Protest Revolution
- Renegade: Bebas Neue → Ribeye Marrow, Barlow Condensed → Faculty Glyphic (headings), Rambla (body)
- Nomad Soul: Bebas Neue → Trade Winds, Rye → Babylonica
- Hub: Bebas Neue → Workbench

Lightbox fixes (3 collection pages):
- window.onload → DOMContentLoaded (fires before iframes load, fixes slow mobile)
- lightbox-content: max-height 90vh + overflow-y auto (fixes off-screen on small viewports)

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
2026-03-27 15:44:17 +02:00
parent 608077131a
commit 2f5c06fee8
6 changed files with 346 additions and 24 deletions

View File

@@ -4,7 +4,7 @@
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>THE CRINGE PIT // Singular Particular</title>
<link href="https://fonts.googleapis.com/css2?family=Bebas+Neue&family=Space+Mono:wght@400;700&family=JetBrains+Mono:wght@300;500&display=swap" rel="stylesheet">
<link href="https://fonts.googleapis.com/css2?family=Protest+Revolution&family=Space+Mono:wght@400;700&family=JetBrains+Mono:wght@300;500&display=swap" rel="stylesheet">
<style>
:root {
--background: #04060b;
@@ -52,7 +52,7 @@
}
h1, h2, h3, h4 {
font-family: 'Bebas Neue', sans-serif;
font-family: 'Protest Revolution', sans-serif;
font-weight: 400;
text-transform: uppercase;
letter-spacing: 0.05em;
@@ -134,7 +134,7 @@
}
.video-title {
font-family: 'Bebas Neue', sans-serif;
font-family: 'Protest Revolution', sans-serif;
font-size: 1.7rem;
letter-spacing: 0.06em;
margin-bottom: var(--space-2);
@@ -165,6 +165,8 @@
max-width: 600px;
background-color: var(--surface-container-high);
padding: var(--space-8);
max-height: 90vh;
overflow-y: auto;
position: relative;
border-left: 3px solid var(--primary);
box-shadow: 0 0 60px rgba(255, 26, 224, 0.2), inset 0 0 40px rgba(0, 0, 0, 0.5);
@@ -192,7 +194,7 @@
color: var(--on-primary);
border: none;
padding: var(--space-2) var(--space-6);
font-family: 'Bebas Neue', sans-serif;
font-family: 'Protest Revolution', sans-serif;
font-size: 1.2rem;
letter-spacing: 0.2em;
text-transform: uppercase;
@@ -343,11 +345,11 @@
localStorage.setItem('cringe_pit_visited', 'true');
}
window.onload = () => {
document.addEventListener('DOMContentLoaded', () => {
if (!localStorage.getItem('cringe_pit_visited')) {
document.getElementById('welcome-gate').classList.add('active');
}
};
});
</script>
</body>
</html>