SysAdmin
a272373246
Added comprehensive mobile card layout for Products/Index, completing Phase 2 responsive design. **Products Mobile View Features:** - Horizontal layout with 80x80px product image on left - Product name, category badge, price, and status on right - Full description (100 chars) below header - 2-column grid for Stock and Weight info - Conditional badges for multi-buys and variants - Full-width "View Details & Edit" button **Mobile UX Highlights:** - Larger product images (80px vs 50px desktop thumbnail) - Price prominently displayed in green (fs-5) - Stock status color-coded (success/warning) - Variations clearly shown with icon badges - Touch-friendly full-width action button **Technical Implementation:** - d-flex for image + info horizontal layout - flex-grow-1 for responsive info section - row g-2 for 2-column grid with gutters - Conditional rendering for variations badges - ARIA labels for accessibility **Phase 2 Now Complete:** ✅ Categories - Simple cards with description ✅ Users - Minimal cards with user info ✅ ShippingRates - 2x2 grid for rate details ✅ VariantCollections - Cards with JSON preview ✅ Products - Rich cards with images and variations ✅ Orders - Mobile cards (already implemented) All main Index views now mobile-optimized! 🚀 Generated with Claude Code Co-Authored-By: Claude <noreply@anthropic.com> |
||
|---|---|---|
| .. | ||
| Admin | ||