Fix the mobile controls sheet: a visible, reliable way out - #45
Merged
Conversation
On a real phone the controls sheet used `88vh`, i.e. the LARGE viewport behind Safari's toolbars, so it grew taller than the screen and its header - with the close button - slid up behind the top bar. There was no visible way back to the main view. - Cap the sheet with `100dvh` minus the top bar, so it always sits below it. - Pin the header (title + close) sticky to the top of the sheet. - Phone close is a clear X (dismiss), not the docked panel's left chevron. - Heavier scrim on a phone so the bench reads as dimmed-away, not a second UI showing through.
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.
On a real iPhone the controls sheet used
88vh(the LARGE viewport behind Safaris toolbars), so it grew taller than the screen and its header - with the close button - slid up behind the top bar: no visible way back to the main view.100dvhminus the top bar, so the sheet always sits below it.Verified on WebKit: close button in view + sticky, tapping it returns to the main view. lint 0, check 0, unit 817/817, e2e (responsive) 5/5.