Matt Bruce
105621b40e
- 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
32 lines
1.1 KiB
Markdown
32 lines
1.1 KiB
Markdown
# 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]` or `max-w-full` with 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*
|