responsive

Mobile navigation requires different patterns than desktop—hamburger menus, slide-out drawers, and touch-friendly interactions. I build a responsive nav with Stimulus that shows a mobile menu button below a breakpoint and auto-hides when links are cli

Container queries enable responsive components based on container size using @container at-rule. I set container-type: inline-size to create query containers. The @container (min-width: 400px) queries container width instead of viewport. Named contain

Sometimes you want frame navigation on desktop but full-page navigation on mobile. You can decide the target frame at render time. This keeps UX tuned without duplicating controller actions.

Media queries adapt layouts to different screen sizes using @media rules with breakpoints. I use mobile-first approach starting with base mobile styles and progressively enhancing with min-width queries. Common breakpoints are 640px (sm), 768px (md),