vanilla-framework icon indicating copy to clipboard operation
vanilla-framework copied to clipboard
verified publisher icon canonical

Bolded headings width mismatches with side navigation

Open britneywwc opened this issue 1 year ago • 1 comments

Describe the bug

  • When p-side-navigation__heading--linked is hovered over, it doesn't cover the full width

To Reproduce

Steps to reproduce the behavior:

  1. Go to https://vanillaframework.io/docs/examples/patterns/side-navigation/accordion
  2. Make sure that the accordion is in full width view (not in toggle side navigation view)
  3. Hover over Troubleshoot
  4. Notice the bug

Expected behavior

It should cover the full width of the link, similar to the other links.

Screenshots Bug: Screenshot 2024-02-09 at 3 50 26 PM

Expected: Screenshot 2024-02-09 at 3 50 30 PM

Desktop (please complete the following information):

  • OS: macOS Sonoma 14.2
  • Browser: Chrome
  • Version: 121.0.6167.139

britneywwc avatar Feb 09 '24 07:02 britneywwc

It seems to be caused by max-width on headings.

Likely adding max-width: none; on p-side-navigation__heading--linked would fix the issue.

bartaz avatar Feb 27 '24 12:02 bartaz