Docked nav - responsive solution in Page layout

[nicolethoen]

The docked nav should collapse into a toggle icon and be rendered as a horizontal masthead at mobile viewport widths (like our existing masthead does in traditional page layouts).

When the toggle is expanded, the docked nav with visible text labels should overlay the page content.

Figma: https://www.figma.com/proto/VNRVzyQl8urs3HFi5RXn0G/Unified-design-system-Concepts?page-id=4042%3A17137&node-id=5713-16691&viewport=2661%2C-8471%2C0.57&t=zjYcDsliqXPpqfps-1&scaling=min-zoom&content-scaling=fixed&starting-point-node-id=5713%3A16691&show-proto-sidebar=1

---

Jira Issue: PF-3284

[coderabbitai]

🔗 Related PRs

#8029 - fix: fixes for react docked nav [merged]
#8193 - feat(nav): unified theme updates [merged]

---

📝 Issue Planner

_{Check the box below or use the @coderabbitai plan command to generate an implementation plan and prompts that you can use with your favorite coding assistant.}

• Create Plan

---

🧪 Issue enrichment is currently in open beta.

You can configure auto-planning by selecting labels in the issue_enrichment configuration.

To disable automatic issue enrichment, add the following to your .coderabbit.yaml:

issue_enrichment:
  auto_enrich:
    enabled: false

💬 Have feedback or questions? Drop into our discord!

[evwilkin]

Reopened via Jira sync - Jira issue PF-3284 was reopened.