The new reader app replaces the old UI: Checklist with a rail (focus pills, Next to expire, today's dailies, pinned routines), Timeline in a new and a classic look, Routines, Archive and a Settings area, in a Structured (default) and a Relaxed interface. It follows the approved Round 6 B and Round 7 mockups, corrected screen by screen with the owner. Reader data moves to a v2 store (gacha-tracker:v2:*). Existing v1 data is migrated on first load, a recovery copy is written first, and the v1 keys are never removed, so a rollback finds them unchanged. Redeem codes for Genshin arrive as their own feed. Also: live's urgency ramp, editable per theme; completion and section-complete fireworks; a returning-user tour; the design mockups, specs, plans, reviews and handoff record. Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
9 lines
3.9 KiB
HTML
9 lines
3.9 KiB
HTML
<!doctype html>
|
|
<html lang="en"><head><meta charset="utf-8"><meta name="viewport" content="width=device-width,initial-scale=1"><title>Event Clock · Three layouts</title><link href="https://fonts.googleapis.com/css2?family=Barlow+Condensed:wght@600;700&family=Barlow:wght@400;500;600&display=swap" rel="stylesheet"><style>
|
|
:root{color-scheme:dark;--ground:#0e1117;--panel:#141923;--rule:#323b4e;--ink:#e4e7ef;--muted:#afb8c7;--accent:#8eaff6}*{box-sizing:border-box}body{margin:0;background:var(--ground);color:var(--ink);font:16px/1.65 Barlow,system-ui,sans-serif}main{max-width:1000px;margin:0 auto;padding:64px 28px}h1{font:600 44px/1.1 "Barlow Condensed",sans-serif;margin:0 0 20px}h2{font:600 28px/1.2 "Barlow Condensed",sans-serif;margin:0 0 10px}p{max-width:70ch;color:var(--muted);margin:12px 0}a{color:var(--accent);text-underline-offset:4px}:focus-visible{outline:2px solid var(--accent);outline-offset:5px}.design{display:grid;grid-template-columns:54px 1fr auto;gap:24px;align-items:start;padding:32px 0;border-top:1px solid var(--rule)}.letter{font:600 34px "Barlow Condensed",sans-serif;color:var(--muted)}.design .open{align-self:center;padding:10px 16px;border:1px solid var(--rule);text-decoration:none;white-space:nowrap}.tradeoff{font-size:14px}.designs{margin:36px 0}.notes{border-top:1px solid var(--rule);padding-top:24px;font-size:14px}.notes h2{font-size:23px}@media(max-width:650px){main{padding:36px 20px}h1{font-size:36px}.design{grid-template-columns:32px 1fr;gap:16px}.design .open{grid-column:2;justify-self:start}.design h2{font-size:26px}}
|
|
</style></head><body><main><h1>Give the events room.</h1><p>Three complete layouts for Event Clock. Each keeps the agreed routines, Archive, settings and onboarding, while moving focus and freshness controls out of the way of the event list.</p><p>Compare the same busy calendar in each. The top review bar can simulate older data, open onboarding and reset the sample state.</p><div class="designs">
|
|
<section class="design"><span class="letter">A</span><div><h2>Inline desk</h2><p>Game focus beside the list heading. A small freshness line with Details. Your one-click dailies and pinned routines stay in the familiar left rail.</p><p class="tradeoff">The smallest change to the layout you already liked; retains two columns.</p></div><a class="open" href="a-inline.html">Open A</a></section>
|
|
<section class="design"><span class="letter">B</span><div><h2>Game desk</h2><p>Game focus, daily ticks and source status share the left rail. The event heading stays clear, with more attention on the list itself.</p><p class="tradeoff">Controls have one predictable home; the rail holds more, and stacks before events on a phone.</p></div><a class="open" href="b-rail.html">Open B</a></section>
|
|
<section class="design"><span class="letter">C</span><div><h2>Open ledger</h2><p>A wide event list with a quick daily strip. Other pinned routines open above the list, with your choice of collapsed, expanded or always open.</p><p class="tradeoff">Most space for event titles; daily and routine panels scroll with the list.</p></div><a class="open" href="c-open.html">Open C</a></section>
|
|
</div><section class="notes"><h2>Shared changes to try</h2><p>Routines → Checklist display now controls the daily panel and group expansion. Numeric fields keep their native one-step arrows.</p><p>Settings includes Changelog as its own page, custom interface palettes, per-game source links and thanks, reset-time overrides with Automatic, and clearly labelled backup previews. Upcoming events is part of What do you want to track.</p><p>Returning user opens a guided tour in your preferred view. Take it or keep browsing; your progress stays intact.</p><p>This is a review prototype. Codes, source health and historical data are illustrative. The production app and earlier mockups are unchanged.</p><p><a href="../round5/converged.html">Compare with Round 5</a></p></section></main></body></html>
|