Files
WooNooW/admin-spa
dwindown e267e3c2b2 feat: Standardize table UI across Orders and Products modules
**Issue:**
- Orders and Products had inconsistent table styling
- Orders: px-3 py-2, no hover, no header bg
- Products: p-3, hover effect, header bg

**Solution:**
1. Added comprehensive Table/List UI Standards to PROJECT_SOP.md
2. Updated Orders table to match Products standard

**Changes to PROJECT_SOP.md:**
- Added "Table/List UI Standards" section
- Defined required classes for all table elements
- Specified padding: p-3 (NOT px-3 py-2)
- Specified header: bg-muted/50 + font-medium
- Specified rows: hover:bg-muted/30
- Added empty state and mobile card patterns

**Changes to Orders/index.tsx:**
- Container: border-border bg-card → border (match Products)
- Header: border-b → bg-muted/50 + border-b
- Header cells: px-3 py-2 → p-3 font-medium text-left
- Body rows: Added hover:bg-muted/30
- Body cells: px-3 py-2 → p-3
- Empty state: px-3 py-12 → p-8 text-muted-foreground

**Result:**
 Consistent padding across all modules (p-3)
 Consistent header styling (bg-muted/50 + font-medium)
 Consistent hover effects (hover:bg-muted/30)
 Consistent container styling (overflow-hidden)
 Documented standard for future modules
2025-11-20 10:14:39 +07:00
..
2025-11-13 10:13:17 +07:00