From b05ecf145d0cbd1d6d952411471ff41c281baada Mon Sep 17 00:00:00 2001 From: Alex Dunmow Date: Sun, 5 Jul 2026 17:16:40 +0800 Subject: [PATCH] fix(y2k): remediate home whitespace + mobile responsiveness MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit - discography: kill the ballooning empty-media box — compact fixed-height chrome tile placeholder instead of a full aspect-square gray void, and a real CSS media-query grid (.y2k-grid-records: 1/2/4 cols) so column count no longer depends on the host Tailwind having scanned this persona template (it stuck at 2 cols at 1440px, making each empty square huge). - landing: header absolute top-0 -> sticky top-0 (matches every other page template) so the audio bar no longer collides with / underlaps the navbar. - waveform_player: constrain to a centered max-w-4xl column with section padding (was edge-to-edge full-bleed) and stack on phones. - headings: remove the wide primary text-shadow halo that read as a stray render artifact behind every heading; tone the chrome shimmer to a faint glint. All colours stay semantic hsl(var(--token)). Co-Authored-By: Claude Opus 4.8 --- blocks/discography.ninjatpl | 10 ++++++-- blocks/waveform_player.ninjatpl | 10 +++++--- manifest.yaml | 44 +++++++++++++++++++++++++++------ templates/y2k/landing.ninjatpl | 2 +- 4 files changed, 52 insertions(+), 14 deletions(-) diff --git a/blocks/discography.ninjatpl b/blocks/discography.ninjatpl index 5cb7184..9868499 100644 --- a/blocks/discography.ninjatpl +++ b/blocks/discography.ninjatpl @@ -3,12 +3,18 @@
{% if heading %}

{{ heading }}

{% endif %} {% if releases %} -
+
{% for release in releases %}
+ {% if release.cover %}
- {% if release.link %}{% if release.cover %}{% img release.cover alt=release.title class="h-full w-full object-cover transition-transform duration-300 group-hover:scale-105" %}{% else %}{% endif %}{% elif release.cover %}{% img release.cover alt=release.title class="h-full w-full object-cover" %}{% else %}{% endif %} + {% if release.link %}{% img release.cover alt=release.title class="h-full w-full object-cover transition-transform duration-300 group-hover:scale-105" %}{% else %}{% img release.cover alt=release.title class="h-full w-full object-cover" %}{% endif %}
+ {% else %} +
+ {% if release.link %}{% else %}{% endif %} +
+ {% endif %}
{% if release.title %}

{% if release.link %}{{ release.title }}{% else %}{{ release.title }}{% endif %}

{% endif %}

{% if release.year %}{{ release.year }}{% endif %}{% if release.format %}{{ release.format }}{% endif %}

diff --git a/blocks/waveform_player.ninjatpl b/blocks/waveform_player.ninjatpl index f57a7e4..c17cf76 100644 --- a/blocks/waveform_player.ninjatpl +++ b/blocks/waveform_player.ninjatpl @@ -1,13 +1,17 @@ -{% if audioUrl or trackTitle %}
+{% if audioUrl or trackTitle %}
+
+
{% if coverImage %}{% img coverImage alt=trackTitle class="w-full h-full object-cover" %}{% else %}{% endif %}
-
+
{{ trackTitle|default:"untitled track" }} {% if artist %}{{ artist }}{% endif %}
{% if audioUrl %}{% else %}

No audio source set yet.

{% endif %}
-
{% endif %} +
+
+{% endif %} diff --git a/manifest.yaml b/manifest.yaml index 95eafb2..23dcaf0 100644 --- a/manifest.yaml +++ b/manifest.yaml @@ -193,20 +193,22 @@ css: .glitch { font-family: var(--font-heading, "Orbitron", "Michroma", system-ui, sans-serif); letter-spacing: 0.03em; + /* Subtle chrome bevel only — the old wide primary halo read as a + stray rendering artifact behind every heading, so it is gone. */ text-shadow: - 0 1px 0 hsl(var(--bevel-light) / 0.7), - 0 2px 0 hsl(var(--bevel-dark) / 0.35), - 0 6px 22px hsl(var(--primary) / 0.4); + 0 1px 0 hsl(var(--bevel-light) / 0.55), + 0 1px 1px hsl(var(--bevel-dark) / 0.22); } - /* Chrome shimmer sweep across big headlines (motion, reduced-motion-safe). */ + /* Chrome shimmer sweep across big headlines (motion, reduced-motion-safe). + Toned to a faint glint so it never smears the letters in a still frame. */ .glitch { position: relative; background-image: linear-gradient( 100deg, - transparent 20%, - hsl(var(--bevel-light) / 0.65) 45%, - hsl(var(--accent) / 0.55) 50%, - transparent 60%); + transparent 35%, + hsl(var(--bevel-light) / 0.3) 48%, + hsl(var(--accent) / 0.22) 50%, + transparent 62%); background-size: 220% 100%; background-repeat: no-repeat; -webkit-background-clip: text; @@ -356,6 +358,32 @@ css: 0 4px 14px hsl(var(--bevel-dark) / 0.22); } + /* --- Responsive persona grids ----------------------------- */ + /* Explicit media queries so column counts do NOT depend on the host + Tailwind build having scanned these theme templates (persona blocks + use responsive class combos no builtin emits, so the JIT drops them + and the grid collapses to its base count). 1 col on phones. */ + .y2k-grid-records { + display: grid; + gap: 1.5rem; + grid-template-columns: minmax(0, 1fr); + } + @media (min-width: 640px) { + .y2k-grid-records { grid-template-columns: repeat(2, minmax(0, 1fr)); } + } + @media (min-width: 1024px) { + .y2k-grid-records { grid-template-columns: repeat(4, minmax(0, 1fr)); } + } + + /* Compact chrome tile for absent album/track art — a fixed, modest + height so an empty media field never balloons into a blank box. */ + .y2k-media-empty { + display: flex; + align-items: center; + justify-content: center; + height: 11rem; + } + /* --- Marquee ---------------------------------------------- */ .y2k-marquee { overflow: hidden; diff --git a/templates/y2k/landing.ninjatpl b/templates/y2k/landing.ninjatpl index cfd7934..9537aab 100644 --- a/templates/y2k/landing.ninjatpl +++ b/templates/y2k/landing.ninjatpl @@ -4,7 +4,7 @@ {{ admin_banner_html|safe }} -
{{ slots.header|safe }}
+
{{ slots.header|safe }}
{% if slots.main %}{{ slots.main|safe }}{% else %}

Nothing on this page yet

{% endif %}
{{ body_end_html|safe }}