godseed / web /book.html
AndresCarreon's picture
GODSEED v0
0594db3 verified
Raw
History Blame Contribute Delete
2.15 kB
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1, viewport-fit=cover" />
<title>Genesis Log — GODSEED</title>
<meta name="description" content="Every wish the god has granted, replayable from the beginning of the world." />
<link rel="preconnect" href="https://fonts.googleapis.com" />
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
<link href="https://fonts.googleapis.com/css2?family=Cormorant+Garamond:ital,wght@0,400;0,500;0,600;1,400;1,500&family=Inter:wght@300;400;500&family=JetBrains+Mono:ital,wght@0,400;1,400&display=swap" rel="stylesheet" />
<link rel="stylesheet" href="./style.css" />
<script type="importmap">
{
"imports": {
"three": "./lib/three.module.js",
"three/addons/": "./lib/addons/"
}
}
</script>
</head>
<body>
<canvas id="scene" aria-label="Replay of the world being made"></canvas>
<div class="vignette" aria-hidden="true"></div>
<div class="grain" aria-hidden="true"></div>
<header class="book-brand">
<a class="book-brand__mark" href="./index.html">GODSEED</a>
<h1 class="book-brand__title">GENESIS LOG</h1>
<p class="book-brand__sub">every wish, replayable from the first word</p>
</header>
<div class="replay-hint" id="replayHint">select a wish to watch it granted again</div>
<nav class="ledger" id="ledger" aria-label="granted wishes"></nav>
<aside class="voice book-voice" id="voice" aria-live="polite">
<div class="voice__head">
<span class="voice__wish" id="voiceWish"></span>
<span class="voice__label">the god spoke</span>
<span class="voice__dot" id="voiceDot"></span>
</div>
<div class="voice__stream" id="voiceStream"></div>
</aside>
<div class="epitaph" id="epitaph" aria-live="polite">
<div class="epitaph__rule"></div>
<div class="epitaph__text" id="epitaphText"></div>
<div class="epitaph__label" id="epitaphLabel">the wish was granted</div>
</div>
<div class="status" id="status" role="status"></div>
<script type="module" src="./book.js"></script>
</body>
</html>