Fixes site title UX issues #5621
Merged
Conversation
This file contains 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
|
The latest updates on your projects. Learn more about Vercel for Git ↗︎
|
delucis
reviewed
Dec 5, 2023
There was a problem hiding this comment.
Thanks @natemoo-re! This was on my list to revisit — thanks for checking it off :-D
One small suggestion to avoid the complexity of the pseudo element.
sarah11918
added
the
site improvement
delucis
approved these changes
Dec 12, 2023
There was a problem hiding this comment.
Thanks @natemoo-re! I feel like we’re maybe patching over some decisions we could improve — like relying on the space inside the Astro wordmark SVG for spacing — but happy to get this in for now.
ematipico
pushed a commit
that referenced
this pull request
Jan 26, 2024
Co-authored-by: Chris Swithinbank <swithinbank@gmail.com>
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
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.
Description (required)
Tweaks to the site title link UX to address a few usability issues
Hover Behavior
Previously, the
:hoverbehavior could lead to stuttering because the bounding boxes of theaelements were not normalized. There was also not enough padding on the inline axis of the elements.CleanShot.2023-12-05.at.09.31.37.mp4
This PR adjusts the
aelements so that the:hoverbehavior is consistent. The inline padding has been adjusted to provide a larger interaction target.CleanShot.2023-12-05.at.09.44.29.mp4
Focus (Visible) Behavior
Previously, the
:focus-visiblebehavior was unclear because of the size of theaelements.CleanShot.2023-12-05.at.10.12.41.mp4
This PR adds a pseudo-element to both
aelements when:focus-visiblematches to ensure that the focus ring remains visible.CleanShot.2023-12-05.at.10.12.59.mp4