diff --git a/.gitea/issue_template/feature.yaml b/.gitea/issue_template/feature.yaml index e91f5cc..15becc8 100644 --- a/.gitea/issue_template/feature.yaml +++ b/.gitea/issue_template/feature.yaml @@ -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: