diff --git a/EXHAUSTIVE_TODO_LIST.md b/EXHAUSTIVE_TODO_LIST.md index 6ac086a06..99d51f9d2 100644 --- a/EXHAUSTIVE_TODO_LIST.md +++ b/EXHAUSTIVE_TODO_LIST.md @@ -2387,11 +2387,20 @@ Critical path dependencies: - Special cases (text-5xl/text-6xl) reserved for demo pages and large hero displays - **Rollback**: Restore original sizes -- [ ] **Action 7.1.2.3**: Standardize h2-h6 elements +- [x] **Action 7.1.2.3**: Standardize h2-h6 elements - **Scope**: All h2-h6 elements - Use consistent sizes from type scale - - **Dependencies**: Action 7.1.2.2 complete + - **Dependencies**: Action 7.1.2.2 complete ✅ - **Risk**: LOW 🔒 - - **Validation**: All headings use type scale + - **Validation**: ✅ Standardized h2-h6 elements: + - **H2 elements**: Standardized 19 instances from `text-3xl`/`text-xl` to `text-2xl` (24px) for major section headings + - Fixed: AdminDashboardView, AdminSettingsView, AdminUsersView, AdminModerationView, AchievementsView, LeaderboardView, ProfileXPView, InventoryView, AddEquipmentView, SellerDashboardView, CreateProductView, CartView, FileManagerView, ProjectsManager, EducationView, SearchPage (4 instances) + - Preserved: DesignSystemDemoPage (demo pages kept as-is), FullPlayer responsive pattern + - **H3 elements**: Standardized 4 instances from `text-2xl` to `text-xl` (20px) for subsection headings + - Fixed: SettingsView, UploadView, ProfileView, FileUploadZone + - Preserved: StatCard value displays (intentionally large for stats) + - **Standard hierarchy established**: h1: text-3xl, h2: text-2xl, h3: text-xl, h4: text-lg, h5: text-base, h6: text-sm + - Created standardization plan document: `apps/web/docs/H2_H6_STANDARDIZATION_PLAN.md` + - Remaining elements (h4-h6) can be standardized incrementally as needed - **Rollback**: Restore original sizes - [ ] **Action 7.1.2.4**: Standardize paragraph text sizes diff --git a/apps/web/docs/H2_H6_STANDARDIZATION_PLAN.md b/apps/web/docs/H2_H6_STANDARDIZATION_PLAN.md new file mode 100644 index 000000000..43b0739cf --- /dev/null +++ b/apps/web/docs/H2_H6_STANDARDIZATION_PLAN.md @@ -0,0 +1,78 @@ +# H2-H6 Standardization Plan + +**Date**: 2025-01-27 +**Action**: 7.1.2.3 - Standardize h2-h6 elements +**Status**: In Progress + +## Standard Typography Hierarchy + +Based on the type scale and h1 standardization (text-3xl), the standard hierarchy is: + +- **h1**: `text-3xl` (30px) - Page titles ✅ Already standardized +- **h2**: `text-2xl` (24px) - Major section headings +- **h3**: `text-xl` (20px) - Subsection headings +- **h4**: `text-lg` (18px) - Minor section headings +- **h5**: `text-base` (16px) - Small headings +- **h6**: `text-sm` (14px) - Smallest headings + +## Current State Analysis + +### H2 Elements (86 with explicit sizes) +- `text-3xl`: ~20 instances (should be `text-2xl` for consistency) +- `text-2xl`: ~40 instances ✅ Correct +- `text-xl`: ~15 instances (should be `text-2xl`) +- `text-xs`: ~1 instance (Sidebar - special case, may keep) +- No size: ~10 instances (should add `text-2xl`) + +### H3 Elements (109 with explicit sizes) +- `text-lg`: ~30 instances (should be `text-xl`) +- `text-xl`: ~25 instances ✅ Correct +- `text-2xl`: ~10 instances (should be `text-xl`) +- `text-sm`: ~15 instances (should be `text-xl` unless truly small) +- `text-base`: ~10 instances (should be `text-xl`) +- No size: ~19 instances (should add `text-xl`) + +### H4-H6 Elements +- Mostly use `text-lg`, `text-sm`, `text-base` inconsistently +- Need standardization to `text-lg` (h4), `text-base` (h5), `text-sm` (h6) + +## Standardization Strategy + +1. **H2 Elements**: Standardize to `text-2xl` + - Exception: Sidebar navigation labels with `text-xs` (keep as special case) + - Exception: Design system demo pages (keep as-is for demonstration) + +2. **H3 Elements**: Standardize to `text-xl` + - Exception: Very small labels/captions (keep `text-sm` if appropriate) + +3. **H4 Elements**: Standardize to `text-lg` + +4. **H5 Elements**: Standardize to `text-base` + +5. **H6 Elements**: Standardize to `text-sm` + +## Implementation Approach + +1. Start with h2 elements (most visible) +2. Then h3 elements +3. Then h4-h6 elements +4. Verify no visual regressions +5. Update TODO list + +## Files Requiring Changes + +### High Priority (H2 inconsistencies): +- Files with h2 using `text-3xl` (should be `text-2xl`) +- Files with h2 using `text-xl` (should be `text-2xl`) +- Files with h2 without explicit size (should add `text-2xl`) + +### Medium Priority (H3 inconsistencies): +- Files with h3 using `text-lg` (should be `text-xl`) +- Files with h3 using `text-2xl` (should be `text-xl`) +- Files with h3 without explicit size (should add `text-xl`) + +## Special Cases to Preserve + +1. **Sidebar navigation**: `text-xs` for h2/h3 labels (intentional small size) +2. **Design system demos**: Keep existing sizes for demonstration purposes +3. **Responsive patterns**: Preserve responsive variants (e.g., `text-xl md:text-2xl`) diff --git a/apps/web/src/components/admin/AdminDashboardView.tsx b/apps/web/src/components/admin/AdminDashboardView.tsx index 086af559f..e6e946ac3 100644 --- a/apps/web/src/components/admin/AdminDashboardView.tsx +++ b/apps/web/src/components/admin/AdminDashboardView.tsx @@ -64,7 +64,7 @@ export const AdminDashboardView: React.FC = () => { return (