Docked Navigation Hardening

[nicolethoen]

Summary: Finalize the responsiveness and visual integrity of the Docked Navigation component. This ensures the vertical masthead renders correctly within the docked container across both traditional and Compass layouts, and works seamlessly with the new Unified Theme.

Scope / Child Issues:

• Responsive Implementation: Ensure docked nav behaves robustly across breakpoints (collapsing/expanding).
• Masthead Integration: Implement the vertical, docked masthead within the standard Page Layout and Compass Layout.
• Cross-Theme QA: Verify visual correctness in both Default Theme and Unified Theme.
• Icon Text Toggles: Implement prop-based or media-query-based logic to toggle text labels on docked icons.
• Determine limitations of combining docked nav with compass N/S/E/W regions.
  • Should we only ship a Docked nav with Page component? Should we make it play nicer with Compass layouts?

---

Jira Issue: PF-3179

[mcoker]

Still working through the solution. So far the following have been implemented:

• Support for expand/collapse dock with animation and reduced animation fallback
• Dock version of buttons
• Dock version of menu toggles
• Support for text nodes in docked navigation component
• Breakpoint responsiveness is wired up for docked nav, docked buttons, and docked menu toggles to show regular dock (just icons) and full-text version of dock
• Icon buttons/menu toggles have been reworked to address aspect ratio issues that cause icons to shift when dynamically adding/removing text from the buttons/menu toggles

Remaining

• Support for compact and full logo in dock
• Add hamburger icons in docked nav and masthead
• Wire up class to toggle the full-text version of dock on/off