test-repo/memory/project-standards.md
Matt Bruce 105621b40e Add project standards and responsive design requirements to AGENTS.md
- 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
2026-02-18 09:42:05 -06:00

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] or max-w-full with padding, never fixed widths
  • Forms: Stack fields vertically on mobile (flex-colsm: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