Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

portico: Correct help navigation outlines. #30118

Open
wants to merge 2 commits into
base: main
Choose a base branch
from

Conversation

karlstolley
Copy link
Contributor

This PR corrects an ugly focus ring in the help navbars. It consolidates the CSS to make it applicable to all sidebar navigation items (not just those in list items), and uses :focus-visible to make a more consistent and accessible presentation of focused elements--including the currently-highlighted element.

It also now makes navbar-item highlighting uniform across Firefox and Chrome.

Note that this is a good opportunity for a design pass on the highlighted and focus styles, which may well be overwrought.

Fixes: #28745.

Screenshots and screen captures:

Chrome, Before Chrome, After
Screenshot 2024-05-16 at 4 35 17 PM Screenshot 2024-05-16 at 4 36 27 PM
Screenshot 2024-05-16 at 4 41 12 PM Screenshot 2024-05-16 at 4 33 34 PM
Firefox, Before Firefox, After
Screenshot 2024-05-16 at 4 36 07 PM Screenshot 2024-05-16 at 4 36 27 PM
Screenshot 2024-05-16 at 4 34 53 PM Screenshot 2024-05-16 at 4 34 33 PM

@karlstolley karlstolley added area: portico QA needed Manual testing requested. labels May 16, 2024
@zulipbot
Copy link
Member

zulipbot commented May 16, 2024

Hello @zulip/design, @zulip/server-misc, @zulip/server-user-docs members, this pull request was labeled with the "design", "area: documentation (user)", "area: portico" labels, so you may want to check it out!

@karlstolley
Copy link
Contributor Author

@alya just pointing this PR out, since Lauryn & I accidentally overlapped on this work and I put in some fixes that weren't part of the original PR that I've since closed.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

Successfully merging this pull request may close these issues.

Remove blue secondary focus outline from help/api center pages
2 participants