Move Ate down to the dialog row
Pee and Poo take a row of their own and Ate joins Weigh-in and Note across the bottom, which regroups the panel by what a tap does rather than by what the event means: the bottom row is now exactly the three buttons that open a dialog to type a value, and the row above it exactly the two that log on one tap. Ate was the odd one out under the old split — it sat with the pees and poos but behaved like a weigh-in. That hands the longest label in the app, "⚖️ Weigh-in", a third-width button. The narrow-phone padding trim already in place was written for "🍽️ Ate" in that slot and now serves Weigh-in instead; on a mid-size phone the label is close enough to the edge that it may wrap to two lines, which costs a little row height and nothing else. Shortening it to "Weight" is the fix if it does. The changelog entry describing the rows is corrected in place rather than answered with a second entry. The update banner diffs by entry text, so an edited entry is already surfaced as new to anyone coming from the previous build — and one accurate description of the layout beats two entries whose combined reading is only correct if you apply them in order.
This commit is contained in:
+1
-1
@@ -1,7 +1,7 @@
|
|||||||
[
|
[
|
||||||
{ "date": "2026-08-31", "text": "A sleep or walk pair is now tied together in the History log by a dotted rail down the side, in that pair's colour, running from the start row to the end row. Anything logged in between sits inside the bracket, so a pee taken on a walk reads as having happened during it. A pair still in progress, or one that ran over from yesterday, leaves its end of the rail open" },
|
{ "date": "2026-08-31", "text": "A sleep or walk pair is now tied together in the History log by a dotted rail down the side, in that pair's colour, running from the start row to the end row. Anything logged in between sits inside the bracket, so a pee taken on a walk reads as having happened during it. A pair still in progress, or one that ran over from yesterday, leaves its end of the rail open" },
|
||||||
{ "date": "2026-08-31", "text": "Added walks: tap 🦮 Walk start when you head out and 🏁 Walk end when you get home, and the time in between is counted as exercise. The pair gets its own row under the sleep buttons. Today's total and the number of walks show in the overview, every walk of the day is listed in a new Walks section (with the age-based rule of thumb of about five minutes per month of age, twice a day), and the daily charts gain a “Walks (minutes)” bar chart once you have logged one. Like sleep, only the boundary that makes sense is tappable — no walk running means Walk end is greyed out" },
|
{ "date": "2026-08-31", "text": "Added walks: tap 🦮 Walk start when you head out and 🏁 Walk end when you get home, and the time in between is counted as exercise. The pair gets its own row under the sleep buttons. Today's total and the number of walks show in the overview, every walk of the day is listed in a new Walks section (with the age-based rule of thumb of about five minutes per month of age, twice a day), and the daily charts gain a “Walks (minutes)” bar chart once you have logged one. Like sleep, only the boundary that makes sense is tappable — no walk running means Walk end is greyed out" },
|
||||||
{ "date": "2026-08-31", "text": "The Log event buttons are grouped into rows now instead of flowing into one grid: 😴 Sleep start and ⏰ Sleep end side by side on their own row, then 🍽️ Ate / 💧 Pee / 💩 Poo three across, then ⚖️ Weigh-in and 📝 Note. The two halves of a sleep pair can no longer end up split across a wrap, and no button is left stranded alone on the last row" },
|
{ "date": "2026-08-31", "text": "The Log event buttons are grouped into rows now instead of flowing into one grid: 😴 Sleep start and ⏰ Sleep end side by side on their own row, then 💧 Pee and 💩 Poo, and last the three that ask for a value — 🍽️ Ate / ⚖️ Weigh-in / 📝 Note — three across. The two halves of a sleep pair can no longer end up split across a wrap, and no button is left stranded alone on the last row" },
|
||||||
{ "date": "2026-08-24", "text": "The timing charts now show the longest gap as well: each bar keeps its solid stretch from the shortest to the typical gap and fades on out to the longest one of the week. To stop the nightly long gap from squashing the daytime range into a sliver, the bars are stretched so the typical gap always sits dead centre — left of the middle is sooner than usual, right of it is longer, in every row" },
|
{ "date": "2026-08-24", "text": "The timing charts now show the longest gap as well: each bar keeps its solid stretch from the shortest to the typical gap and fades on out to the longest one of the week. To stop the nightly long gap from squashing the daytime range into a sliver, the bars are stretched so the typical gap always sits dead centre — left of the middle is sooner than usual, right of it is longer, in every row" },
|
||||||
{ "date": "2026-08-24", "text": "Each row of the timing panel is now a small chart instead of a number: the band spans the shortest to the typical gap over the last 7 days, and the marker is how long it has been since the last one. Inside the band means there is time yet, off the right-hand end means the puppy is due — and a row with only one event so far says so instead of drawing an empty axis" },
|
{ "date": "2026-08-24", "text": "Each row of the timing panel is now a small chart instead of a number: the band spans the shortest to the typical gap over the last 7 days, and the marker is how long it has been since the last one. Inside the band means there is time yet, off the right-hand end means the puppy is due — and a row with only one event so far says so instead of drawing an empty axis" },
|
||||||
{ "date": "2026-08-24", "text": "The timing panel now covers meals too — typical and shortest time between them, alongside the pee and poo gaps — so you can see the feeding rhythm the same way. It is titled just “Timing” now that it is no longer only about bathroom breaks" },
|
{ "date": "2026-08-24", "text": "The timing panel now covers meals too — typical and shortest time between them, alongside the pee and poo gaps — so you can see the feeding rhythm the same way. It is titled just “Timing” now that it is no longer only about bathroom breaks" },
|
||||||
|
|||||||
+8
-9
@@ -108,12 +108,11 @@
|
|||||||
|
|
||||||
<section class="quick-actions">
|
<section class="quick-actions">
|
||||||
<h2>Log event</h2>
|
<h2>Log event</h2>
|
||||||
<!-- Explicit rows, grouped by what the buttons mean, rather than one
|
<!-- Explicit rows rather than one auto-fit grid: a start/end pair has
|
||||||
auto-fit grid: a start/end pair has to stay side by side at every
|
to stay side by side at every width (a flat grid split them apart
|
||||||
width (a flat grid split them apart at some column counts, and
|
at some column counts, and orphaned the last button on a row of
|
||||||
orphaned the last button on a row of its own). A row per timed
|
its own). A row per timed pair, then the two one-tap moments, and
|
||||||
pair, then the one-tap moments, then the two that open a dialog
|
last the three that open a dialog to type a value. -->
|
||||||
to type a value. -->
|
|
||||||
<div class="actions">
|
<div class="actions">
|
||||||
<div class="action-row">
|
<div class="action-row">
|
||||||
<button class="action sleep" data-type="sleep-start">😴 Sleep start</button>
|
<button class="action sleep" data-type="sleep-start">😴 Sleep start</button>
|
||||||
@@ -123,12 +122,12 @@
|
|||||||
<button class="action walk" data-type="walk-start">🦮 Walk start</button>
|
<button class="action walk" data-type="walk-start">🦮 Walk start</button>
|
||||||
<button class="action walk" data-type="walk-end">🏁 Walk end</button>
|
<button class="action walk" data-type="walk-end">🏁 Walk end</button>
|
||||||
</div>
|
</div>
|
||||||
<div class="action-row three-up">
|
<div class="action-row">
|
||||||
<button class="action eat" data-type="eat">🍽️ Ate</button>
|
|
||||||
<button class="action pee" data-type="pee">💧 Pee</button>
|
<button class="action pee" data-type="pee">💧 Pee</button>
|
||||||
<button class="action poo" data-type="poo">💩 Poo</button>
|
<button class="action poo" data-type="poo">💩 Poo</button>
|
||||||
</div>
|
</div>
|
||||||
<div class="action-row">
|
<div class="action-row three-up">
|
||||||
|
<button class="action eat" data-type="eat">🍽️ Ate</button>
|
||||||
<button class="action weight" data-type="weight">⚖️ Weigh-in</button>
|
<button class="action weight" data-type="weight">⚖️ Weigh-in</button>
|
||||||
<button class="action note" data-type="note">📝 Note</button>
|
<button class="action note" data-type="note">📝 Note</button>
|
||||||
</div>
|
</div>
|
||||||
|
|||||||
+3
-2
@@ -184,8 +184,9 @@ body::before {
|
|||||||
}
|
}
|
||||||
/* Keep the single row intact on narrow phones. */
|
/* Keep the single row intact on narrow phones. */
|
||||||
@media (max-width: 370px) {
|
@media (max-width: 370px) {
|
||||||
/* Three columns leave ~55px of text room on the narrowest phones; trimming
|
/* Three columns leave ~55px of text room on the narrowest phones, and
|
||||||
the side padding keeps "🍽️ Ate" on one line instead of wrapping. */
|
"⚖️ Weigh-in" is the longest label in the app; trimming the side padding
|
||||||
|
buys it back a little room before it has to wrap to two lines. */
|
||||||
.action-row.three-up button { padding-left: 6px; padding-right: 6px; }
|
.action-row.three-up button { padding-left: 6px; padding-right: 6px; }
|
||||||
.day-bar { gap: 4px; }
|
.day-bar { gap: 4px; }
|
||||||
.day-bar button:not(.bar-clock) { padding: 8px 7px; }
|
.day-bar button:not(.bar-clock) { padding: 8px 7px; }
|
||||||
|
|||||||
Reference in New Issue
Block a user