design(plan): the ingredient ticket leads the plan — left rail on a desktop, top on a phone - #303
Merged
Merged
Conversation
…right The two output cards swap columns: the ingredient ticket is now the narrow left-hand rail and the schedule takes the wide column beside it. They are placed with col-start/row-start rather than reordered, so the DOM order is unchanged — the schedule still comes first at every width, which is what the phone's schedule-before-weights rule is actually about. Reordering would have satisfied the eye at 1440 px and quietly put the weights first for anyone reading the page in sequence. The desktop layout test asserts the new side, that the ticket is the narrower of the two, and that the schedule is still the first card in the markup.
|
The ticket is the top of the plan at every width now, not only the left rail above xl. The weights are what you reach for when you get to the counter; the schedule is what you come back to between steps, and on a phone it is one screen away either way. That means source order is the order again — the col-start/row-start placement from the previous commit is gone, and with it the one thing on the plan where the eye and the reading order could disagree. The phone spec and the plan's heading outline both flip with it; the desktop spec now pins the ticket as the first card in the markup rather than the schedule.
JanWelker
changed the title
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
1 participant
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
The two output cards trade places. The ingredient ticket is now the narrow left-hand column above
xl(still sticky, so it stays with you down a two-day schedule) with the schedule in the wide column beside it, and on a phone the same two stack with the ticket first.The weights are what you reach for when you get to the counter; the schedule is what you come back to between steps, and on a phone it is one screen away either way.
Source order is the order at every width. No
order, nocol-start— nothing on the plan where the eye and the reading order can disagree, so what you see first is also what a screen reader and the tab key meet first.Tests: the phone spec and the desktop spec both flip (the desktop one now also pins that the ticket is the narrower column and the first card in the markup), and the plan's heading outline in
headings.spec.tsfollows the same order. CLAUDE.md's Plan bullet records the arrangement and the source-order rule. Version 7.0.1 → 7.0.2 (patch: visual change, no new capability, schema untouched).Checked at 1440 px and 390 px in French; 953 unit and 123 browser tests green.