Show a timer in the day bar while a walk is on

The bar already carries the asleep/awake counter; a walk in progress had
nothing, so "how long have we been out" meant going to the Walks panel to look.
It gets a second pill now, counting from the walk's start, and tapping it ends
the walk — the same bargain the sleep pill offers for the sleep boundary.

Two timers no longer fit beside the day controls on a narrow phone, so the bar
wraps. That needed the children grouping first: with seven loose ones the break
could land anywhere, and stranding "Today" alone on a second line is worse than
not wrapping at all. The timers are one group and the day controls another, so
the wrap falls between them.

Two things follow from the bar changing height. The tab bar sticks to that
height, and the ResizeObserver added when the pill first appearing had the same
effect already covers it — nothing new needed. And both pills go to standby
together while the big card is on screen: standby is visibility, not display,
so the bar keeps its wrapped height while you scroll and the tab bar beneath it
does not shuffle.

The card shows the walk while there is one. It has room for a single timer, and
you are necessarily awake on a walk, so "awake for 3h" is the less useful of the
two readings; the bar keeps both. That also meant moving the card out of the
early return for "no sleep logged yet" — a walk can be the first thing ever
recorded, and the card was staying blank through it.
This commit is contained in:
Alexander Heldt
2026-09-08 20:46:04 +00:00
parent 7c0ccca1b2
commit fba0f73717
5 changed files with 155 additions and 36 deletions
+10
View File
@@ -51,6 +51,16 @@ notes) — so each screen holds one subject instead of all fourteen panels in on
column. The day bar and the log buttons sit above the tabs and stay put on all
of them, because logging has to be one tap from wherever you are.
- The day bar carries up to two timers, each of which logs the boundary that
ends what it is counting when tapped: the asleep/awake one, and — only while
a walk is running — the walk. Two of them no longer fit beside the day
controls on a narrow phone, so the bar wraps; the timers and the controls are
each a group, so it wraps between them rather than stranding "Today" on a
line of its own. The bar's height changes when it does and the tab bar sticks
to that height, which is why `--day-bar-h` is kept current by a
`ResizeObserver` rather than measured once. The big card on Today shows
whichever of the two is the more immediate — the walk, when there is one,
since you are necessarily awake on a walk.
- Each tab is a `.tab-panel` wrapper around the existing sections. The
**wrapper** is what gets hidden, never the sections: `walk-timeline` and
`walk-trend` carry their own `hidden`, set by `renderWalkPatterns` once a walk