- Documented mobile-first responsive design as REQUIRED standard - Added web development tech preferences (Next.js, Tailwind, etc.) - Created memory/project-standards.md for coding guidelines
1.1 KiB
1.1 KiB
Project Guidelines & Standards
Web Development Standards
Responsive Design (Required)
All web applications must be responsive by default:
- Mobile-first approach — Design for smallest screens, enhance for larger
- Breakpoints: Use
sm:,md:,lg:,xl:Tailwind prefixes consistently - Touch targets: Minimum 44px for buttons/links on mobile
- Readable text: No tiny fonts on mobile (minimum 14px/0.875rem)
- Dialog/modals: Use
w-[95vw]ormax-w-fullwith padding, never fixed widths - Forms: Stack fields vertically on mobile (
flex-col→sm:flex-row) - Navigation: Collapse or reposition for mobile viewports
- Test: Always verify at 320px, 768px, and 1440px widths
UI Components
- Use shadcn/ui or Radix primitives for accessibility
- Dark mode support preferred
- Consistent spacing (4px grid system)
State Management
- Zustand for local state
- localStorage for persistence when appropriate
Git Workflow
- Commit after significant changes
- Meaningful commit messages with context
- Create branches for experiments
Last updated: 2026-02-18