Repository navigation
🤖 fix: show the branch in the phone footer again - #6900
Merged
Merged
Conversation
The compact phone footer (#6895) left room after the repo label, so the branch selector is back at 768 px or narrower. On phones the owner/repo link no longer shrinks (capped like the project label), so the branch truncates first and a short repo name stays whole.
A shrink-0 repo link could push a devcontainer row past the screen. The branch now has no flex basis on phones, so it takes only the room the other items leave and the repo link keeps shrinking as before, capped like the project label.
Codex Review SummaryThis comment shows the latest Codex review activity on this pull request.
ℹ️ About Codex in GitHubYour team has set up Codex to review pull requests in this repo. Reviews are triggered when you
Codex reacts with 👀 while any review is running, comments if it has suggestions, and reacts with 👍 once all reviews finish with no findings. |
![chatgpt-codex-connector[bot]](https://avatars.githubusercontent.com/in/1144995?s=60&v=4){kind=small}
There was a problem hiding this comment.
💡 Codex Review
Here are some automated review suggestions for this pull request.
Reviewed commit: e3ead5e9ce
ℹ️ About Codex in GitHub
Your team has set up Codex to review pull requests in this repo. Reviews are triggered when you
- Open a pull request for review
- Mark a draft as ready
- Comment "@codex review".
If Codex has suggestions, it will comment; otherwise it will react with 👍.
Codex can also answer questions or update the PR. Try commenting "@codex address that feedback".
On coarse-pointer phones globals.css gives every footer button a 44 px minimum, but the phone branch slot (basis-0, min-w-0, overflow-hidden) could shrink below it, so a full row showed 18 of the branch button's 44 px and none of the copy button's. The branch slot now keeps a touch-target minimum width, so a full row truncates the repo label, and phones drop the footer copy button (the details popover still copies the branch). The copy button moves into its own component so the BranchSelector hotspot does not grow. Adds the FooterTouchTargets story with a test-runner check that emulates touch at 320 px and fails on any footer control that is smaller than a touch target or clipped.
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.
Summary
The phone footer (viewport 768 px or narrower) shows the branch selector again, after the repository label. #6895 had moved the branch into the Workspace details (ⓘ) popover, but the compact footer turned out to have room for it.
Implementation
BranchSelectortakesshowCopyButton. Its copy button moved into a small component of its own, so the selector's complexity does not grow.Validation
The new
FooterTouchTargetsstory has a Storybook test-runner check that emulates touch at 320 px, so globals.css applies its touch-target floor. The check fails if a footer button or link is smaller than a touch target or is clipped. On the first version of this PR it failed withbugbash-playground-with-a-long-name shows 18 of 44px; Copy branch name shows 0 of 44px.Measured with touch emulation and
+635 -67 *in the diff chip (a mouse pointer gives the same widths):coder/xuma-long-organization-name/a-long-repository-namea-long-organization-name/a-long-repository-nameThe row fits in each case. With the devcontainer chip's markup added to the row,
coder/xumtruncates to 74 px at 390 px so the branch keeps 44 px. At 1280 px the footer is the same as on main.Risks
Low, phone layout only. A full row (for example a devcontainer chip next to a long repository name) truncates the repo label to keep the branch tappable. On a 320 px screen with a devcontainer chip the row is about 40 px too wide and scrolls sideways, as the footer row already can. Copying the branch on a phone now goes through the ⓘ popover.