Skip to content

Apply the second megamenu feedback round (develop) - #228

Merged
mlaetitia merged 3 commits into
developfrom
add/t51eng-2081-followup-develop
Aug 31, 2026
Merged

Apply the second megamenu feedback round (develop)#228
mlaetitia merged 3 commits into
developfrom
add/t51eng-2081-followup-develop

Conversation

@mlaetitia

@mlaetitia mlaetitia commented Aug 28, 2026

Copy link
Copy Markdown
Collaborator

Related to #

Proposed changes

  • Panel items now fill column one before column two, matching the order they are added in WP Admin. The walker emits one --megamenu-tracks custom property per panel and the stylesheet places the items.
  • Featured image is 16:9, cropped with object-fit: cover.
  • Menu items with a dropdown get a chevron, drawn as a masked inline SVG so it takes the link colour and rotates when the panel opens.
  • Switching between panels is instant in both directions, so no frame is left with neither panel painted.
  • Mobile: the logo keeps its stacking context while the menu closes, so the closing panel no longer paints over it.
  • Mobile: the Get Involved button fades in and out with the panel instead of appearing at full opacity the moment the menu opens.

Why are these changes being made?

Second round of partner feedback on the mega menu

Testing instructions

Above 1200px:

  • Hover each top-level item with a dropdown. Items should read down column one, then down column two: About gives Mission & History / Team / Board of Directors / Programs, then Financials & Annual Reports / Sponsors / Logo & Trademark / Contact.
  • Licensing has a featured card. Seven items split 4 and 3, with the card spanning the full panel height in a third column.
  • Move between panels without leaving the menu. The swap should be clean, with no moment where the page shows through.
  • Check the chevron rotates on open and follows the link colour.
  • Add or remove an item in Appearance > Menus and confirm the columns rebalance.

Below 1200px:

Worth a pass in Safari and Firefox: the chevron uses a CSS mask, and the panel layout uses a custom property in repeat().

mlaetitia and others added 2 commits August 27, 2026 19:40
… 16:9 featured image, dropdown chevrons, and an instant hide for the outgoing panel

Co-Authored-By: Claude Opus 5 (1M context) <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_01Lai9Z4rVugeJpe4a9gR1s1
…n chevron, and stop the panel switch and mobile close from flickering

Co-Authored-By: Claude Opus 5 (1M context) <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_011rCHPCdbV5C5dDJjEmMDuy
@nickvidal

Copy link
Copy Markdown
Member

Thanks @mlaetitia for handling the column order. Have a wonderful weekend ahead of you!

…pans past the grid stops column auto-flow from wrapping

Co-Authored-By: Claude Opus 5 (1M context) <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_011rCHPCdbV5C5dDJjEmMDuy
@mlaetitia
mlaetitia merged commit c3c6132 into develop Aug 31, 2026
5 checks passed
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants