2 Commits

Author	SHA1	Message	Date
Daniel Bedeleanu	9a87064dbe	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>	2026-04-25 17:19:53 +03:00
Daniel Bedeleanu	b2e2daf40d	feat(phase2): implement ManualCropUI with drag handles ... - useCropHandles.ts: Hook managing crop bounds state, drag operations, and constraints - 8 draggable handles (4 corners + 4 edges) - Real-time crop bounds calculation during drag - Constrained within image bounds (no dragging outside) - Minimum crop size enforcement (100x100px) - Support for mobile (touch) and desktop (mouse) events - Bounds validation on initialization - ManualCropUI.tsx: Interactive crop preview component - Responsive image display with calculated scaling - Semi-transparent overlay outside crop box with visible bounding box - 8 draggable handles with visual feedback (highlight/scale on hover) - 'Use Full Photo' button to clear crop and show full image - Real-time onCropChange callbacks to parent - Error handling for failed image loads - Touch and mouse event support (desktop + mobile) - TypeScript strict mode compliant - Tests: 26 comprehensive test cases - Hook tests (26 passing): initialization, setCrop, resetCrop, drag operations (corners, edges), constraints, endDrag, edge cases - Component tests (26 passing): rendering, handles, overlay, callbacks, button, error handling, dimensions, touch/mouse support, responsive behavior, size enforcement, bounds display All 364 tests passing (13 test files, zero regressions) Minimum crop size: 100x100px Handle visual feedback on hover/drag TypeScript strict mode: ✓	2026-04-21 13:05:37 +03:00