Center picker menu icons on their label line#626
Merged
Conversation
Menu item labels are text-xs (16px line-height) but the leading icons carried a 2px top margin copied from a larger layout, sitting them 1-2px below the text centerline; the checkout path hint in the machine menu had the same stray margin. Fix the offsets in EnvironmentMenuItem, OptionPicker items, and BranchPickerUnavailableRow (including the coarse-pointer sizes), and add a machine-grouped EnvironmentPicker story. Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
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
Icons in the environment/branch/option picker dropdown menus sat 1–2px below the text centerline, and the checkout-path hint in the multi-machine menu sat 2px below the label baseline.
Menu item labels render at
text-xs(16px line-height; 20px on coarse pointers), but the leading icons carried a blanketmt-0.5copied between components regardless of icon size:EnvironmentPicker(EnvironmentMenuItem): 14px icon on a 16px line needsmt-px, notmt-0.5; on coarse pointers icon and line are both 20px, so no offset. Also removed the straymt-0.5on the path hint.OptionPicker: 16px icon on a 16px line needs no offset (keptmt-0.5only under coarse pointers, where the line grows to 20px but the icon stays 16px).BranchPicker(BranchPickerUnavailableRow): same fix as EnvironmentMenuItem.Also adds a
MachineMenustory for the machine-grouped environment menu, which previously had no story.Testing
pnpm exec turbo run typecheck --filter=@bb/apppasses.pickers--environment-picker--machine-menuand--overview): icons center on their label line and the path hint shares the label baseline.🤖 Generated with Claude Code