Work / Aakalan / Wiki / Concepts
design-set-rules
Conceptverified 2026-10-30
design-set-rules
The wireframes are the spec: when a screen and a wireframe disagree, the wireframe wins.
Open designs/mobile/index.html from disk. canon check (pnpm check:designs) is the
gate and CI runs it.
- There is no
homegroup. The first screen after entry is the Balances tab, and the product names it Balances everywhere. - Two tabs and the centre Add.
Balances((tabs)/index) is one list sorted by size behind a People/Groups segmented control.Spending((tabs)/spending) has the summary as header and the month's rows as body. Account is pushed off the header avatar. paymentsandnumbersare one section onaccount.tsx. The route isperson/[id], notfriend/[id]: the People cut is the only place the product names them, and it does not say "friend".- A route holding one control is the wrong shape.
payment-details,appearanceandcurrencyare cards onaccount.tsx, not routes. A row whose subtitle must summarise the screen it hides means delete the screen. - Do not bring back (reasoning on each screen's page): the pending-settlement banner
(an "Unconfirmed" flag on the row), the group Type picker (
categoryForNamederives it), a duplicate Simplify toggle (one persisted group setting), the "Half" settle amount, and horizontal chip scrollers (onePickerRow+WithSheet). - Every word a dialog shows is drawn on
designs/mobile/components/alert.html. Adding anAlert.alertmeans adding its copy there in the same change; the copy check fails otherwise. - One token differs on purpose: the second brand colour is
saffroninsrc/global.cssandaccentintokens.js, same values. See tokens. - The wireframes draw the same eight-colour wheel
src/lib/avatar-color.tshashes into, in its order. See reserved-money-direction.