fix(css): keep footer button focus ring inside dialog bounds - #22
Merged
Conversation
fix(css): keep footer button focus ring inside dialog bounds The Obsidian :focus-visible focus ring (a ~3px box-shadow rendered outside the button) on the footer CTA button was overflowing the dialog frame: the button rows place buttons flush against the right and bottom edges, and .diffzip-sync-progress-dialog additionally clips overflow via overflow-x: hidden, so the ring was either cut off or drawn outside the modal. Add 3px right/bottom padding to the button containers so the focus ring has room to render fully inside the dialog: - .diffzip-sync-footer (selective apply / restore dialogs) - .diffzip-sync-progress-buttons (sync progress dialog) No layout or visual changes beyond the focus state.
Owner
|
Thank you for the pull request! I confirmed the focus-ring behaviour in a real Obsidian instance, and I am happy to merge this. |
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
2 participants
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.
fix(css): keep footer button focus ring inside dialog bounds
The Obsidian :focus-visible focus ring (a ~3px box-shadow rendered
outside the button) on the footer CTA button was overflowing the
dialog frame: the button rows place buttons flush against the right
and bottom edges, and .diffzip-sync-progress-dialog additionally
clips overflow via overflow-x: hidden, so the ring was either cut
off or drawn outside the modal.
Add 3px right/bottom padding to the button containers so the focus
ring has room to render fully inside the dialog:
No layout or visual changes beyond the focus state.