AgentSkillsCN

managing-layouts-navigation

统筹根布局、持久化导航栏与页脚设计，为应用的全局框架奠定坚实基础。

SKILL.md
--- frontmatter
name: managing-layouts-navigation
description: Manages root layout, persistent navbar, and footer. Use when defining the global shell of the application.

Global Layout and Navigation

When to use this skill

  • •Editing layout.tsx.
  • •Building responsive navigation.

Components

  • •Navbar: Sticky top, glassmorphism, dynamic links (Auth state dependent).
  • •Mobile Menu: Hamburger icon, full-screen overlay or slide-out tray.
  • •Footer: Multi-column (destinations, support, social links).

Instructions

  • •Active State: Highlight current route in the navbar.
  • •Responsive: Ensure the navbar transitions smoothly from desktop links to mobile burger menu.