Compare commits

..

No commits in common. "47776c0b6f4d53298bf6098516eb8298b5b5f334" and "ea61a282ce8a17941e787dba087c54105ed23b93" have entirely different histories.

43 changed files with 86 additions and 474 deletions

View File

@ -12,7 +12,7 @@
</div>
{% else %}
<div class="flex h-44 items-center justify-center y2k-chrome-bg text-muted-foreground">
{% if release.link %}<a href="{{ release.link }}" class="flex h-full w-full items-center justify-center" aria-label="{{ release.title }}"><svg width="48" height="48" class="h-12 w-12" aria-hidden="true"><use href="/icons/lucide.svg#disc"></use></svg></a>{% else %}<svg width="48" height="48" class="h-12 w-12" aria-hidden="true"><use href="/icons/lucide.svg#disc"></use></svg>{% endif %}
{% if release.link %}<a href="{{ release.link }}" class="flex h-full w-full items-center justify-center" aria-label="{{ release.title }}"><svg class="h-12 w-12" aria-hidden="true"><use href="/icons/lucide.svg#disc"></use></svg></a>{% else %}<svg class="h-12 w-12" aria-hidden="true"><use href="/icons/lucide.svg#disc"></use></svg>{% endif %}
</div>
{% endif %}
<div class="p-3">

View File

@ -2,7 +2,7 @@
<div class="mx-auto max-w-4xl px-4">
<figure class="y2k-bevel y2k-chrome-bg rounded-xl overflow-hidden flex flex-col gap-4 p-4 sm:flex-row sm:items-stretch">
<div class="w-20 h-20 shrink-0 y2k-image-frame overflow-hidden bg-muted">
{% if coverImage %}{% img coverImage alt=trackTitle class="w-full h-full object-cover" %}{% else %}<span class="flex h-full w-full items-center justify-center text-muted-foreground"><svg width="32" height="32" class="h-8 w-8" aria-hidden="true"><use href="/icons/lucide.svg#music"></use></svg></span>{% endif %}
{% if coverImage %}{% img coverImage alt=trackTitle class="w-full h-full object-cover" %}{% else %}<span class="flex h-full w-full items-center justify-center text-muted-foreground"><svg class="h-8 w-8" aria-hidden="true"><use href="/icons/lucide.svg#music"></use></svg></span>{% endif %}
</div>
<div class="flex-1 min-w-0 flex flex-col justify-between gap-2">
<figcaption class="flex flex-wrap items-baseline justify-between gap-x-3 gap-y-1 min-w-0">
@ -10,7 +10,7 @@
{% if artist %}<span class="y2k-mono text-xs uppercase tracking-wider text-muted-foreground shrink-0">{{ artist }}</span>{% endif %}
</figcaption>
<div class="w-full h-12 y2k-waveform" aria-hidden="true"></div>
{% if audioUrl %}<audio controls preload="none" class="w-full" src="{{ audioUrl }}">Your browser does not support the audio element.</audio>{% else %}<div class="y2k-mono flex items-center gap-2.5 text-xs uppercase tracking-widest text-foreground"><span aria-hidden="true" class="y2k-status-dot inline-block h-2 w-2 shrink-0 rounded-full bg-primary"></span><span class="font-semibold text-primary">Side A</span><span aria-hidden="true" class="text-foreground/40">//</span><span class="normal-case tracking-wide text-foreground/70">live to tape</span></div>{% endif %}
{% if audioUrl %}<audio controls preload="none" class="w-full" src="{{ audioUrl }}">Your browser does not support the audio element.</audio>{% else %}<p class="y2k-mono text-xs text-muted-foreground">No audio source set yet.</p>{% endif %}
</div>
</figure>
</div>

View File

@ -124,15 +124,6 @@ css:
below are HSL triples consumed the same way. No literal hex/rgb.
============================================================ */
/* --- Bundled display faces (CMS does not emit @font-face for
LoadedPlugin.BundledFonts — dead code; theme-side workaround per
gotham@1.2.0). Served from the extracted .bnp at /templates/y2k/fonts/*.
Presets set typography.fontHeading/body/mono to template:y2k:<Family>,
which resolves --font-heading/body/mono to these families. --------- */
@font-face { font-family: 'Orbitron'; src: url('/templates/y2k/fonts/orbitron-latin.woff2') format('woff2'); font-weight: 400 900; font-style: normal; font-display: swap; }
@font-face { font-family: 'Share Tech Mono'; src: url('/templates/y2k/fonts/share-tech-mono-latin.woff2') format('woff2'); font-weight: 400; font-style: normal; font-display: swap; }
@font-face { font-family: 'Inter'; src: url('/templates/y2k/fonts/inter-latin.woff2') format('woff2'); font-weight: 400 700; font-style: normal; font-display: swap; }
/* --- Chrome / mesh / bevel channel tokens ----------------- */
:root {
--chrome-1: 220 40% 96%;
@ -478,19 +469,6 @@ css:
radial-gradient(50% 45% at 50% 80%, hsl(var(--mesh-c) / 0.45), transparent 60%),
linear-gradient(to bottom, transparent, hsl(var(--background) / 0.7));
}
/* Hero legibility scrim: a radial wash of the page background behind the
headline. In LIGHT mode --background is near-white so the centre stays
light and dark hero text reads over the bright mesh; in DARK mode
--background is near-black so the centre darkens and light text reads.
One rule fixes contrast in both modes without dulling the showpiece. */
.y2k-hero-scrim {
z-index: 5;
background-image: radial-gradient(
ellipse 78% 68% at 50% 46%,
hsl(var(--background) / 0.86) 0%,
hsl(var(--background) / 0.5) 46%,
transparent 80%);
}
/* --- Reduced motion: kill all motion ---------------------- */
@media (prefers-reduced-motion: reduce) {

View File

@ -2,7 +2,7 @@
name = "y2k"
display_name = "Y2K"
scope = "@themes"
version = "0.4.0"
version = "0.3.0"
description = "Millennium-web band theme — liquid-chrome bevels, frosted plastic, gradient mesh, marquees, glitter, a webring, and a canvas metaball hero. Built for musicians and bands."
kind = "theme"
categories = ["templates"]

View File

@ -5,13 +5,6 @@
"description": "Bondi-blue frosted plastic in light, UV magenta rave in dark — the Y2K default",
"theme": {
"mode": "both",
"typography": {
"fontHeading": "template:y2k:Orbitron",
"fontBody": "template:y2k:Inter",
"fontMono": "template:y2k:Share Tech Mono",
"fontSizeBase": "16",
"lineHeightBase": "1.65"
},
"lightColors": {
"background": "205 55% 96%",
"foreground": "230 40% 14%",
@ -62,13 +55,6 @@
"description": "Cotton-candy pink plastic in light, hot-pink blacklight in dark",
"theme": {
"mode": "both",
"typography": {
"fontHeading": "template:y2k:Orbitron",
"fontBody": "template:y2k:Inter",
"fontMono": "template:y2k:Share Tech Mono",
"fontSizeBase": "16",
"lineHeightBase": "1.65"
},
"lightColors": {
"background": "330 60% 97%",
"foreground": "320 35% 16%",
@ -119,13 +105,6 @@
"description": "Frosted lime soda in light, radioactive green rave in dark",
"theme": {
"mode": "both",
"typography": {
"fontHeading": "template:y2k:Orbitron",
"fontBody": "template:y2k:Inter",
"fontMono": "template:y2k:Share Tech Mono",
"fontSizeBase": "16",
"lineHeightBase": "1.65"
},
"lightColors": {
"background": "150 45% 96%",
"foreground": "170 35% 12%",
@ -176,13 +155,6 @@
"description": "Brushed-silver chrome in light, restrained slate blacklight in dark",
"theme": {
"mode": "both",
"typography": {
"fontHeading": "template:y2k:Orbitron",
"fontBody": "template:y2k:Inter",
"fontMono": "template:y2k:Share Tech Mono",
"fontSizeBase": "16",
"lineHeightBase": "1.65"
},
"lightColors": {
"background": "220 18% 95%",
"foreground": "225 25% 14%",
@ -233,13 +205,6 @@
"description": "Translucent tangerine iMac in light, sunset-orange rave in dark",
"theme": {
"mode": "both",
"typography": {
"fontHeading": "template:y2k:Orbitron",
"fontBody": "template:y2k:Inter",
"fontMono": "template:y2k:Share Tech Mono",
"fontSizeBase": "16",
"lineHeightBase": "1.65"
},
"lightColors": {
"background": "35 70% 96%",
"foreground": "20 40% 15%",

Binary file not shown.

Before

Width:  |  Height:  |  Size: 2.9 MiB

After

Width:  |  Height:  |  Size: 88 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 3.4 MiB

After

Width:  |  Height:  |  Size: 88 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 2.9 MiB

After

Width:  |  Height:  |  Size: 86 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 1.7 MiB

After

Width:  |  Height:  |  Size: 78 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 1.6 MiB

After

Width:  |  Height:  |  Size: 75 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 476 KiB

After

Width:  |  Height:  |  Size: 76 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 469 KiB

After

Width:  |  Height:  |  Size: 73 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 515 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 132 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 835 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 215 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 192 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 265 KiB

View File

@ -6,74 +6,16 @@
"tagline": "A four-piece from the frosted end of the millennium."
}
},
"media": [
{
"id": "b7c0de00-0000-4000-8000-000000000001",
"file": "media/chrome-liquid-metal.jpg",
"alt": "Liquid chrome poured into a mirror-bright abstract surface",
"folder": "Chrome Static"
},
{
"id": "b7c0de00-0000-4000-8000-000000000002",
"file": "media/holographic-foil.jpg",
"alt": "Rainbow holographic foil catching the light",
"folder": "Chrome Static"
},
{
"id": "b7c0de00-0000-4000-8000-000000000003",
"file": "media/abstract-neon.jpg",
"alt": "Abstract neon light trails in magenta and cyan",
"folder": "Chrome Static"
},
{
"id": "b7c0de00-0000-4000-8000-000000000004",
"file": "media/cassette.jpg",
"alt": "A worn audio cassette tape on a plain background",
"folder": "Chrome Static"
},
{
"id": "b7c0de00-0000-4000-8000-000000000005",
"file": "media/neon-rave.jpg",
"alt": "Blurred neon rave lights in the dark",
"folder": "Chrome Static"
},
{
"id": "b7c0de00-0000-4000-8000-000000000006",
"file": "media/chrome-metallic.jpg",
"alt": "Brushed metallic chrome texture, wide crop",
"folder": "Chrome Static"
}
],
"data_tables": [
{
"key": "contact_submissions",
"name": "Contact Enquiries",
"description": "Seeded contact-form submissions for the Chrome Static demo. A submission becomes a row here and emails the site admins.",
"columns": [
{
"key": "name",
"label": "Name",
"type": "text",
"required": true
},
{
"key": "email",
"label": "Email",
"type": "email",
"required": true
},
{
"key": "subject",
"label": "Subject",
"type": "text",
"required": false
},
{
"key": "message",
"label": "Message",
"type": "text",
"required": true
}
{ "key": "name", "label": "Name", "type": "text", "required": true },
{ "key": "email", "label": "Email", "type": "email", "required": true },
{ "key": "subject", "label": "Subject", "type": "text", "required": false },
{ "key": "message", "label": "Message", "type": "text", "required": true }
]
}
],
@ -95,14 +37,8 @@
"headline": "Chrome Static",
"subheadline": "Four tracks. Recorded live to tape.",
"description": "We are a four-piece from Melbourne. We make loud, bright pop for the end of the millennium.",
"ctaPrimary": {
"text": "Listen",
"url": "#listen"
},
"ctaSecondary": {
"text": "See the shows",
"url": "#shows"
}
"ctaPrimary": { "text": "Listen", "url": "#listen" },
"ctaSecondary": { "text": "See the shows", "url": "#shows" }
}
},
{
@ -114,7 +50,7 @@
"trackTitle": "Frosted",
"artist": "Chrome Static",
"audioUrl": "",
"coverImage": "media:b7c0de00-0000-4000-8000-000000000005"
"coverImage": ""
}
},
{
@ -125,34 +61,10 @@
"content": {
"heading": "Records",
"releases": [
{
"title": "Chrome Hearts",
"year": "2001",
"format": "LP",
"cover": "media:b7c0de00-0000-4000-8000-000000000001",
"link": "#"
},
{
"title": "Dial-Up Dreams",
"year": "2000",
"format": "EP",
"cover": "media:b7c0de00-0000-4000-8000-000000000002",
"link": "#"
},
{
"title": "Frosted",
"year": "1999",
"format": "Single",
"cover": "media:b7c0de00-0000-4000-8000-000000000003",
"link": "#"
},
{
"title": "Skyline Demos",
"year": "1998",
"format": "Cassette",
"cover": "media:b7c0de00-0000-4000-8000-000000000004",
"link": "#"
}
{ "title": "Chrome Hearts", "year": "2001", "format": "LP", "cover": "", "link": "#" },
{ "title": "Dial-Up Dreams", "year": "2000", "format": "EP", "cover": "", "link": "#" },
{ "title": "Frosted", "year": "1999", "format": "Single", "cover": "", "link": "#" },
{ "title": "Skyline Demos", "year": "1998", "format": "Cassette", "cover": "", "link": "#" }
]
}
},
@ -165,27 +77,9 @@
"heading": "Shows",
"intro": "Doors an hour before. All ages unless noted.",
"dates": [
{
"date": "Fri 12 Sep",
"venue": "The Chrome Room",
"city": "Melbourne",
"ticketUrl": "#",
"soldOut": false
},
{
"date": "Sat 13 Sep",
"venue": "Rollerdrome",
"city": "Sydney",
"ticketUrl": "#",
"soldOut": true
},
{
"date": "Fri 19 Sep",
"venue": "Basement 88",
"city": "Brisbane",
"ticketUrl": "#",
"soldOut": false
}
{ "date": "Fri 12 Sep", "venue": "The Chrome Room", "city": "Melbourne", "ticketUrl": "#", "soldOut": false },
{ "date": "Sat 13 Sep", "venue": "Rollerdrome", "city": "Sydney", "ticketUrl": "#", "soldOut": true },
{ "date": "Fri 19 Sep", "venue": "Basement 88", "city": "Brisbane", "ticketUrl": "#", "soldOut": false }
]
}
},
@ -209,86 +103,21 @@
"title": "The band",
"template_key": "default",
"blocks": [
{
"block_key": "image",
"title": "Band image",
"slot": "main",
"sort_order": 1,
"content": {
"src": "media:b7c0de00-0000-4000-8000-000000000006",
"alt": "Brushed metallic chrome texture",
"caption": "Chrome Static — live to tape, one room.",
"size": "full",
"aspectRatio": "wide"
}
},
{
"block_key": "heading",
"title": "Heading",
"slot": "main",
"sort_order": 2,
"content": {
"text": "The band",
"level": 1
}
},
{
"block_key": "rich-text",
"title": "Story",
"slot": "main",
"sort_order": 3,
"content": {
"html": "<p>Chrome Static started in a share house with a borrowed drum machine and a broken amp. We kept the sound and fixed the amp.</p><p>We record live to tape in one room. What you hear on the record is what we play on the night. Four people, no click track, one take when we can get it.</p>"
}
},
{
"block_key": "quote",
"title": "Quote",
"slot": "main",
"sort_order": 4,
"content": {
"style": "pull",
"quote": "Loud, bright, and done in one take.",
"attribution": "Chrome Static"
}
},
{
"block_key": "divider",
"title": "Divider",
"slot": "main",
"sort_order": 5,
"content": {
"variant": "line",
"weight": "medium"
}
},
{ "block_key": "heading", "title": "Heading", "slot": "main", "sort_order": 1, "content": { "text": "The band", "level": 1 } },
{ "block_key": "rich-text", "title": "Story", "slot": "main", "sort_order": 2, "content": { "html": "<p>Chrome Static started in a share house with a borrowed drum machine and a broken amp. We kept the sound and fixed the amp.</p><p>We record live to tape in one room. What you hear on the record is what we play on the night. Four people, no click track, one take when we can get it.</p>" } },
{ "block_key": "quote", "title": "Quote", "slot": "main", "sort_order": 3, "content": { "style": "pull", "quote": "Loud, bright, and done in one take.", "attribution": "Chrome Static" } },
{ "block_key": "divider", "title": "Divider", "slot": "main", "sort_order": 4, "content": { "variant": "line", "weight": "medium" } },
{
"block_key": "y2k:tracklist",
"title": "Frosted tracklist",
"slot": "main",
"sort_order": 6,
"sort_order": 5,
"content": {
"tracks": [
{
"title": "Frosted",
"duration": "3:12",
"url": ""
},
{
"title": "Dial Tone",
"duration": "2:48",
"url": ""
},
{
"title": "Silver Static",
"duration": "4:01",
"url": ""
},
{
"title": "Skyline",
"duration": "3:35",
"url": ""
}
{ "title": "Frosted", "duration": "3:12", "url": "" },
{ "title": "Dial Tone", "duration": "2:48", "url": "" },
{ "title": "Silver Static", "duration": "4:01", "url": "" },
{ "title": "Skyline", "duration": "3:35", "url": "" }
]
}
}
@ -299,45 +128,9 @@
"title": "Journal",
"template_key": "blog-index",
"blocks": [
{
"block_key": "card",
"title": "Post: Tape",
"slot": "main",
"sort_order": 1,
"content": {
"layout": "vertical",
"title": "Why we still track to tape",
"text": "<p>Tape makes us commit. Here is what that costs and what we get back.</p>",
"link": "/blog/tracking-to-tape",
"linkLabel": "Read on"
}
},
{
"block_key": "card",
"title": "Post: Tour",
"slot": "main",
"sort_order": 2,
"content": {
"layout": "vertical",
"title": "Notes from the September run",
"text": "<p>Three cities in a van. What went right and what broke.</p>",
"link": "/blog/september-run",
"linkLabel": "Read on"
}
},
{
"block_key": "card",
"title": "Post: Gear",
"slot": "main",
"sort_order": 3,
"content": {
"layout": "vertical",
"title": "The one pedal we cannot replace",
"text": "<p>A cheap chorus pedal from 1999. It is the whole sound.</p>",
"link": "/blog/the-chorus-pedal",
"linkLabel": "Read on"
}
}
{ "block_key": "card", "title": "Post: Tape", "slot": "main", "sort_order": 1, "content": { "layout": "vertical", "title": "Why we still track to tape", "text": "<p>Tape makes us commit. Here is what that costs and what we get back.</p>", "link": "/blog/tracking-to-tape", "linkLabel": "Read on" } },
{ "block_key": "card", "title": "Post: Tour", "slot": "main", "sort_order": 2, "content": { "layout": "vertical", "title": "Notes from the September run", "text": "<p>Three cities in a van. What went right and what broke.</p>", "link": "/blog/september-run", "linkLabel": "Read on" } },
{ "block_key": "card", "title": "Post: Gear", "slot": "main", "sort_order": 3, "content": { "layout": "vertical", "title": "The one pedal we cannot replace", "text": "<p>A cheap chorus pedal from 1999. It is the whole sound.</p>", "link": "/blog/the-chorus-pedal", "linkLabel": "Read on" } }
]
},
{
@ -346,25 +139,8 @@
"template_key": "article",
"parent_slug": "/blog",
"blocks": [
{
"block_key": "heading",
"title": "Title",
"slot": "main",
"sort_order": 1,
"content": {
"text": "Why we still track to tape",
"level": 1
}
},
{
"block_key": "rich-text",
"title": "Body",
"slot": "main",
"sort_order": 2,
"content": {
"html": "<p>Everyone asks why we still bother with tape. The honest answer is that it makes us better &mdash; not the sound first, the playing. Tape does not let you undo, so you stop treating a take like a draft and start treating it like a performance.</p><p>We tracked Frosted in a converted laundry in Brunswick over four nights in the winter of 1999. One room, one machine, four of us, and whoever wandered in. The reel we used was already half-worn from a demo we would rather forget, which is why side A has a faint ghost of an old chorus under the second verse. We kept it.</p><p>The rule was simple. Three takes, then we move on. If a song was not working by the third pass it was the arrangement, not the take, and no amount of punching in was going to save it. That rule cost us two songs and saved us a fortnight.</p><p>Digital gives you infinite tries and somehow that makes everyone worse. When you can fix it later, you play like you will fix it later. You lean back. Tape makes you lean in. The only click is your own pulse, and the only quantising is whether the four of you agree on where the beat lands.</p><p>There is a cost and we are not going to pretend there isn't. Tape is expensive, editing is a razor blade and a chinagraph pencil, and if the machine eats a reel you have lost the night. We lost one night. The heads needed cleaning and nobody noticed until the playback came back muddy, and by then it was three in the morning and the coffee was gone.</p><p>What you get back is a record that sounds like a room instead of a grid. You can hear the walls. You can hear the amp two feet from the kit bleeding into the overheads, and that bleed is the glue that makes four people sound like one band instead of four separate files.</p><p>We mix to tape too, which horrifies our engineer friends. The two-track we bounce down to adds a compression you cannot dial in on a plugin &mdash; a gentle softening on the transients that takes the ice off the top end. Chrome, without the cuts.</p><p>People say tape is nostalgia. Maybe. But nobody accuses a painter of nostalgia for using oil instead of a screen. It is a medium with a grain, and the grain is the point. We are not trying to sound like 1979. We are trying to sound like the four of us in a laundry in 1999, because that is what we are.</p><p>If you are thinking about doing it, do it once before you decide. Book a day, bring three songs you know cold, and give yourself three takes each. You will learn more about your band in eight hours than in a year of overdubs.</p><p>The next record will be tape as well. We already booked the room &mdash; same laundry, new reels &mdash; and we will keep whatever ghosts turn up.</p>"
}
}
{ "block_key": "heading", "title": "Title", "slot": "main", "sort_order": 1, "content": { "text": "Why we still track to tape", "level": 1 } },
{ "block_key": "rich-text", "title": "Body", "slot": "main", "sort_order": 2, "content": { "html": "<p>Tape does not let you undo. You play it, you keep it, or you play it again. That pressure shows up in the take.</p><p>It is slower and it costs more. We think the trade is worth it. The record sounds like a room, not a grid.</p>" } }
]
},
{
@ -373,25 +149,8 @@
"template_key": "article",
"parent_slug": "/blog",
"blocks": [
{
"block_key": "heading",
"title": "Title",
"slot": "main",
"sort_order": 1,
"content": {
"text": "Notes from the September run",
"level": 1
}
},
{
"block_key": "rich-text",
"title": "Body",
"slot": "main",
"sort_order": 2,
"content": {
"html": "<p>Three cities, one van, four amps. The van held. One amp did not.</p><p>Sydney sold out and Brisbane nearly did. We ate too much servo food and slept in the van outside a Bunnings. We would do it again next week.</p>"
}
}
{ "block_key": "heading", "title": "Title", "slot": "main", "sort_order": 1, "content": { "text": "Notes from the September run", "level": 1 } },
{ "block_key": "rich-text", "title": "Body", "slot": "main", "sort_order": 2, "content": { "html": "<p>Three cities, one van, four amps. The van held. One amp did not.</p><p>Sydney sold out and Brisbane nearly did. We ate too much servo food and slept in the van outside a Bunnings. We would do it again next week.</p>" } }
]
},
{
@ -400,25 +159,8 @@
"template_key": "article",
"parent_slug": "/blog",
"blocks": [
{
"block_key": "heading",
"title": "Title",
"slot": "main",
"sort_order": 1,
"content": {
"text": "The one pedal we cannot replace",
"level": 1
}
},
{
"block_key": "rich-text",
"title": "Body",
"slot": "main",
"sort_order": 2,
"content": {
"html": "<p>It is a plastic chorus pedal from 1999. It hisses and the knob is loose. It is also the whole guitar sound.</p><p>We have tried to replace it twice. Both times the record sounded wrong, so the old one went back on the board.</p>"
}
}
{ "block_key": "heading", "title": "Title", "slot": "main", "sort_order": 1, "content": { "text": "The one pedal we cannot replace", "level": 1 } },
{ "block_key": "rich-text", "title": "Body", "slot": "main", "sort_order": 2, "content": { "html": "<p>It is a plastic chorus pedal from 1999. It hisses and the knob is loose. It is also the whole guitar sound.</p><p>We have tried to replace it twice. Both times the record sounded wrong, so the old one went back on the board.</p>" } }
]
},
{
@ -437,40 +179,12 @@
"submitLabel": "Send",
"successMessage": "Thanks. We will get back to you soon.",
"fields": [
{
"name": "name",
"label": "Your name",
"type": "text",
"required": true,
"width": "half"
},
{
"name": "email",
"label": "Email",
"type": "email",
"required": true,
"width": "half"
},
{
"name": "subject",
"label": "Subject",
"type": "text",
"required": false,
"width": "full"
},
{
"name": "message",
"label": "Message",
"type": "textarea",
"required": true,
"width": "full"
}
{ "name": "name", "label": "Your name", "type": "text", "required": true, "width": "half" },
{ "name": "email", "label": "Email", "type": "email", "required": true, "width": "half" },
{ "name": "subject", "label": "Subject", "type": "text", "required": false, "width": "full" },
{ "name": "message", "label": "Message", "type": "textarea", "required": true, "width": "full" }
],
"formConfig": {
"enabled": true,
"captchaEnabled": false,
"targetTable": "contact_submissions"
}
"formConfig": { "enabled": true, "captchaEnabled": false, "targetTable": "contact_submissions" }
}
},
{
@ -482,24 +196,9 @@
"heading": "Other ways in",
"columns": 3,
"channels": [
{
"icon": "lucide:mail",
"label": "Email",
"value": "hello@chromestatic.band",
"link": "mailto:hello@chromestatic.band"
},
{
"icon": "simple-icons:bandcamp",
"label": "Bandcamp",
"value": "chromestatic.bandcamp.com",
"link": "#"
},
{
"icon": "simple-icons:instagram",
"label": "Instagram",
"value": "@chromestatic",
"link": "#"
}
{ "icon": "lucide:mail", "label": "Email", "value": "hello@chromestatic.band", "link": "mailto:hello@chromestatic.band" },
{ "icon": "simple-icons:bandcamp", "label": "Bandcamp", "value": "chromestatic.bandcamp.com", "link": "#" },
{ "icon": "simple-icons:instagram", "label": "Instagram", "value": "@chromestatic", "link": "#" }
]
}
}
@ -510,43 +209,14 @@
"title": "Sign in",
"template_key": "auth",
"blocks": [
{
"block_key": "auth-form",
"title": "Sign in",
"slot": "main",
"sort_order": 1,
"content": {
"default_tab": "login",
"show_social": false
}
}
{ "block_key": "auth-form", "title": "Sign in", "slot": "main", "sort_order": 1, "content": { "default_tab": "login", "show_social": false } }
]
}
],
"menu_items": [
{
"menu": "main",
"label": "Home",
"page_slug": "/",
"sort_order": 1
},
{
"menu": "main",
"label": "The band",
"page_slug": "/about",
"sort_order": 2
},
{
"menu": "main",
"label": "Journal",
"page_slug": "/blog",
"sort_order": 3
},
{
"menu": "main",
"label": "Contact",
"page_slug": "/contact",
"sort_order": 4
}
{ "menu": "main", "label": "Home", "page_slug": "/", "sort_order": 1 },
{ "menu": "main", "label": "The band", "page_slug": "/about", "sort_order": 2 },
{ "menu": "main", "label": "Journal", "page_slug": "/blog", "sort_order": 3 },
{ "menu": "main", "label": "Contact", "page_slug": "/contact", "sort_order": 4 }
]
}

View File

@ -1,5 +1,5 @@
{# audio-embed y2k override: neon panel, mono meta. Facade script + data-bn-* attributes + {% img %} preserved byte-for-byte. #}
<figure class="bn-audio my-6 overflow-hidden rounded-md border border-primary/40 bg-card text-card-foreground neon-edge-magenta{% if class %} {{ class }}{% endif %}" data-bn-audio data-audio-url="{{ url|default:"" }}" data-audio-media="{% if media %}{{ media|mediaURL }}{% endif %}"><div class="flex items-center gap-4 p-4">{% if artwork %}<div class="h-16 w-16 shrink-0 overflow-hidden rounded-md border border-primary/30 bg-muted">{% img artwork alt=title|default:"" class="h-full w-full object-cover" %}</div>{% endif %}<div class="min-w-0 flex-1">{% if title %}<p class="y2k-display truncate font-medium text-foreground">{{ title }}</p>{% endif %}{% if artist %}<p class="y2k-mono truncate text-sm text-muted-foreground">{{ artist }}</p>{% endif %}<div class="mt-2 flex items-center gap-3" data-bn-audio-slot><button type="button" data-bn-audio-play class="y2k-mono clip-cut inline-flex items-center gap-2 rounded-md bg-primary px-4 py-1.5 text-sm font-medium uppercase tracking-wide text-primary-foreground transition-colors hover:bg-primary/90 focus:outline-none focus-visible:ring-2 focus-visible:ring-ring" aria-label="Play{% if title %}: {{ title }}{% endif %}"><svg width="16" height="16" aria-hidden="true"><use href="/icons/lucide.svg#play"></use></svg> Play</button>{% if download %}<a href="{% if media %}{{ media|mediaURL }}{% else %}{{ url }}{% endif %}" download class="y2k-mono inline-flex items-center gap-1 text-sm text-muted-foreground hover:text-foreground"><svg width="16" height="16" aria-hidden="true"><use href="/icons/lucide.svg#download"></use></svg> Download</a>{% endif %}</div></div></div></figure><script>
<figure class="bn-audio my-6 overflow-hidden rounded-md border border-primary/40 bg-card text-card-foreground neon-edge-magenta{% if class %} {{ class }}{% endif %}" data-bn-audio data-audio-url="{{ url|default:"" }}" data-audio-media="{% if media %}{{ media|mediaURL }}{% endif %}"><div class="flex items-center gap-4 p-4">{% if artwork %}<div class="h-16 w-16 shrink-0 overflow-hidden rounded-md border border-primary/30 bg-muted">{% img artwork alt=title|default:"" class="h-full w-full object-cover" %}</div>{% endif %}<div class="min-w-0 flex-1">{% if title %}<p class="y2k-display truncate font-medium text-foreground">{{ title }}</p>{% endif %}{% if artist %}<p class="y2k-mono truncate text-sm text-muted-foreground">{{ artist }}</p>{% endif %}<div class="mt-2 flex items-center gap-3" data-bn-audio-slot><button type="button" data-bn-audio-play class="y2k-mono clip-cut inline-flex items-center gap-2 rounded-md bg-primary px-4 py-1.5 text-sm font-medium uppercase tracking-wide text-primary-foreground transition-colors hover:bg-primary/90 focus:outline-none focus-visible:ring-2 focus-visible:ring-ring" aria-label="Play{% if title %}: {{ title }}{% endif %}">::lucide:play:sm:: Play</button>{% if download %}<a href="{% if media %}{{ media|mediaURL }}{% else %}{{ url }}{% endif %}" download class="y2k-mono inline-flex items-center gap-1 text-sm text-muted-foreground hover:text-foreground">::lucide:download:sm:: Download</a>{% endif %}</div></div></div></figure><script>
(function(){
if(window.__bnAudioFacade)return;window.__bnAudioFacade=true;
document.addEventListener('click',function(e){

View File

@ -30,8 +30,8 @@
</script>{% endmacro %}
{% macro social() %}{% if show_social != false and (context.site.google_oauth_client_id or context.site.facebook_app_id) %}<div class="auth-social my-4">
<div class="relative my-4"><hr class="border-border"/><span class="y2k-mono absolute top-1/2 left-1/2 -translate-x-1/2 -translate-y-1/2 bg-background px-3 text-xs uppercase tracking-widest text-muted-foreground">or</span></div>
{% if context.site.google_oauth_client_id %}<a href="/api/auth/google/start" class="y2k-mono mb-2 flex w-full items-center justify-center gap-3 rounded-md border border-border px-4 py-2.5 uppercase tracking-wide transition-colors hover:bg-accent/10"><svg width="20" height="20" class="h-5 w-5" aria-hidden="true"><use href="/icons/simple-icons.svg#google"></use></svg><span class="text-sm font-medium text-foreground/80">Continue with Google</span></a>{% endif %}
{% if context.site.facebook_app_id %}<a href="/api/auth/facebook/start" class="y2k-mono flex w-full items-center justify-center gap-3 rounded-md border border-border px-4 py-2.5 uppercase tracking-wide transition-colors hover:bg-accent/10"><svg width="20" height="20" class="h-5 w-5" aria-hidden="true"><use href="/icons/simple-icons.svg#facebook"></use></svg><span class="text-sm font-medium text-foreground/80">Continue with Facebook</span></a>{% endif %}
{% if context.site.google_oauth_client_id %}<a href="/api/auth/google/start" class="y2k-mono mb-2 flex w-full items-center justify-center gap-3 rounded-md border border-border px-4 py-2.5 uppercase tracking-wide transition-colors hover:bg-accent/10"><svg class="h-5 w-5" aria-hidden="true"><use href="/icons/simple-icons.svg#google"></use></svg><span class="text-sm font-medium text-foreground/80">Continue with Google</span></a>{% endif %}
{% if context.site.facebook_app_id %}<a href="/api/auth/facebook/start" class="y2k-mono flex w-full items-center justify-center gap-3 rounded-md border border-border px-4 py-2.5 uppercase tracking-wide transition-colors hover:bg-accent/10"><svg class="h-5 w-5" aria-hidden="true"><use href="/icons/simple-icons.svg#facebook"></use></svg><span class="text-sm font-medium text-foreground/80">Continue with Facebook</span></a>{% endif %}
</div>{% endif %}{% endmacro %}
<div class="auth-form hud-frame mx-auto max-w-md rounded-md border border-primary/40 bg-card p-6 text-card-foreground neon-edge-magenta">
<div id="auth-message"></div>

View File

@ -10,7 +10,7 @@
</div>{% endif %}
<div class="auth-status relative">
<button type="button" onclick="this.nextElementSibling.classList.toggle('hidden')" class="flex items-center gap-2 rounded-md px-3 py-1.5 text-sm font-medium opacity-90 transition-colors hover:bg-primary/10 hover:opacity-100">
<span class="clip-cut flex h-7 w-7 items-center justify-center rounded-md bg-accent text-accent-foreground"><svg width="16" height="16" class="h-4 w-4" aria-hidden="true"><use href="/icons/lucide.svg#user"></use></svg></span>
<span class="clip-cut flex h-7 w-7 items-center justify-center rounded-md bg-accent text-accent-foreground"><svg class="h-4 w-4" aria-hidden="true"><use href="/icons/lucide.svg#user"></use></svg></span>
<span class="y2k-mono uppercase tracking-wide">{{ context.publicDisplayName|default:context.publicUsername }}</span>
<svg class="h-4 w-4" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M19 9l-7 7-7-7"/></svg>
</button>

View File

@ -12,10 +12,10 @@
{% if author.location %}<span>{{ author.location }}</span>{% endif %}
</div>
{% if showSocial %}<div class="mt-5 flex items-center justify-center gap-3">
{% if author.website_url %}<a href="{{ author.website_url }}" target="_blank" rel="noopener noreferrer" class="text-muted-foreground transition-colors hover:text-primary" title="Website"><svg width="20" height="20" class="h-5 w-5" aria-hidden="true"><use href="/icons/lucide.svg#globe"></use></svg></a>{% endif %}
{% if author.twitter_handle %}<a href="https://twitter.com/{{ author.twitter_handle|cut:"@" }}" target="_blank" rel="noopener noreferrer" class="text-muted-foreground transition-colors hover:text-primary" title="Twitter"><svg width="20" height="20" class="h-5 w-5" aria-hidden="true"><use href="/icons/simple-icons.svg#x"></use></svg></a>{% endif %}
{% if author.linkedin_url %}<a href="{{ author.linkedin_url }}" target="_blank" rel="noopener noreferrer" class="text-muted-foreground transition-colors hover:text-primary" title="LinkedIn"><svg width="20" height="20" class="h-5 w-5" aria-hidden="true"><use href="/icons/simple-icons.svg#linkedin"></use></svg></a>{% endif %}
{% if author.github_url %}<a href="{{ author.github_url }}" target="_blank" rel="noopener noreferrer" class="text-muted-foreground transition-colors hover:text-primary" title="GitHub"><svg width="20" height="20" class="h-5 w-5" aria-hidden="true"><use href="/icons/simple-icons.svg#github"></use></svg></a>{% endif %}
{% if author.website_url %}<a href="{{ author.website_url }}" target="_blank" rel="noopener noreferrer" class="text-muted-foreground transition-colors hover:text-primary" title="Website"><svg class="h-5 w-5" aria-hidden="true"><use href="/icons/lucide.svg#globe"></use></svg></a>{% endif %}
{% if author.twitter_handle %}<a href="https://twitter.com/{{ author.twitter_handle|cut:"@" }}" target="_blank" rel="noopener noreferrer" class="text-muted-foreground transition-colors hover:text-primary" title="Twitter"><svg class="h-5 w-5" aria-hidden="true"><use href="/icons/simple-icons.svg#x"></use></svg></a>{% endif %}
{% if author.linkedin_url %}<a href="{{ author.linkedin_url }}" target="_blank" rel="noopener noreferrer" class="text-muted-foreground transition-colors hover:text-primary" title="LinkedIn"><svg class="h-5 w-5" aria-hidden="true"><use href="/icons/simple-icons.svg#linkedin"></use></svg></a>{% endif %}
{% if author.github_url %}<a href="{{ author.github_url }}" target="_blank" rel="noopener noreferrer" class="text-muted-foreground transition-colors hover:text-primary" title="GitHub"><svg class="h-5 w-5" aria-hidden="true"><use href="/icons/simple-icons.svg#github"></use></svg></a>{% endif %}
</div>{% endif %}
</div>
</section>

View File

@ -1,2 +1,2 @@
{# y2k card — dashed neon panel; fields layout/link/media/title/text/linkLabel #}
{% with layout=layout|default:"vertical" %}<article class="bn-card y2k-card overflow-hidden rounded-md border border-dashed border-primary/40 bg-card text-card-foreground neon-edge-magenta {% if layout == "horizontal" %}flex flex-col sm:flex-row{% endif %}{% if class %} {{ class }}{% endif %}">{% if link %}<a href="{{ link }}" class="contents">{% endif %}{% if media %}<div class="overflow-hidden bg-muted {% if layout == "horizontal" %}sm:w-2/5 sm:shrink-0{% endif %}">{% if layout == "horizontal" %}{% img media alt=title|default:"" class="h-full w-full object-cover" %}{% else %}{% img media alt=title|default:"" class="aspect-video h-full w-full object-cover" %}{% endif %}</div>{% endif %}<div class="flex flex-col gap-2 p-5 md:p-6 {% if layout == "horizontal" %}justify-center{% endif %}">{% if title %}<h3 class="text-lg font-semibold tracking-tight text-foreground y2k-display">{{ title }}</h3>{% endif %}{% if text %}<div class="text-sm leading-relaxed text-muted-foreground y2k-body">{{ text|safe }}</div>{% endif %}{% if linkLabel and link %}<span class="mt-2 inline-flex items-center gap-1 text-sm font-medium text-primary y2k-mono uppercase tracking-wide">{{ linkLabel }}<svg width="16" height="16" aria-hidden="true"><use href="/icons/lucide.svg#arrow-right"></use></svg></span>{% endif %}</div>{% if link %}</a>{% endif %}</article>{% endwith %}
{% with layout=layout|default:"vertical" %}<article class="bn-card y2k-card overflow-hidden rounded-md border border-dashed border-primary/40 bg-card text-card-foreground neon-edge-magenta {% if layout == "horizontal" %}flex flex-col sm:flex-row{% endif %}{% if class %} {{ class }}{% endif %}">{% if link %}<a href="{{ link }}" class="contents">{% endif %}{% if media %}<div class="overflow-hidden bg-muted {% if layout == "horizontal" %}sm:w-2/5 sm:shrink-0{% endif %}">{% if layout == "horizontal" %}{% img media alt=title|default:"" class="h-full w-full object-cover" %}{% else %}{% img media alt=title|default:"" class="aspect-video h-full w-full object-cover" %}{% endif %}</div>{% endif %}<div class="flex flex-col gap-2 p-5 md:p-6 {% if layout == "horizontal" %}justify-center{% endif %}">{% if title %}<h3 class="text-lg font-semibold tracking-tight text-foreground y2k-display">{{ title }}</h3>{% endif %}{% if text %}<div class="text-sm leading-relaxed text-muted-foreground y2k-body">{{ text|safe }}</div>{% endif %}{% if linkLabel and link %}<span class="mt-2 inline-flex items-center gap-1 text-sm font-medium text-primary y2k-mono uppercase tracking-wide">{{ linkLabel }}::lucide:arrow-right:sm::</span>{% endif %}</div>{% if link %}</a>{% endif %}</article>{% endwith %}

View File

@ -6,7 +6,7 @@
<div class="mt-10 grid grid-cols-1 gap-4 {% if columns == 3 %}sm:grid-cols-2 lg:grid-cols-3{% elif columns == 1 %}{% else %}sm:grid-cols-2{% endif %}">
{% for channel in channels %}
<div class="hud-frame flex items-start gap-4 rounded-md border border-primary/40 bg-card p-5 text-card-foreground neon-edge-magenta">
{% if channel.icon %}<span class="clip-cut inline-flex h-10 w-10 shrink-0 items-center justify-center rounded-md bg-primary/10 text-primary"><svg width="20" height="20" class="h-5 w-5" aria-hidden="true"><use href="/icons/{{ channel.icon|split:":"|first }}.svg#{{ channel.icon|split:":"|last }}"></use></svg></span>{% endif %}
{% if channel.icon %}<span class="clip-cut inline-flex h-10 w-10 shrink-0 items-center justify-center rounded-md bg-primary/10 text-primary"><svg class="h-5 w-5" aria-hidden="true"><use href="/icons/{{ channel.icon|split:":"|first }}.svg#{{ channel.icon|split:":"|last }}"></use></svg></span>{% endif %}
<div class="min-w-0">
{% if channel.label %}<div class="y2k-mono text-sm font-medium uppercase tracking-wide text-accent">{{ channel.label }}</div>{% endif %}
{% if channel.value %}<div class="mt-0.5 break-words font-medium">{% if channel.link %}<a href="{{ channel.link }}" class="transition-colors hover:text-primary">{{ channel.value }}</a>{% else %}{{ channel.value }}{% endif %}</div>{% endif %}

View File

@ -4,7 +4,7 @@
<div class="mx-auto max-w-2xl px-4">
{% if form.submitted %}
<div class="hud-frame rounded-md border border-primary/50 bg-card p-8 text-center text-card-foreground neon-edge-magenta">
<div class="clip-cut mx-auto mb-4 inline-flex h-12 w-12 items-center justify-center rounded-md bg-primary/10 text-primary"><svg width="24" height="24" class="h-6 w-6" aria-hidden="true"><use href="/icons/lucide.svg#check"></use></svg></div>
<div class="clip-cut mx-auto mb-4 inline-flex h-12 w-12 items-center justify-center rounded-md bg-primary/10 text-primary"><svg class="h-6 w-6" aria-hidden="true"><use href="/icons/lucide.svg#check"></use></svg></div>
<p class="y2k-display text-lg font-medium">{{ form.message|default:successMessage|default:"Thanks — your message has been sent." }}</p>
</div>
{% else %}

View File

@ -13,7 +13,7 @@
</div>
<div class="mt-8 hidden" data-countdown-expired>
<p class="y2k-display text-xl font-medium">{{ expiredMessage|default:"This has started." }}</p>
{% if expiredUrl and expiredLabel %}<a href="{{ expiredUrl }}" class="y2k-mono clip-cut rgb-split mt-4 inline-flex items-center gap-2 rounded-md bg-primary px-5 py-3 font-semibold uppercase tracking-wider text-primary-foreground transition-opacity hover:opacity-90">{{ expiredLabel }}<svg width="16" height="16" class="h-4 w-4" aria-hidden="true"><use href="/icons/lucide.svg#arrow-right"></use></svg></a>{% endif %}
{% if expiredUrl and expiredLabel %}<a href="{{ expiredUrl }}" class="y2k-mono clip-cut rgb-split mt-4 inline-flex items-center gap-2 rounded-md bg-primary px-5 py-3 font-semibold uppercase tracking-wider text-primary-foreground transition-opacity hover:opacity-90">{{ expiredLabel }}<svg class="h-4 w-4" aria-hidden="true"><use href="/icons/lucide.svg#arrow-right"></use></svg></a>{% endif %}
</div>
</div>
<noscript><p class="mt-6 text-muted-foreground">Counting down to <time datetime="{{ target }}">{{ target }}</time>.</p></noscript>

View File

@ -8,7 +8,7 @@
{% if text %}<p class="mt-3 text-lg {% if background == "band" %}text-primary-foreground/80{% else %}text-muted-foreground{% endif %}">{{ text }}</p>{% endif %}
</div>
<div class="flex flex-wrap items-center justify-center gap-3 {% if background != "split" %}mt-8{% else %}shrink-0{% endif %}">
{% if primaryUrl and primaryLabel %}<a href="{{ primaryUrl }}" class="y2k-mono clip-cut rgb-split inline-flex items-center gap-2 rounded-md px-6 py-3 font-semibold uppercase tracking-wider transition-opacity hover:opacity-90 {% if background == "band" %}bg-background text-foreground{% else %}bg-primary text-primary-foreground{% endif %}">{{ primaryLabel }}<svg width="16" height="16" class="h-4 w-4" aria-hidden="true"><use href="/icons/lucide.svg#arrow-right"></use></svg></a>{% endif %}
{% if primaryUrl and primaryLabel %}<a href="{{ primaryUrl }}" class="y2k-mono clip-cut rgb-split inline-flex items-center gap-2 rounded-md px-6 py-3 font-semibold uppercase tracking-wider transition-opacity hover:opacity-90 {% if background == "band" %}bg-background text-foreground{% else %}bg-primary text-primary-foreground{% endif %}">{{ primaryLabel }}<svg class="h-4 w-4" aria-hidden="true"><use href="/icons/lucide.svg#arrow-right"></use></svg></a>{% endif %}
{% if secondaryUrl and secondaryLabel %}<a href="{{ secondaryUrl }}" class="y2k-mono inline-flex items-center rounded-md border px-6 py-3 font-semibold uppercase tracking-wider transition-colors {% if background == "band" %}border-primary-foreground/40 text-primary-foreground hover:bg-primary-foreground/10{% else %}border-accent/60 text-accent hover:bg-accent/10{% endif %}">{{ secondaryLabel }}</a>{% endif %}
</div>
</div>

View File

@ -13,7 +13,7 @@
<h3 class="y2k-display text-lg font-semibold">{{ event.title }}</h3>
{% if event.venue %}<p class="text-sm text-muted-foreground">{{ event.venue }}</p>{% endif %}
{% if event.description %}<p class="text-sm text-muted-foreground">{{ event.description }}</p>{% endif %}
{% if event.link %}<a href="{{ event.link }}" class="y2k-mono mt-auto inline-flex items-center gap-1 pt-2 text-sm font-medium uppercase tracking-wide text-primary hover:underline">{{ event.linkLabel|default:"Details" }}<svg width="16" height="16" class="h-4 w-4" aria-hidden="true"><use href="/icons/lucide.svg#arrow-right"></use></svg></a>{% endif %}
{% if event.link %}<a href="{{ event.link }}" class="y2k-mono mt-auto inline-flex items-center gap-1 pt-2 text-sm font-medium uppercase tracking-wide text-primary hover:underline">{{ event.linkLabel|default:"Details" }}<svg class="h-4 w-4" aria-hidden="true"><use href="/icons/lucide.svg#arrow-right"></use></svg></a>{% endif %}
</div>
</article>
{% endif %}{% endfor %}

View File

@ -8,7 +8,7 @@
<details class="group py-2"{% if variant == "open-list" %} open{% endif %}>
<summary class="flex cursor-pointer list-none items-center justify-between gap-4 py-3 text-lg font-medium marker:content-none [&::-webkit-details-marker]:hidden">
<span class="y2k-display">{{ item.question }}</span>
<svg width="20" height="20" class="h-5 w-5 shrink-0 text-primary transition-transform duration-200 group-open:rotate-180" aria-hidden="true"><use href="/icons/lucide.svg#chevron-down"></use></svg>
<svg class="h-5 w-5 shrink-0 text-primary transition-transform duration-200 group-open:rotate-180" aria-hidden="true"><use href="/icons/lucide.svg#chevron-down"></use></svg>
</summary>
<div class="pb-4 text-muted-foreground [&_a]:text-primary [&_a]:underline">{{ item.answer|safe }}</div>
</details>

View File

@ -8,10 +8,10 @@
<div class="mt-12 grid grid-cols-1 gap-6 sm:grid-cols-2 {% if columns == 2 %}lg:grid-cols-2{% elif columns == 4 %}lg:grid-cols-4{% else %}lg:grid-cols-3{% endif %}">
{% for item in items %}
<div class="{% if layout == "card" %}hud-frame rounded-md border border-primary/40 bg-card p-6 text-card-foreground neon-edge-magenta transition-transform hover:-translate-y-0.5{% elif layout == "centered" %}text-center{% endif %}">
{% if item.icon %}<div class="clip-cut mb-4 inline-flex h-11 w-11 items-center justify-center rounded-md bg-primary/10 text-primary{% if layout == "centered" %} mx-auto{% endif %}"><svg width="24" height="24" class="h-6 w-6" aria-hidden="true"><use href="/icons/{{ item.icon|split:":"|first }}.svg#{{ item.icon|split:":"|last }}"></use></svg></div>{% endif %}
{% if item.icon %}<div class="clip-cut mb-4 inline-flex h-11 w-11 items-center justify-center rounded-md bg-primary/10 text-primary{% if layout == "centered" %} mx-auto{% endif %}"><svg class="h-6 w-6" aria-hidden="true"><use href="/icons/{{ item.icon|split:":"|first }}.svg#{{ item.icon|split:":"|last }}"></use></svg></div>{% endif %}
<h3 class="y2k-display text-lg font-semibold">{% if item.linkUrl %}<a href="{{ item.linkUrl }}" class="transition-colors hover:text-primary">{{ item.title }}</a>{% else %}{{ item.title }}{% endif %}</h3>
{% if item.text %}<p class="mt-2 text-muted-foreground">{{ item.text }}</p>{% endif %}
{% if item.linkUrl and item.linkLabel %}<a href="{{ item.linkUrl }}" class="y2k-mono uppercase tracking-wide mt-3 inline-flex items-center gap-1 text-sm font-medium text-primary hover:underline">{{ item.linkLabel }}<svg width="16" height="16" class="h-4 w-4" aria-hidden="true"><use href="/icons/lucide.svg#arrow-right"></use></svg></a>{% endif %}
{% if item.linkUrl and item.linkLabel %}<a href="{{ item.linkUrl }}" class="y2k-mono uppercase tracking-wide mt-3 inline-flex items-center gap-1 text-sm font-medium text-primary hover:underline">{{ item.linkLabel }}<svg class="h-4 w-4" aria-hidden="true"><use href="/icons/lucide.svg#arrow-right"></use></svg></a>{% endif %}
</div>
{% endfor %}
</div>

View File

@ -1,8 +1,8 @@
{# hero y2k override (GO-BIG showpiece): canvas liquid-chrome metaballs behind a beveled chrome headline over a sparkle glitter field. All builtin field reads + macro + branch structure preserved from the frozen hero default. The metaball canvas shows when there is no backgroundImage; it lazy-inits on view, honors prefers-reduced-motion, degrades to a static chrome-mesh gradient with JS off, and is dependency-free (hero/landing only per motion tier). #}
{% set eyebrowText = eyebrow|get:"text"|default:eyebrow %}
{% set headlineText = headline|get:"text"|default:headline %}
{% set subText = subheadline|get:"text"|default:subheadline %}
{% set descText = description|get:"text"|default:description %}
{% set eyebrowText = eyebrow.text|default:eyebrow %}
{% set headlineText = headline.text|default:headline %}
{% set subText = subheadline.text|default:subheadline %}
{% set descText = description.text|default:description %}
{% set pText = ctaPrimary.text %}
{% set pUrl = ctaPrimary.url %}
{% set sText = ctaSecondary.text %}
@ -35,7 +35,6 @@
<section class="hero relative flex flex-col overflow-hidden bg-background text-foreground {% if minHeight == "screen" %}min-h-screen{% elif minHeight == "50vh" %}min-h-[50vh]{% elif minHeight == "auto" %}min-h-[400px]{% else %}min-h-[75vh]{% endif %} {% if verticalAlign == "top" %}justify-start pt-20{% elif verticalAlign == "bottom" %}justify-end pb-20{% else %}justify-center{% endif %}{% if class %} {{ class }}{% endif %}">
{% if hasImage %}<div class="absolute inset-0 z-0">{% img backgroundImage alt=headlineText class="h-full w-full object-cover" layout="hero" %}{% if showOverlay %}<div class="absolute inset-0 {% if overlayColor == "light" %}bg-background/60{% elif overlayColor == "primary" %}bg-primary/50{% elif overlayOpacity <= 30 %}bg-black/30{% elif overlayOpacity <= 50 %}bg-black/50{% elif overlayOpacity <= 70 %}bg-black/70{% else %}bg-black/80{% endif %}"></div>{% endif %}</div>{% else %}<div class="y2k-orb-wrap z-0"><div class="y2k-orb-fallback"></div><canvas class="y2k-orb-canvas" aria-hidden="true"></canvas></div>{% endif %}
<div aria-hidden="true" class="scanlines pointer-events-none absolute inset-0 z-0"></div>
<div aria-hidden="true" class="y2k-hero-scrim pointer-events-none absolute inset-0"></div>
<div class="relative z-10 mx-auto w-full max-w-4xl px-4 sm:px-6 lg:px-8 {% if variant == "left-aligned" %}text-left{% else %}text-center{% endif %}">{{ herocontent(align) }}</div>
</section>
{% endif %}

View File

@ -19,11 +19,11 @@
{% if specialHoursNote %}<p class="mt-4 rounded-md border border-primary/40 bg-muted px-3 py-2 text-sm text-muted-foreground">{{ specialHoursNote }}</p>{% endif %}
{% if address %}<div class="mt-6"><div class="y2k-mono text-sm font-medium uppercase tracking-wide text-accent">Address</div><address class="mt-1 whitespace-pre-line not-italic">{{ address }}</address></div>{% endif %}
{% if phone %}<div class="mt-4"><div class="y2k-mono text-sm font-medium uppercase tracking-wide text-accent">Phone</div><a href="tel:{{ phone }}" class="y2k-mono mt-1 inline-block font-medium transition-colors hover:text-primary">{{ phone }}</a></div>{% endif %}
{% if directionsUrl %}<a href="{{ directionsUrl }}" target="_blank" rel="noopener noreferrer" class="y2k-mono clip-cut mt-6 inline-flex items-center gap-2 rounded-md bg-primary px-4 py-2 text-sm font-medium uppercase tracking-wide text-primary-foreground transition-colors hover:bg-primary/90"><svg width="16" height="16" class="h-4 w-4" aria-hidden="true"><use href="/icons/lucide.svg#navigation"></use></svg>Get directions</a>{% endif %}
{% if directionsUrl %}<a href="{{ directionsUrl }}" target="_blank" rel="noopener noreferrer" class="y2k-mono clip-cut mt-6 inline-flex items-center gap-2 rounded-md bg-primary px-4 py-2 text-sm font-medium uppercase tracking-wide text-primary-foreground transition-colors hover:bg-primary/90"><svg class="h-4 w-4" aria-hidden="true"><use href="/icons/lucide.svg#navigation"></use></svg>Get directions</a>{% endif %}
</div>
{% if mapEmbedUrl %}
<div class="hud-frame aspect-square w-full overflow-hidden rounded-md border border-primary/40 bg-muted neon-edge-cyan md:aspect-auto">
<button type="button" data-map-src="{{ mapEmbedUrl }}" onclick="var f=document.createElement('iframe');f.src=this.getAttribute('data-map-src');f.setAttribute('class','h-full w-full border-0');f.setAttribute('loading','lazy');f.setAttribute('referrerpolicy','no-referrer-when-downgrade');f.setAttribute('title','Map');this.parentNode.replaceChild(f,this);" class="y2k-mono flex h-full min-h-[16rem] w-full items-center justify-center gap-2 text-sm font-medium uppercase tracking-wide transition-colors hover:bg-accent/20 hover:text-foreground"><svg width="20" height="20" class="h-5 w-5" aria-hidden="true"><use href="/icons/lucide.svg#map-pin"></use></svg>{{ mapButtonLabel|default:"Load map" }}</button>
<button type="button" data-map-src="{{ mapEmbedUrl }}" onclick="var f=document.createElement('iframe');f.src=this.getAttribute('data-map-src');f.setAttribute('class','h-full w-full border-0');f.setAttribute('loading','lazy');f.setAttribute('referrerpolicy','no-referrer-when-downgrade');f.setAttribute('title','Map');this.parentNode.replaceChild(f,this);" class="y2k-mono flex h-full min-h-[16rem] w-full items-center justify-center gap-2 text-sm font-medium uppercase tracking-wide transition-colors hover:bg-accent/20 hover:text-foreground"><svg class="h-5 w-5" aria-hidden="true"><use href="/icons/lucide.svg#map-pin"></use></svg>{{ mapButtonLabel|default:"Load map" }}</button>
</div>
{% endif %}
</div>

View File

@ -7,7 +7,7 @@
<p class="mt-4 text-lg text-muted-foreground">{{ emptyMessage|default:"That route returned nothing. The page moved, shipped, or never existed." }}</p>
{% if context.path %}<p class="y2k-mono mt-3 text-sm text-muted-foreground">requested: <span class="text-primary">{{ context.path }}</span></p>{% endif %}
<div class="mt-8 flex flex-wrap items-center justify-center gap-3">
<a href="/" class="y2k-mono clip-cut rgb-split inline-flex items-center gap-2 rounded-md bg-primary px-6 py-3 font-semibold uppercase tracking-wider text-primary-foreground transition-opacity hover:opacity-90"><svg width="16" height="16" class="h-4 w-4" aria-hidden="true"><use href="/icons/lucide.svg#arrow-right"></use></svg>Back to home</a>
<a href="/" class="y2k-mono clip-cut rgb-split inline-flex items-center gap-2 rounded-md bg-primary px-6 py-3 font-semibold uppercase tracking-wider text-primary-foreground transition-opacity hover:opacity-90"><svg class="h-4 w-4" aria-hidden="true"><use href="/icons/lucide.svg#arrow-right"></use></svg>Back to home</a>
</div>
</div>
</section>

View File

@ -15,7 +15,7 @@
</p>
{% if tier.description %}<p class="mt-3 text-sm text-muted-foreground">{{ tier.description }}</p>{% endif %}
{% if tier.features %}<ul class="mt-6 flex-1 space-y-3 text-sm">
{% for feature in tier.features %}<li class="flex items-start gap-2"><svg width="16" height="16" class="mt-0.5 h-4 w-4 shrink-0 text-primary" aria-hidden="true"><use href="/icons/lucide.svg#check"></use></svg><span>{{ feature }}</span></li>{% endfor %}
{% for feature in tier.features %}<li class="flex items-start gap-2"><svg class="mt-0.5 h-4 w-4 shrink-0 text-primary" aria-hidden="true"><use href="/icons/lucide.svg#check"></use></svg><span>{{ feature }}</span></li>{% endfor %}
</ul>{% endif %}
{% if tier.ctaUrl and tier.ctaLabel %}<a href="{{ tier.ctaUrl }}" class="y2k-mono uppercase tracking-wider clip-cut mt-8 inline-flex w-full items-center justify-center rounded-none px-5 py-3 font-semibold transition-opacity hover:opacity-90 {% if tier.highlighted %}rgb-split bg-primary text-primary-foreground{% else %}border border-primary/40 bg-background text-foreground hover:bg-muted{% endif %}">{{ tier.ctaLabel }}</a>{% endif %}
</div>

View File

@ -5,7 +5,7 @@
{% if eyebrow %}<p class="y2k-mono text-xs font-semibold uppercase tracking-widest text-accent">{{ eyebrow }}</p>{% endif %}
{% if heading %}<h2 class="y2k-display glitch mt-2 text-3xl font-semibold tracking-tight md:text-4xl" data-text="{{ heading }}">{{ heading }}</h2>{% endif %}
{% if body %}<div class="mt-4 space-y-4 text-lg text-muted-foreground [&_a]:text-primary [&_a]:underline [&_strong]:text-foreground">{{ body|safe }}</div>{% endif %}
{% if ctaUrl and ctaLabel %}<a href="{{ ctaUrl }}" class="y2k-mono uppercase tracking-wider clip-cut rgb-split mt-6 inline-flex items-center gap-2 rounded-none bg-primary px-5 py-3 font-semibold text-primary-foreground transition-opacity hover:opacity-90">{{ ctaLabel }}<svg width="16" height="16" class="h-4 w-4" aria-hidden="true"><use href="/icons/lucide.svg#arrow-right"></use></svg></a>{% endif %}
{% if ctaUrl and ctaLabel %}<a href="{{ ctaUrl }}" class="y2k-mono uppercase tracking-wider clip-cut rgb-split mt-6 inline-flex items-center gap-2 rounded-none bg-primary px-5 py-3 font-semibold text-primary-foreground transition-opacity hover:opacity-90">{{ ctaLabel }}<svg class="h-4 w-4" aria-hidden="true"><use href="/icons/lucide.svg#arrow-right"></use></svg></a>{% endif %}
</div>
<div class="{% if mediaPosition == "left" %}md:order-1{% else %}md:order-2{% endif %}">
{% if media %}<div class="hud-frame overflow-hidden rounded-md border border-dashed border-primary/50 neon-edge-cyan">{% img media alt=mediaAlt class="w-full h-auto object-cover" %}</div>{% endif %}

View File

@ -6,7 +6,7 @@
{% if title %}<h3 class="y2k-eyebrow y2k-mono {% if compact %}px-2 mb-3 text-xs uppercase tracking-widest text-accent{% else %}px-3 mb-4 text-sm uppercase tracking-widest text-accent{% endif %} font-semibold">{{ title }}</h3>{% endif %}
<ul class="{% if compact %}space-y-0.5{% else %}space-y-1{% endif %}">
{% for item in menu.items %}
<li><a href="{{ item.url|default:'#' }}"{% if item.open_in_new_tab %} target="_blank" rel="noopener"{% endif %}{% if item.title %} title="{{ item.title }}"{% endif %} data-bn-sidebar-link class="flex items-center rounded-md y2k-mono text-sm uppercase tracking-wide text-muted-foreground transition-colors hover:text-primary hover:bg-accent {% if compact %}px-2 py-1.5{% else %}px-3 py-2{% endif %} {{ item.css_class }}">{% if item.icon %}<svg width="16" height="16" class="mr-2 h-4 w-4" aria-hidden="true"><use href="/icons/{{ item.icon|split:":"|first }}.svg#{{ item.icon|split:":"|last }}"></use></svg>{% endif %}{{ item.label }}</a></li>
<li><a href="{{ item.url|default:'#' }}"{% if item.open_in_new_tab %} target="_blank" rel="noopener"{% endif %}{% if item.title %} title="{{ item.title }}"{% endif %} data-bn-sidebar-link class="flex items-center rounded-md y2k-mono text-sm uppercase tracking-wide text-muted-foreground transition-colors hover:text-primary hover:bg-accent {% if compact %}px-2 py-1.5{% else %}px-3 py-2{% endif %} {{ item.css_class }}">{% if item.icon %}<svg class="mr-2 h-4 w-4" aria-hidden="true"><use href="/icons/{{ item.icon|split:":"|first }}.svg#{{ item.icon|split:":"|last }}"></use></svg>{% endif %}{{ item.label }}</a></li>
{% endfor %}
</ul>
</nav>

View File

@ -5,7 +5,7 @@
{% for link in links %}{% if link.url %}
<li>
<a href="{{ link.url }}" target="_blank" rel="noopener noreferrer" aria-label="{{ link.label|default:link.network }}" class="inline-flex items-center gap-2 rounded-none border border-primary/40 text-foreground transition-colors hover:bg-accent hover:text-accent-foreground {% if style == "stack" %}w-full px-4 py-2{% else %}p-2.5{% endif %}">
{% if link.network %}<svg width="20" height="20" class="h-5 w-5" aria-hidden="true"><use href="/icons/{{ link.network|split:":"|first }}.svg#{{ link.network|split:":"|last }}"></use></svg>{% endif %}
{% if link.network %}<svg class="h-5 w-5" aria-hidden="true"><use href="/icons/{{ link.network|split:":"|first }}.svg#{{ link.network|split:":"|last }}"></use></svg>{% endif %}
{% if style == "stack" and link.label %}<span class="text-sm font-medium y2k-mono">{{ link.label }}</span>{% endif %}
</a>
</li>

View File

@ -12,7 +12,7 @@
{% if member.role %}<p class="y2k-mono uppercase tracking-wide text-sm font-medium text-primary">{{ member.role }}</p>{% endif %}
{% if member.bio %}<p class="mt-2 text-sm text-muted-foreground">{{ member.bio }}</p>{% endif %}
{% if member.socials %}<div class="mt-3 flex gap-3 {% if layout != "list" %}justify-center{% endif %}">
{% for social in member.socials %}{% if social.url %}<a href="{{ social.url }}" class="text-muted-foreground transition-colors hover:text-primary" aria-label="Social link"><svg width="20" height="20" class="h-5 w-5" aria-hidden="true"><use href="/icons/{{ social.icon|split:":"|first }}.svg#{{ social.icon|split:":"|last }}"></use></svg></a>{% endif %}{% endfor %}
{% for social in member.socials %}{% if social.url %}<a href="{{ social.url }}" class="text-muted-foreground transition-colors hover:text-primary" aria-label="Social link"><svg class="h-5 w-5" aria-hidden="true"><use href="/icons/{{ social.icon|split:":"|first }}.svg#{{ social.icon|split:":"|last }}"></use></svg></a>{% endif %}{% endfor %}
</div>{% endif %}
</div>
</div>

View File

@ -6,11 +6,11 @@
{% for q in quotes %}
<figure class="hud-frame flex flex-col rounded-md border border-dashed border-primary/50 bg-card p-6 text-card-foreground neon-edge-cyan{% if layout == "carousel" %} min-w-[18rem] max-w-sm shrink-0 snap-start{% endif %}">
{% if q.rating %}<div class="mb-3 flex gap-0.5" aria-label="Rated {{ q.rating }} out of 5">
<svg width="16" height="16" class="h-4 w-4 {% if q.rating >= 1 %}text-primary{% else %}text-muted-foreground/30{% endif %}" aria-hidden="true"><use href="/icons/lucide.svg#star"></use></svg>
<svg width="16" height="16" class="h-4 w-4 {% if q.rating >= 2 %}text-primary{% else %}text-muted-foreground/30{% endif %}" aria-hidden="true"><use href="/icons/lucide.svg#star"></use></svg>
<svg width="16" height="16" class="h-4 w-4 {% if q.rating >= 3 %}text-primary{% else %}text-muted-foreground/30{% endif %}" aria-hidden="true"><use href="/icons/lucide.svg#star"></use></svg>
<svg width="16" height="16" class="h-4 w-4 {% if q.rating >= 4 %}text-primary{% else %}text-muted-foreground/30{% endif %}" aria-hidden="true"><use href="/icons/lucide.svg#star"></use></svg>
<svg width="16" height="16" class="h-4 w-4 {% if q.rating >= 5 %}text-primary{% else %}text-muted-foreground/30{% endif %}" aria-hidden="true"><use href="/icons/lucide.svg#star"></use></svg>
<svg class="h-4 w-4 {% if q.rating >= 1 %}text-primary{% else %}text-muted-foreground/30{% endif %}" aria-hidden="true"><use href="/icons/lucide.svg#star"></use></svg>
<svg class="h-4 w-4 {% if q.rating >= 2 %}text-primary{% else %}text-muted-foreground/30{% endif %}" aria-hidden="true"><use href="/icons/lucide.svg#star"></use></svg>
<svg class="h-4 w-4 {% if q.rating >= 3 %}text-primary{% else %}text-muted-foreground/30{% endif %}" aria-hidden="true"><use href="/icons/lucide.svg#star"></use></svg>
<svg class="h-4 w-4 {% if q.rating >= 4 %}text-primary{% else %}text-muted-foreground/30{% endif %}" aria-hidden="true"><use href="/icons/lucide.svg#star"></use></svg>
<svg class="h-4 w-4 {% if q.rating >= 5 %}text-primary{% else %}text-muted-foreground/30{% endif %}" aria-hidden="true"><use href="/icons/lucide.svg#star"></use></svg>
</div>{% endif %}
<blockquote class="flex-1 text-lg leading-relaxed">{% if q.quote %}&ldquo;{{ q.quote }}&rdquo;{% endif %}</blockquote>
<figcaption class="mt-5 flex items-center gap-3">

View File

@ -7,7 +7,7 @@
{% for step in steps %}
<li class="{% if orientation == "horizontal" %}text-center{% else %}relative pl-14{% endif %}">
<span class="clip-cut flex h-8 w-8 items-center justify-center rounded-md bg-primary text-sm font-semibold text-primary-foreground y2k-mono {% if orientation == "horizontal" %}mx-auto{% else %}absolute left-0 top-0 ring-4 ring-background{% endif %}">
{% if marker == "numbered" %}{{ forloop.counter }}{% elif marker == "dot" %}<span class="h-2 w-2 rounded-full bg-primary-foreground"></span>{% else %}<svg width="16" height="16" class="h-4 w-4" aria-hidden="true"><use href="/icons/lucide.svg#flag"></use></svg>{% endif %}
{% if marker == "numbered" %}{{ forloop.counter }}{% elif marker == "dot" %}<span class="h-2 w-2 rounded-full bg-primary-foreground"></span>{% else %}<svg class="h-4 w-4" aria-hidden="true"><use href="/icons/lucide.svg#flag"></use></svg>{% endif %}
</span>
<div class="{% if orientation == "horizontal" %}mt-4{% else %}pt-1{% endif %}">
{% if step.label %}<p class="y2k-mono text-xs font-semibold uppercase tracking-widest text-accent">{{ step.label }}</p>{% endif %}

View File

@ -1,7 +1,7 @@
{# utility_bar (WO-TF-006): thin top contact strip; left/right item lists {icon,label,link}; icons render through the sprite pipeline via the ::pack:name:: shorthand. Y2K override: mono terminal readout, neon underline. #}
{% set ubcls = "bg-muted text-muted-foreground border-b border-primary/30" %}
{% if variant == "primary" %}{% set ubcls = "bg-primary text-primary-foreground" %}{% elif variant == "dark" %}{% set ubcls = "bg-foreground text-background" %}{% endif %}
{% macro ubitem(it) %}{% if it.link %}<a href="{{ it.link }}" class="inline-flex items-center gap-1.5 hover:opacity-80 transition-opacity">{% if it.icon %}<svg width="16" height="16" aria-hidden="true"><use href="/icons/{{ it.icon|split:":"|first }}.svg#{{ it.icon|split:":"|last }}"></use></svg>{% endif %}{% if it.label %}<span>{{ it.label }}</span>{% endif %}</a>{% else %}<span class="inline-flex items-center gap-1.5">{% if it.icon %}<svg width="16" height="16" aria-hidden="true"><use href="/icons/{{ it.icon|split:":"|first }}.svg#{{ it.icon|split:":"|last }}"></use></svg>{% endif %}{% if it.label %}<span>{{ it.label }}</span>{% endif %}</span>{% endif %}{% endmacro %}
{% macro ubitem(it) %}{% if it.link %}<a href="{{ it.link }}" class="inline-flex items-center gap-1.5 hover:opacity-80 transition-opacity">{% if it.icon %}::{{ it.icon }}::{% endif %}{% if it.label %}<span>{{ it.label }}</span>{% endif %}</a>{% else %}<span class="inline-flex items-center gap-1.5">{% if it.icon %}::{{ it.icon }}::{% endif %}{% if it.label %}<span>{{ it.label }}</span>{% endif %}</span>{% endif %}{% endmacro %}
<div class="y2k-mono uppercase tracking-wide w-full text-xs {% if not showOnMobile %}hidden sm:block{% endif %} {{ ubcls }} {{ class }}">
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 h-9 flex items-center justify-between gap-4">
<div class="flex items-center gap-4 flex-wrap">{% for it in leftItems %}{{ ubitem(it) }}{% endfor %}</div>

View File

@ -1,5 +1,5 @@
{# video-embed y2k override: neon HUD frame, clip-cut play button. Facade script + data-bn-* attributes + {% img %} preserved byte-for-byte. #}
{% with aspect=aspect|default:"16:9" %}<figure class="bn-video my-6{% if class %} {{ class }}{% endif %}"><div class="bn-video-frame hud-frame relative w-full overflow-hidden rounded-md border border-primary/40 bg-muted neon-edge-magenta {% if aspect == "4:3" %}aspect-[4/3]{% elif aspect == "1:1" %}aspect-square{% elif aspect == "21:9" %}aspect-[21/9]{% else %}aspect-video{% endif %}" data-bn-video data-video-url="{{ url|default:"" }}" data-video-media="{% if media %}{{ media|mediaURL }}{% endif %}"><button type="button" data-bn-video-play class="group absolute inset-0 flex h-full w-full items-center justify-center focus:outline-none focus-visible:ring-2 focus-visible:ring-inset focus-visible:ring-ring" aria-label="Play video{% if title %}: {{ title }}{% endif %}">{% if poster %}{% img poster alt=title|default:"" class="absolute inset-0 h-full w-full object-cover" %}{% endif %}<span class="absolute inset-0 bg-primary/10 transition-colors group-hover:bg-primary/20" aria-hidden="true"></span><span class="clip-cut relative inline-flex h-16 w-16 items-center justify-center rounded-md border border-primary/60 bg-background/90 text-primary shadow-lg transition-transform group-hover:scale-105 motion-reduce:transform-none"><svg width="32" height="32" aria-hidden="true"><use href="/icons/lucide.svg#play"></use></svg></span></button></div>{% if caption %}<figcaption class="y2k-mono mt-2 text-center text-sm text-muted-foreground">{{ caption }}</figcaption>{% endif %}</figure><script>
{% with aspect=aspect|default:"16:9" %}<figure class="bn-video my-6{% if class %} {{ class }}{% endif %}"><div class="bn-video-frame hud-frame relative w-full overflow-hidden rounded-md border border-primary/40 bg-muted neon-edge-magenta {% if aspect == "4:3" %}aspect-[4/3]{% elif aspect == "1:1" %}aspect-square{% elif aspect == "21:9" %}aspect-[21/9]{% else %}aspect-video{% endif %}" data-bn-video data-video-url="{{ url|default:"" }}" data-video-media="{% if media %}{{ media|mediaURL }}{% endif %}"><button type="button" data-bn-video-play class="group absolute inset-0 flex h-full w-full items-center justify-center focus:outline-none focus-visible:ring-2 focus-visible:ring-inset focus-visible:ring-ring" aria-label="Play video{% if title %}: {{ title }}{% endif %}">{% if poster %}{% img poster alt=title|default:"" class="absolute inset-0 h-full w-full object-cover" %}{% endif %}<span class="absolute inset-0 bg-primary/10 transition-colors group-hover:bg-primary/20" aria-hidden="true"></span><span class="clip-cut relative inline-flex h-16 w-16 items-center justify-center rounded-md border border-primary/60 bg-background/90 text-primary shadow-lg transition-transform group-hover:scale-105 motion-reduce:transform-none">::lucide:play:xl::</span></button></div>{% if caption %}<figcaption class="y2k-mono mt-2 text-center text-sm text-muted-foreground">{{ caption }}</figcaption>{% endif %}</figure><script>
(function(){
if(window.__bnVideoFacade)return;window.__bnVideoFacade=true;
function yt(u){var m=u.match(/(?:youtube\.com\/(?:watch\?v=|embed\/|shorts\/)|youtu\.be\/)([\w-]{6,})/);return m?m[1]:null;}