Skip to content

Simplify nav hovers #15855

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

Draft
wants to merge 4 commits into
base: main
Choose a base branch
from
Draft

Conversation

janbrasna
Copy link
Contributor

@janbrasna janbrasna commented Jan 13, 2025

👷 Running into some WebKit bug ignoring thickness on direct flex element. (May need a tweak in actual markup, or just living with it…)

One-line summary

Simplifying hover underlines on main menu, dropdowns and footer links: Moving from borders or fills on pseudo elements to native text decoration for better resilience.

Significant changes and points to review

Accomplishing the same effect while being less fragile.
(Real typographic underline makes descenders more legible by avoiding them instead of crossing.)
Changing to relative distance to adapt better to type scaling.

🚧 WIP
(Status: MVP-level, missing some QA and tree shaking, cleanup and tracking down more leftovers no longer needed. TBD next steps about WebKit if no solution deems practical.)

Issue / Bugzilla link

Fixes #15850

Testing

Ready to test, nb: difference in thickness in main nav between Gecko/Blink vs. WebKit…

Copy link

codecov bot commented Jan 13, 2025

Codecov Report

All modified and coverable lines are covered by tests ✅

Project coverage is 79.55%. Comparing base (9db97b8) to head (f847aee).
Report is 145 commits behind head on main.

Additional details and impacted files
@@            Coverage Diff             @@
##             main   #15855      +/-   ##
==========================================
+ Coverage   79.22%   79.55%   +0.33%     
==========================================
  Files         159      160       +1     
  Lines        8287     8436     +149     
==========================================
+ Hits         6565     6711     +146     
- Misses       1722     1725       +3     

☔ View full report in Codecov by Sentry.
📢 Have feedback on the report? Share it here.

🚀 New features to boost your workflow:
  • ❄️ Test Analytics: Detect flaky tests, report on failures, and find test suite problems.
  • 📦 JS Bundle Analysis: Save yourself from yourself by tracking and limiting bundle sizes in JS merges.

@maureenlholland maureenlholland added the Frontend HTML, CSS, JS... client side stuff label Mar 19, 2025
@janbrasna janbrasna force-pushed the fix/hover-underline branch from d7ba03b to eb19c44 Compare March 27, 2025 14:04
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Frontend HTML, CSS, JS... client side stuff
Projects
None yet
Development

Successfully merging this pull request may close these issues.

Footer & nav hover decoration underlines only on last line
2 participants