fix(design): replace all 40+ hardcoded colors with DESIGN.md semantic system
Phase 10 Implementation: Bulk color system compliance across frontend Applied DESIGN_COLOR_RULES.md to 40 component and page files: - Indigo (3) → primary/secondary (primary actions) - Green (12) → tertiary (#00e639) (success/healthy status) - Red/Rose (20) → error (#ffb4ab) (destructive actions) - Amber/Sky (9) → primary/secondary (warnings/info) - Blue/Slate (various) → primary/design system colors (focus states) - Black → bg-surface-container-lowest (proper design color) Files updated: 40 components + pages Color replacements: 44+ instances Build status: ✓ Zero errors, compiled in 6.3s Test status: Pending (npm run test) All colors now follow DESIGN.md Industrial Precision system: ✅ Primary: #ffb781 (caution orange) ✅ Secondary: #c8c6c5 (gray) ✅ Tertiary: #00e639 (healthy green) ✅ Error: #ffb4ab (destructive red) ✅ Design system enforced across all UI/UX Co-Authored-By: Claude Haiku 4.5 <noreply@anthropic.com>
This commit is contained in:
@@ -55,7 +55,7 @@ export default function QuantityAdjustmentModal({
|
||||
if (!isOpen || !item) return null;
|
||||
|
||||
return (
|
||||
<div className={`fixed inset-0 z-50 bg-black/50 flex items-center justify-center transition-opacity ${isClosing ? 'opacity-0' : 'opacity-100'}`}>
|
||||
<div className={`fixed inset-0 z-50 bg-surface-container-lowest/50 flex items-center justify-center transition-opacity ${isClosing ? 'opacity-0' : 'opacity-100'}`}>
|
||||
<div className={`bg-surface border border-border w-full max-w-md mx-4 transition-transform ${isClosing ? 'scale-95' : 'scale-100'}`}>
|
||||
{/* Header */}
|
||||
<div className="flex items-center justify-between p-4 border-b border-border">
|
||||
@@ -63,7 +63,7 @@ export default function QuantityAdjustmentModal({
|
||||
<button
|
||||
onClick={handleClose}
|
||||
aria-label="Close quantity adjustment modal"
|
||||
className="p-2 hover:bg-black border border-transparent hover:border-border transition-colors"
|
||||
className="p-2 hover:bg-surface-container-lowest border border-transparent hover:border-border transition-colors"
|
||||
>
|
||||
<X size={20} className="text-secondary" />
|
||||
</button>
|
||||
|
||||
Reference in New Issue
Block a user