chore: add visual integration criteria to feature template (refs #2)
All checks were successful
Deploy to Staging / Build Images (pull_request) Successful in 23s
Deploy to Staging / Deploy to Staging (pull_request) Successful in 37s
Deploy to Staging / Verify Staging (pull_request) Successful in 5s
Deploy to Staging / Notify Staging Ready (pull_request) Successful in 5s
Deploy to Staging / Notify Staging Failure (pull_request) Has been skipped

Adds Visual Integration section to prevent design inconsistencies:
- Icons: Must use MUI Rounded icons only, no emoji in UI
- Colors: Theme colors only, no hardcoded hex, dark mode support
- Components: Use existing shared components (GlassCard, Button, etc.)
- Typography & Spacing: MUI variants, consistent spacing multiples

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
This commit is contained in:
Eric Gullickson
2026-01-02 21:51:18 -06:00
parent 7c8c80b6f4
commit 7b00dc7631

View File

@@ -76,6 +76,34 @@ body:
validations:
required: true
- type: textarea
id: visual-integration
attributes:
label: Visual Integration (Design Consistency)
description: Ensure the feature matches the app's visual language. Reference existing patterns.
value: |
### Icons
- [ ] Use MUI Rounded icons only (e.g., `HomeRoundedIcon`, `DirectionsCarRoundedIcon`)
- [ ] Icon reference: Check `frontend/src/components/Layout.tsx` for existing icons
- [ ] No emoji icons in UI (text content only)
### Colors
- [ ] Use theme colors via MUI sx prop: `color: 'primary.main'`, `bgcolor: 'background.paper'`
- [ ] No hardcoded hex colors (use Tailwind theme classes or MUI theme)
- [ ] Dark mode support: Use `dark:` Tailwind variants or MUI `theme.applyStyles('dark', ...)`
### Components
- [ ] Use existing shared components: `GlassCard`, `Button`, `Input` from `shared-minimal/`
- [ ] Follow card patterns in: `frontend/src/features/vehicles/` or `frontend/src/features/fuel-logs/`
- [ ] Loading states: Use skeleton patterns from existing features
### Typography & Spacing
- [ ] Use MUI Typography variants: `h4`, `h5`, `body1`, `body2`, `caption`
- [ ] Use consistent spacing: `gap-4`, `space-y-4`, `p-4` (multiples of 4)
- [ ] Mobile padding: `px-5 pt-5 pb-3` pattern from Layout.tsx
validations:
required: true
- type: textarea
id: implementation-notes
attributes: