47776c0b6f
- hero: read styled-text fields as `field|get:"text"|default:field` so the home hero renders (bare-string seed values were hard-erroring the block to empty output — the "weird af header" root cause; page jumped navbar→audio). - light-mode: add a background-token radial scrim behind the hero headline (lightens the centre in light, darkens in dark) for legible text over the mesh. - seed media: ship 6 licensed stock images; wire 4 as Records cover art (chrome-liquid-metal/holographic-foil/abstract-neon/cassette) + the waveform now-playing cover (neon-rave) + a chrome image on About. - waveform: replace the "No audio source set yet." placeholder with a deliberate "SIDE A // live to tape" mono transport readout. - fonts: @font-face Orbitron/Inter/Share Tech Mono from /templates/y2k/fonts/* + typography refs in all presets (bundled fonts were inert dead code). - article: expand tracking-to-tape to 10 band-journal paragraphs (kills the ~350px blog dead space). - SVG geometry guard: explicit width/height on every sprite <use> icon + replace ::icon:: shortcodes with sized <svg> (Tailwind JIT balloon guard). - capture Wave B screenshots (home/about/article × light+dark, 2880×1800); preview.png = dark home (dark-canonical theme). Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
24 lines
3.2 KiB
Plaintext
24 lines
3.2 KiB
Plaintext
{# 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>
|
|
(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;}
|
|
function vim(u){var m=u.match(/vimeo\.com\/(?:video\/)?(\d+)/);return m?m[1]:null;}
|
|
document.addEventListener('click',function(e){
|
|
var btn=e.target.closest('[data-bn-video-play]');if(!btn)return;
|
|
var frame=btn.closest('[data-bn-video]');if(!frame)return;
|
|
e.preventDefault();
|
|
var url=frame.getAttribute('data-video-url')||'',media=frame.getAttribute('data-video-media')||'',node;
|
|
var vstyle='position:absolute;inset:0;width:100%;height:100%;object-fit:contain;background:rgba(0,0,0,1);';
|
|
if(media){node=document.createElement('video');node.src=media;node.controls=true;node.autoplay=true;node.setAttribute('playsinline','');node.style.cssText=vstyle;}
|
|
else{var y=yt(url),v=vim(url),embed;
|
|
if(y)embed='https://www.youtube-nocookie.com/embed/'+y+'?autoplay=1&rel=0';
|
|
else if(v)embed='https://player.vimeo.com/video/'+v+'?autoplay=1';
|
|
if(embed){node=document.createElement('iframe');node.src=embed;node.allow='autoplay; fullscreen; picture-in-picture';node.setAttribute('allowfullscreen','');node.setAttribute('title',btn.getAttribute('aria-label')||'Video');node.style.cssText='position:absolute;inset:0;width:100%;height:100%;border:0;';}
|
|
else if(url){node=document.createElement('video');node.src=url;node.controls=true;node.autoplay=true;node.setAttribute('playsinline','');node.style.cssText=vstyle;}
|
|
}
|
|
if(node){btn.remove();frame.appendChild(node);}
|
|
});
|
|
})();
|
|
</script>{% endwith %}
|