Bootstrapped during the 2026-06-06 BlockNinja consolidation. Was previously an unversioned directory inside ~/src/blockninja-themes/scifi-clean. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
47 lines
1.4 KiB
Plaintext
47 lines
1.4 KiB
Plaintext
package main
|
|
|
|
// statusBarComponent renders the sticky top status rail.
|
|
// UAT §13.9 requires position: sticky and top: 0.
|
|
templ statusBarComponent(data StatusBarData) {
|
|
<div
|
|
data-block="scifi-clean:status_bar"
|
|
class="w-full hairline-b bg-card text-card-foreground scifi-mono text-xs uppercase tracking-widest"
|
|
style="position: sticky; top: 0; z-index: 30;"
|
|
>
|
|
<div class="max-w-6xl mx-auto px-4 py-2 flex items-center justify-between gap-4">
|
|
<div class="flex items-center gap-3">
|
|
<span class="text-muted-foreground">{ data.Callsign }</span>
|
|
<span class="text-muted-foreground">|</span>
|
|
<span class="text-foreground">PUBLIC</span>
|
|
</div>
|
|
<div class="flex items-center gap-3 tabular-nums">
|
|
if data.ShowClock {
|
|
<span
|
|
data-status-bar-clock="utc"
|
|
class="text-muted-foreground tabular-nums"
|
|
>
|
|
{ "00:00:00 UTC" }
|
|
</span>
|
|
}
|
|
if data.ShowBuild {
|
|
<span class="text-muted-foreground">|</span>
|
|
<span class="text-foreground tabular-nums">BLD a1b2c3</span>
|
|
}
|
|
</div>
|
|
</div>
|
|
<script>
|
|
(function(){
|
|
var el = document.querySelector('[data-status-bar-clock="utc"]');
|
|
if (!el) return;
|
|
function fmt(n){ return n < 10 ? '0' + n : String(n); }
|
|
function tick(){
|
|
var d = new Date();
|
|
el.textContent = fmt(d.getUTCHours()) + ':' + fmt(d.getUTCMinutes()) + ':' + fmt(d.getUTCSeconds()) + ' UTC';
|
|
}
|
|
tick();
|
|
setInterval(tick, 1000);
|
|
})();
|
|
</script>
|
|
</div>
|
|
}
|