126 lines
5.2 KiB
HTML
126 lines
5.2 KiB
HTML
<!doctype html>
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="utf-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1">
|
|
<title>California Legislature Dashboard — Upcoming Legislation</title>
|
|
<link rel="stylesheet" href="style.css">
|
|
<meta name="description"
|
|
content="A monitor of upcoming California Assembly & Senate daily-file
|
|
hearings. Anonymous overview; a logged-in resident pins their
|
|
legislators & topics to the top.">
|
|
</head>
|
|
<body>
|
|
<!-- sticky header: wordmark + nav + (logged-in) user band -->
|
|
<header class="topbar" id="topbar">
|
|
<a class="wordmark" href="/">CA Legislature<span>Dashboard</span></a>
|
|
<nav class="nav" aria-label="Primary">
|
|
<a href="#dashboard" id="nav-dashboard" class="active">Dashboard</a>
|
|
<a href="#legislators">Legislators</a>
|
|
<a href="#bills">Bills</a>
|
|
</nav>
|
|
<div class="user-band" id="user-band" hidden>
|
|
<span id="user-band-text">ZIP — · 0 legislators · 0 topics</span>
|
|
<a href="#prefs" id="nav-prefs">Preferences</a>
|
|
<button type="button" id="btn-signout">Sign out</button>
|
|
</div>
|
|
<div class="anon-cta" id="anon-cta">
|
|
<a href="#unlocked">Sign in</a>
|
|
<span class="cta-value">Save your interests → sign in</span>
|
|
</div>
|
|
</header>
|
|
|
|
<main id="app">
|
|
<!-- §9 status / context band -->
|
|
<section class="freshness" id="freshness" aria-live="polite">
|
|
<span id="freshness-updated">Loading…</span>
|
|
<span id="freshness-session" class="badge"></span>
|
|
<span id="freshness-chamber" class="note"></span>
|
|
<button type="button" id="btn-refresh" class="ghost">Refresh</button>
|
|
</section>
|
|
|
|
<!-- Controls bar -->
|
|
<section class="controls" id="controls">
|
|
<input type="search" id="f-search" class="search"
|
|
placeholder="Search bills… (title, author, committee)"
|
|
aria-label="Search bills">
|
|
<label>Chamber
|
|
<select id="f-chamber">
|
|
<option value="">All</option>
|
|
<option value="ASSEMBLY">Assembly</option>
|
|
<option value="SENATE">Senate</option>
|
|
</select>
|
|
</label>
|
|
<label>Date
|
|
<select id="f-date">
|
|
<option value="upcoming">Upcoming</option>
|
|
<option value="week">This week</option>
|
|
<option value="all">All</option>
|
|
</select>
|
|
</label>
|
|
<select id="f-tags" multiple size="1" aria-label="Filter by topic"
|
|
class="tags-filter"></select>
|
|
<label>Why is this here?
|
|
<input type="checkbox" id="f-reason" title="Show why each
|
|
floated bill is in your view">
|
|
</label>
|
|
</section>
|
|
|
|
<!-- Logged-in personal controls (ZIP + watch/opt-in) -->
|
|
<section class="personal-controls" id="personal-controls" hidden>
|
|
<div class="zip-lookup">
|
|
<label for="zip-input">Where do you live?</label>
|
|
<input type="text" id="zip-input" inputmode="numeric"
|
|
pattern="[0-9]{5}" placeholder="ZIP (e.g. 90210)">
|
|
<button type="button" id="btn-resolve">Find
|
|
my legislators</button>
|
|
</div>
|
|
<div id="resolve-result" class="resolve-result"></div>
|
|
<div class="watch-list" id="watch-list"></div>
|
|
<div class="topic-list" id="topic-list"></div>
|
|
</section>
|
|
|
|
<!-- Personal band: floored "Relevant to you" (top N) + setup empty state -->
|
|
<section class="band" id="personal-band" aria-label="Relevant to you">
|
|
<h2 class="band-title">Relevant to you
|
|
<span id="band-count" class="count"></span>
|
|
<button type="button" id="btn-show-all" class="ghost"
|
|
hidden>Show all N</button></h2>
|
|
<div id="band-setup" class="empty-state" hidden>
|
|
<h3>Pin your view</h3>
|
|
<p>Enter your ZIP and we'll surface your legislators and the
|
|
bills that matter to you.</p>
|
|
<input type="text" id="zip-setup" inputmode="numeric"
|
|
placeholder="ZIP code">
|
|
<button type="button" id="btn-setup">Find my legislators</button>
|
|
</div>
|
|
<div id="band-list" class="list"></div>
|
|
</section>
|
|
|
|
<!-- All upcoming legislation: the full queue, floated bills marked -->
|
|
<section class="band" id="all-band">
|
|
<h2 class="band-title">All upcoming legislation
|
|
<span id="all-count" class="count"></span></h2>
|
|
<div id="all-list" class="list"></div>
|
|
<div id="all-empty" class="empty-state" hidden></div>
|
|
</section>
|
|
|
|
<!-- aside: watchlist summary / top topics this session -->
|
|
<aside class="aside" id="aside">
|
|
<h3 id="aside-title">Top topics this session</h3>
|
|
<ul id="topics-teaser" class="teaser"></ul>
|
|
<a id="unlocked" class="unlock">Unlock your view — pin your
|
|
legislators & topics to the top →</a>
|
|
</aside>
|
|
|
|
<footer class="footer">
|
|
<span>Provenance: CA Assembly & Senate daily file ·
|
|
<a href="#about">About</a> · <a href="#help">Help</a> ·
|
|
<a href="#privacy">Privacy</a> ·
|
|
<a href="#accessibility">Accessibility</a></span>
|
|
</footer>
|
|
</main>
|
|
<script src="app.js"></script>
|
|
</body>
|
|
</html>
|