Skip to content

fix(shell): the tab bar meets the edge it is allowed to reach - #38

Merged
frahlg merged 1 commit into
mainfrom
the-tab-bar-meets-the-edge
Aug 10, 2026
Merged

fix(shell): the tab bar meets the edge it is allowed to reach#38
frahlg merged 1 commit into
mainfrom
the-tab-bar-meets-the-edge

Conversation

@frahlg

@frahlg frahlg commented Aug 10, 2026

Copy link
Copy Markdown
Member

Fredrik, after the measurement landed: "gör färgen samma och lägg ner knapparna så långt som möjligt så att det känns som en integrerad del."

Right, and it follows from what the probe showed. Below an installed app's web view is a strip of screen iOS paints and no CSS here can reach; it carries the app's own background. A bar in its own shade (the --surface-raised I gave it two PRs ago) therefore ends against that strip in a visible seam — which is exactly why the bottom still read as two things stacked rather than one surface.

So:

  • The bar takes the same surface as the app, with a single rule across the top to say it is a bar. It runs into the strip below instead of ending at it.
  • Where html.reserved-by-the-os applies — an installed iOS app, where the system already cleared the indicator — the labels go all the way down: padding-bottom: 0, nothing between them and the edge of what we may paint. Everywhere else keeps its clearance, because there the inset is the only thing holding the bar off the indicator.

tests/shell-contract.test.ts updated to pin the new intent (bar shares the shell surface, keeps a visible top edge, labels on the edge where the system cleared it) — the old assertion pinned the raised surface, which was the seam.

npm run verify: 815 passed.

🤖 Generated with Claude Code

Below an installed app's web view is a strip of screen iOS paints and no
CSS here can reach. It carries the app's own background, so a bar in its
own shade ends against it in a visible seam — which is what a raised bar
looked like, and why the bottom still read as two things rather than one.

The bar takes the same surface as the app now, with a single rule across
the top to say it is a bar, so it runs into that strip instead of ending
at it. And where the system has already cleared the indicator, the labels
go all the way down: nothing between them and the edge of what we are
allowed to paint.

Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
@frahlg
frahlg merged commit a013a84 into main Aug 10, 2026
@frahlg
frahlg deleted the the-tab-bar-meets-the-edge branch August 10, 2026 14:50
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant