73 lines
4.0 KiB
HTML
73 lines
4.0 KiB
HTML
<!doctype html>
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="UTF-8" />
|
|
<meta name="viewport" content="width=device-width, initial-scale=1, viewport-fit=cover" />
|
|
<meta name="theme-color" content="#182127" />
|
|
<title>Aetherbound Guild - Final Landscape Prototype</title>
|
|
<link rel="icon" type="image/webp" href="favicon.webp" />
|
|
<link rel="stylesheet" href="styles.css" />
|
|
</head>
|
|
<body>
|
|
<a class="skip-link" href="#content">Skip to prototype</a>
|
|
<div class="app-shell">
|
|
<aside class="sidebar" id="sidebar" aria-label="Prototype navigation">
|
|
<div class="brand-block">
|
|
<button class="icon-button mobile-only" id="close-nav" type="button" aria-label="Close navigation">×</button>
|
|
<span class="brand-mark" aria-hidden="true">AG</span>
|
|
<div>
|
|
<strong>Aetherbound Guild</strong>
|
|
<span data-copy="brandSubtitle">Final design prototype</span>
|
|
</div>
|
|
</div>
|
|
<nav class="primary-nav" id="primary-nav">
|
|
<button class="nav-item is-active" data-view="firstplay" type="button"><span>01</span><b data-copy="navFirst">First play</b><em>23</em></button>
|
|
<button class="nav-item" data-view="screens" type="button"><span>02</span><b data-copy="navScreens">Screen atlas</b><em>50</em></button>
|
|
<button class="nav-item" data-view="regions" type="button"><span>03</span><b data-copy="navRegions">Regions</b><em>8</em></button>
|
|
<button class="nav-item" data-view="catalogs" type="button"><span>04</span><b data-copy="navCatalogs">Catalogs</b><em>574</em></button>
|
|
<button class="nav-item" data-view="reference" type="button"><span>05</span><b data-copy="navReference">Reference map</b><em>15</em></button>
|
|
<button class="nav-item" data-view="review" type="button"><span>06</span><b data-copy="navReview">Review gates</b><em>7</em></button>
|
|
</nav>
|
|
<div class="sidebar-footer">
|
|
<span class="status-dot" aria-hidden="true"></span>
|
|
<div><strong>DESIGN PROTOTYPE</strong><span data-copy="runtimeFrozen">Runtime development frozen</span></div>
|
|
</div>
|
|
</aside>
|
|
|
|
<div class="page-shell">
|
|
<header class="topbar">
|
|
<button class="icon-button mobile-only" id="open-nav" type="button" aria-label="Open navigation">☰</button>
|
|
<div class="breadcrumbs"><span>Aetherbound Guild</span><b>/</b><strong id="view-title">First play</strong></div>
|
|
<div class="top-actions">
|
|
<div class="locale-control" aria-label="Language">
|
|
<button class="is-active" type="button" data-locale="en">EN</button>
|
|
<button type="button" data-locale="zh_CN">简中</button>
|
|
</div>
|
|
<span class="evidence-badge" data-copy="conceptBadge">Concept direction</span>
|
|
<button class="icon-button" id="fullscreen-current" type="button" title="Open stage viewer" aria-label="Open stage viewer">⛶</button>
|
|
</div>
|
|
</header>
|
|
<main id="content" tabindex="-1">
|
|
<div class="loading-state" id="loading">Loading current design authority...</div>
|
|
</main>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="nav-scrim" id="nav-scrim" hidden></div>
|
|
<dialog class="stage-dialog" id="stage-dialog" aria-label="Game stage viewer">
|
|
<div class="viewer-toolbar">
|
|
<span id="viewer-label">Game stage</span>
|
|
<div>
|
|
<button class="icon-button" id="zoom-out" type="button" aria-label="Zoom out" title="Zoom out">−</button>
|
|
<button class="viewer-zoom" id="zoom-reset" type="button">100%</button>
|
|
<button class="icon-button" id="zoom-in" type="button" aria-label="Zoom in" title="Zoom in">+</button>
|
|
<button class="icon-button" id="close-dialog" type="button" aria-label="Close viewer" title="Close">×</button>
|
|
</div>
|
|
</div>
|
|
<div class="viewer-viewport"><div id="dialog-stage"></div></div>
|
|
</dialog>
|
|
<div class="sr-only" id="live-region" aria-live="polite"></div>
|
|
<script src="app.js" defer></script>
|
|
</body>
|
|
</html>
|