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
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:
@@ -76,6 +76,34 @@ body:
|
|||||||
validations:
|
validations:
|
||||||
required: true
|
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
|
- type: textarea
|
||||||
id: implementation-notes
|
id: implementation-notes
|
||||||
attributes:
|
attributes:
|
||||||
|
|||||||
Reference in New Issue
Block a user