alex/puppy-tracker
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Freeze the day picker at the top of the page

Browse Source 
The day bar moves above everything else and sticks while scrolling, so
switching days never requires scrolling back up. A fixed strip painted
over the safe-area inset keeps content from peeking through above the
stuck bar on notched phones in standalone mode.
This commit is contained in:
Alexander Heldt
2026-07-13 20:39:06 +00:00
parent a202f3e929
commit 0009e63d23
3 changed files with 28 additions and 10 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/index.html
+7 -7
View File
@@ -77,6 +77,13 @@
</header>
<main>
<section class="day-bar">
<button type="button" id="day-prev" class="ghost" aria-label="Previous day">←</button>
<input type="date" id="day-picker" />
<button type="button" id="day-today" class="ghost">Today</button>
<button type="button" id="day-next" class="ghost" aria-label="Next day">→</button>
</section>
<section id="big-clock" class="big-clock" hidden>
<div class="bc-label" id="bc-label">—</div>
<div class="bc-time" id="bc-time">0:00</div>
@@ -107,13 +114,6 @@
</div>
</section>
<section class="day-bar">
<button type="button" id="day-prev" class="ghost" aria-label="Previous day">←</button>
<input type="date" id="day-picker" />
<button type="button" id="day-today" class="ghost">Today</button>
<button type="button" id="day-next" class="ghost" aria-label="Next day">→</button>
</section>
<section class="overview" data-panel="overview">
<h2 id="overview-title">Today's overview</h2>
<div class="stats">