Support for Drupal 7 is ending on 5 January 2025—it’s time to migrate to Drupal 10! Learn about the many benefits of Drupal 10 and find migration tools in our resource center.
This is probably a regression from when we converted to CSS logical properties.
The primary menu's hover states are not correct at wide widths.
- The width of the underline is too small
- It grows from the left instead of the center.
Current state
Approved Proof of Concept mockup (https://olivero-poc.netlify.app/)
Comment | File | Size | Author |
---|---|---|---|
#10 | Screen Recording 2021-08-12 at 10.55.13 AM.mov | 3.61 MB | Gauravvvv |
#9 | 3226704-9.patch | 2.34 KB | mherchel |
#9 | interdiff-2-9.patch | 1.46 KB | mherchel |
#8 | hover-current-2-level.gif | 162.51 KB | mherchel |
#6 | hover-current.gif | 290.39 KB | mherchel |
Comments
Comment #2
mherchelComment #3
Abhijith S CreditAttribution: Abhijith S as a volunteer and at Zyxware Technologies commentedApplied patch #2 and it works fine.The width of underline on hover is increased and also the line grows from the center now. Adding screen recordings below.
Before patch:
After patch:
RTBC +1
Comment #4
IndrajithKB CreditAttribution: IndrajithKB at Srijan | A Material+ Company for Drupal India Association commentedHi @mherchel thanks for the patch, and thanks @Abhijith S for the review.
"border-top-width increased from 5px to 9px, and line grows changed from left to center" which is the expected result so am just moving the status of the issue from NR to RTBC.
Comment #5
lauriiiIt's a bit strange that the border hides most of the arrow from 2nd level menu items. Any thoughts on this?
Comment #6
mherchelThe submenu should be placed above the hover state. Is this not the case for you?
Comment #7
lauriiiThat seems to be caused by having one menu item that is wrapped on two lines. It's working as expected when there aren't menu items wrapped on multiple lines.
Comment #8
mherchel@lauriii I'm still unable to reproduce this. Does this issue happen without the patch? Animated gif attached.
Comment #9
mherchelAhh I see that happens if another menu item has two lines.
IMO I'm indifferent about this, as I don't expect to see this in the real world. That being said, it's easy enough to fix.
This patch removes the hover state underline for menu items that have children.
Comment #10
Gauravvvv CreditAttribution: Gauravvvv at OpenSense Labs for Drupal India Association commentedPatch #9, Fixes the issue. Border have been removed for the menu items having submenu's.
Added before and after patch recording.
RTBC+1
Comment #13
lauriiiCommitted fa0b720 and pushed to 9.3.x. Also cherry-picked to 9.2.x because Olivero is experimental. Thanks!