# Navbar And Routing

> Frontend-local workflow for navbar behavior, route ordering, icon-only links, mobile menu UX, and page discoverability in PetSwipe. Use when working in frontend and the task touches Navbar, route links, or mobile navigation.

- Skill: `hoangsonww/navbar-and-routing` (Agent Skill, multi-file: 3 files)
- Install (CLI): `npx skillmds@latest add hoangsonww/navbar-and-routing`
- Raw SKILL.md: https://api.skillmd.com/api/skills/hoangsonww/navbar-and-routing/raw
- Safety review: pending
- Works with: Claude Code, Claude.ai, OpenAI Codex
- Category: Web & Frontend
- Author: hoangsonww (https://skillmd.com/u/hoangsonww)
- Updated: 2026-09-17
- Page: https://skillmd.com/skills/hoangsonww/navbar-and-routing

---


Use this skill for navbar and routing work inside `frontend/`.

## Workflow

1. Start from `Navbar.tsx` and the affected destination pages.
2. Check both desktop and mobile variants.
3. Verify ordering, iconography, spacing, and route discoverability.
4. Keep the mobile menu polished instead of treating it as a fallback.

Read `references/navbar-checklist.md`.