2026-05-08 23:39:58 -05:00
|
|
|
---
|
2026-05-09 11:33:06 -05:00
|
|
|
import '../ui/crt.css'
|
2026-05-10 07:00:22 -05:00
|
|
|
import gearIcon from '../assets/noun-gear-8323296.svg?url'
|
2026-05-08 23:39:58 -05:00
|
|
|
---
|
|
|
|
|
|
|
|
|
|
<html lang="en">
|
|
|
|
|
<head>
|
|
|
|
|
<meta charset="utf-8" />
|
|
|
|
|
<meta name="viewport" content="width=device-width, initial-scale=1, viewport-fit=cover" />
|
|
|
|
|
<title>Halfstreet — Ethan J Lewis</title>
|
|
|
|
|
<meta name="description" content="A gothic mystery." />
|
|
|
|
|
<meta name="robots" content="noindex" />
|
2026-05-10 07:00:22 -05:00
|
|
|
<link rel="icon" href="/favicon.ico" sizes="any" />
|
|
|
|
|
<link rel="icon" href="/favicon.svg" type="image/svg+xml" />
|
|
|
|
|
<link rel="icon" href="/favicon-96x96.png" type="image/png" sizes="96x96" />
|
|
|
|
|
<link rel="apple-touch-icon" href="/apple-touch-icon.png" />
|
|
|
|
|
<link rel="manifest" href="/site.webmanifest" />
|
|
|
|
|
<meta name="theme-color" content="#1a0d00" />
|
2026-05-08 23:39:58 -05:00
|
|
|
</head>
|
|
|
|
|
<body>
|
|
|
|
|
<div class="mystery-root" data-mystery-root>
|
|
|
|
|
<div class="mystery-bezel">
|
2026-05-10 07:00:22 -05:00
|
|
|
<div class="mystery-options" data-mystery-options>
|
|
|
|
|
<button
|
|
|
|
|
type="button"
|
|
|
|
|
class="mystery-options-toggle"
|
|
|
|
|
data-options-toggle
|
|
|
|
|
aria-label="Options"
|
|
|
|
|
aria-expanded="false"
|
|
|
|
|
style={`--gear-icon: url(${gearIcon})`}
|
|
|
|
|
>
|
|
|
|
|
<span class="mystery-options-icon" aria-hidden="true"></span>
|
|
|
|
|
</button>
|
|
|
|
|
<div class="mystery-options-menu" data-options-menu hidden>
|
|
|
|
|
<div class="mystery-options-group" aria-label="Screen">
|
|
|
|
|
<div class="mystery-options-label">Screen</div>
|
|
|
|
|
<button type="button" data-theme-choice="amber" aria-pressed="true">Amber</button>
|
|
|
|
|
<button type="button" data-theme-choice="ansi" aria-pressed="false">ANSI</button>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="mystery-options-group" aria-label="Cursor">
|
|
|
|
|
<div class="mystery-options-label">Cursor</div>
|
|
|
|
|
<button type="button" data-cursor-choice="bar" aria-pressed="true">Bar</button>
|
|
|
|
|
<button type="button" data-cursor-choice="block" aria-pressed="false">Block</button>
|
|
|
|
|
<button type="button" data-cursor-choice="underscore" aria-pressed="false">Underline</button>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="mystery-options-group" aria-label="Game">
|
|
|
|
|
<div class="mystery-options-label">Game</div>
|
|
|
|
|
<button type="button" data-restart-choice>Restart</button>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
2026-05-08 23:39:58 -05:00
|
|
|
</div>
|
|
|
|
|
<div class="mystery-transcript" data-mystery-transcript aria-live="polite" aria-atomic="false"></div>
|
|
|
|
|
<div class="mystery-chips" data-mystery-chips></div>
|
|
|
|
|
<div class="mystery-input-row">
|
|
|
|
|
<input
|
|
|
|
|
class="mystery-input"
|
|
|
|
|
data-mystery-input
|
|
|
|
|
type="text"
|
|
|
|
|
autocomplete="off"
|
|
|
|
|
autocorrect="off"
|
|
|
|
|
autocapitalize="none"
|
|
|
|
|
spellcheck="false"
|
|
|
|
|
aria-label="Command input"
|
|
|
|
|
/>
|
2026-05-10 07:00:22 -05:00
|
|
|
<span class="mystery-input-display" data-mystery-input-display aria-hidden="true"></span>
|
2026-05-08 23:39:58 -05:00
|
|
|
</div>
|
|
|
|
|
</div>
|
2026-05-09 21:51:12 -05:00
|
|
|
<footer class="mystery-footer">
|
2026-05-10 07:00:22 -05:00
|
|
|
© 2026 <a href="https://ethanjlewis.com">Ethan J Lewis</a>
|
2026-05-09 21:51:12 -05:00
|
|
|
<span aria-hidden="true">|</span>
|
2026-05-10 07:00:22 -05:00
|
|
|
<a href="https://half.st/ejlewis/halfstreet/src/branch/main/LICENSE">GNU 3.0</a>
|
2026-05-09 21:51:12 -05:00
|
|
|
<span aria-hidden="true">|</span>
|
2026-05-10 07:00:22 -05:00
|
|
|
<a href="https://half.st/ejlewis/halfstreet">Source Code</a>
|
2026-05-09 21:51:12 -05:00
|
|
|
</footer>
|
2026-05-08 23:39:58 -05:00
|
|
|
</div>
|
|
|
|
|
<script>
|
|
|
|
|
// Theme attribute is set on :root before any rendering to avoid a flash
|
|
|
|
|
// of the wrong palette. The full theme toggle wiring lands in Task 11.
|
|
|
|
|
const stored = (() => {
|
|
|
|
|
try { return localStorage.getItem('halfstreet:theme:v1') } catch { return null }
|
|
|
|
|
})()
|
2026-05-10 07:00:22 -05:00
|
|
|
const storedCursor = (() => {
|
|
|
|
|
try { return localStorage.getItem('halfstreet:cursor:v1') } catch { return null }
|
|
|
|
|
})()
|
2026-05-08 23:39:58 -05:00
|
|
|
document.documentElement.setAttribute('data-mystery-theme', stored === 'ansi' ? 'ansi' : 'amber')
|
2026-05-10 07:00:22 -05:00
|
|
|
document.documentElement.setAttribute(
|
|
|
|
|
'data-mystery-cursor',
|
|
|
|
|
storedCursor === 'block' || storedCursor === 'underscore' ? storedCursor : 'bar',
|
|
|
|
|
)
|
2026-05-08 23:39:58 -05:00
|
|
|
</script>
|
|
|
|
|
<script>
|
2026-05-09 11:33:06 -05:00
|
|
|
import '../ui/terminal.ts'
|
|
|
|
|
import '../ui/theme.ts'
|
2026-05-08 23:39:58 -05:00
|
|
|
</script>
|
|
|
|
|
</body>
|
|
|
|
|
</html>
|
