Settings scope bar: company name, no greyed tabs, compact chips
Part 1 of Gera's 2026-10-03 notes on the Company | Property bar
3 Oct 2026 · branch fix/settings-scope-switch-p1 · captured against propflow-stage · at b14f985ac46+local
Data note. Every name and balance below comes from propflow-stage, which is anonymized by construction (ADR-0097/0110 — phones in the impossible +1000 NPA, emails @example.test). The identical capture against prod would carry real tenants' names and balances and is not safe to attach anywhere, which is why the generator refuses to run against one.
1 · Before: Leasing, Company only (main)
Today's bar on a topic page with no building picked.
Asserted in the captured DOM — Leasing
Sections 2–12 and notes
2 · After: Leasing, Company only
The Company tab now says the company's name. The divider is plainly visible.
What to look at
The divider uses the faint text colour (there is no strong border token). It is still one hairline, just readable now. With no building picked, the Property tab still opens the list, so nothing is selected for you.
Asserted in the captured DOM — Leasing
3 · Before: Billing, greyed Property tab (main)
Today: a greyed, disabled Property tab on a page with no Property side.
Asserted in the captured DOM — Billing
4 · After: Billing, Company alone
The greyed Property tab is gone. The bar shows only the company.
Asserted in the captured DOM — Billing
5 · Before: Leasing with a building picked (main)
Today: the building's full name in the 20px tab face, a chevron, an ×, then a whole "| Property ▾" text tab to add another.
Asserted in the captured DOM — Leasing
6 · After: Leasing with a building picked
The building is a compact chip with an ×, followed by a small round +.
What to look at
The chip is a soft pill in the body text size, and the sliding underline still marks the focused tab. The + opens the same property list and offers only buildings not already on the page. The text dropdown on the right is gone, so the row stays as roomy as the company-only state.
Asserted in the captured DOM — Leasing
7 · Before: phone, Leasing with a building (main)
Phone width, today.
Asserted in the captured DOM — Leasing
8 · After: phone, Leasing with a building
Phone width: the chips fit, and if the strip overflows its scrollbar is the thin themed one.
Asserted in the captured DOM — Leasing
9 · Before: dark, Leasing with a building (main)
Dark theme, today: the divider almost disappears.
Asserted in the captured DOM — Leasing
10 · After: dark, Leasing with a building
Dark theme: the divider and the chip outline are both readable.
Asserted in the captured DOM — Leasing
11 · After: dark, phone
Dark at phone width.
Asserted in the captured DOM — Leasing
12 · After: the × takes the building off (light again)
Back to light. Clicking the chip's × returns the bar to the company-only state, and no other building is picked for you.
Asserted in the captured DOM — Leasing
Critique against brand-and-design.md
Notes
Phosphor icons only (Plus, X). No new colours: the chip uses --color-border and --color-bg-subtle, and the divider uses --color-text-faint. No badge-style fill: the chip is outlined, and only the focused building gets a subtle surface. Every state keeps one tab list on screen.