From 8d5db4cd346061fdfe2e3424e879b23ac38706da Mon Sep 17 00:00:00 2001 From: senke Date: Thu, 15 Jan 2026 23:54:05 +0100 Subject: [PATCH] typography: standardize h2-h6 heading elements - Standardized h2 elements: 19 instances from text-3xl/text-xl to text-2xl - Standardized h3 elements: 4 instances from text-2xl to text-xl - Established consistent hierarchy: h1(text-3xl), h2(text-2xl), h3(text-xl) - Preserved special cases: demo pages, responsive patterns, stat value displays - Created standardization plan document - Task 7.1.2.3 complete --- EXHAUSTIVE_TODO_LIST.md | 15 +++- apps/web/docs/H2_H6_STANDARDIZATION_PLAN.md | 78 +++++++++++++++++++ .../components/admin/AdminDashboardView.tsx | 2 +- .../components/admin/AdminModerationView.tsx | 2 +- .../components/admin/AdminSettingsView.tsx | 2 +- .../src/components/admin/AdminUsersView.tsx | 2 +- .../education/CourseLearningView.tsx | 2 +- .../gamification/AchievementsView.tsx | 2 +- .../gamification/LeaderboardView.tsx | 2 +- .../components/gamification/ProfileXPView.tsx | 2 +- .../components/inventory/AddEquipmentView.tsx | 2 +- .../components/inventory/InventoryView.tsx | 2 +- apps/web/src/components/layout/Header.tsx | 2 +- .../components/live/LiveStreamDetailView.tsx | 2 +- .../components/seller/CreateProductView.tsx | 2 +- .../components/seller/SellerDashboardView.tsx | 2 +- .../src/components/studio/ProjectsManager.tsx | 2 +- apps/web/src/components/ui/LazyComponent.tsx | 2 +- .../src/components/upload/FileUploadZone.tsx | 2 +- apps/web/src/components/views/CartView.tsx | 2 +- .../src/components/views/EducationView.tsx | 2 +- .../src/components/views/FileManagerView.tsx | 2 +- apps/web/src/components/views/LiveView.tsx | 2 +- apps/web/src/components/views/ProfileView.tsx | 2 +- .../web/src/components/views/SettingsView.tsx | 2 +- apps/web/src/components/views/UploadView.tsx | 2 +- .../playlists/pages/PlaylistListPage.tsx | 2 +- .../features/settings/pages/SettingsPage.tsx | 4 +- apps/web/src/pages/DeveloperPage.tsx | 2 +- apps/web/src/pages/EducationPage.tsx | 2 +- apps/web/src/pages/GearPage.tsx | 2 +- apps/web/src/pages/LivePage.tsx | 2 +- apps/web/src/pages/ProfilePage.tsx | 2 +- apps/web/src/pages/QueuePage.tsx | 2 +- apps/web/src/pages/SearchPage.tsx | 8 +- apps/web/src/pages/SettingsPage.tsx | 2 +- apps/web/src/pages/SocialPage.tsx | 2 +- 37 files changed, 129 insertions(+), 42 deletions(-) create mode 100644 apps/web/docs/H2_H6_STANDARDIZATION_PLAN.md 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 (
-

+

SYSTEM OVERVIEW

diff --git a/apps/web/src/components/admin/AdminModerationView.tsx b/apps/web/src/components/admin/AdminModerationView.tsx index 1e9d14be5..0d1f792b1 100644 --- a/apps/web/src/components/admin/AdminModerationView.tsx +++ b/apps/web/src/components/admin/AdminModerationView.tsx @@ -70,7 +70,7 @@ export const AdminModerationView: React.FC = () => { return (
-

+

MODERATION QUEUE

diff --git a/apps/web/src/components/admin/AdminSettingsView.tsx b/apps/web/src/components/admin/AdminSettingsView.tsx index c4aed2567..95190de7e 100644 --- a/apps/web/src/components/admin/AdminSettingsView.tsx +++ b/apps/web/src/components/admin/AdminSettingsView.tsx @@ -17,7 +17,7 @@ export const AdminSettingsView: React.FC = () => { return (
-

+

SYSTEM SETTINGS

-

+

Your Cart ({cart.length})

diff --git a/apps/web/src/components/views/EducationView.tsx b/apps/web/src/components/views/EducationView.tsx index 448cd0b1e..bb03fc1fd 100644 --- a/apps/web/src/components/views/EducationView.tsx +++ b/apps/web/src/components/views/EducationView.tsx @@ -56,7 +56,7 @@ export const EducationView: React.FC = ({ {/* Header */}
-

+

ACADEMY

diff --git a/apps/web/src/components/views/FileManagerView.tsx b/apps/web/src/components/views/FileManagerView.tsx index 168576559..1c6cbafb6 100644 --- a/apps/web/src/components/views/FileManagerView.tsx +++ b/apps/web/src/components/views/FileManagerView.tsx @@ -148,7 +148,7 @@ export const FileManagerView: React.FC = () => { {/* Header & Controls */}

-

+

FILE MANAGER

diff --git a/apps/web/src/components/views/LiveView.tsx b/apps/web/src/components/views/LiveView.tsx index 8fae19811..6f7cbbef8 100644 --- a/apps/web/src/components/views/LiveView.tsx +++ b/apps/web/src/components/views/LiveView.tsx @@ -121,7 +121,7 @@ export const LiveView: React.FC = () => { />
-

+

{featuredStream.title}

= ({ userId }) => { {activeTab === 'about' && (

-

+

Biography

diff --git a/apps/web/src/components/views/SettingsView.tsx b/apps/web/src/components/views/SettingsView.tsx index 7455fece6..c1709e631 100644 --- a/apps/web/src/components/views/SettingsView.tsx +++ b/apps/web/src/components/views/SettingsView.tsx @@ -152,7 +152,7 @@ export const SettingsView: React.FC = ({ )}

-

+

{activeTab} Settings

diff --git a/apps/web/src/components/views/UploadView.tsx b/apps/web/src/components/views/UploadView.tsx index ab30dc13d..6cbe3cdcf 100644 --- a/apps/web/src/components/views/UploadView.tsx +++ b/apps/web/src/components/views/UploadView.tsx @@ -259,7 +259,7 @@ export const UploadView: React.FC = () => {

-

+

Ready to Publish

diff --git a/apps/web/src/features/playlists/pages/PlaylistListPage.tsx b/apps/web/src/features/playlists/pages/PlaylistListPage.tsx index 9c0006338..1f2b49bdc 100644 --- a/apps/web/src/features/playlists/pages/PlaylistListPage.tsx +++ b/apps/web/src/features/playlists/pages/PlaylistListPage.tsx @@ -61,7 +61,7 @@ export function PlaylistListPage() {

-

+

Playlists

diff --git a/apps/web/src/features/settings/pages/SettingsPage.tsx b/apps/web/src/features/settings/pages/SettingsPage.tsx index d098dcab4..a9109ebe2 100644 --- a/apps/web/src/features/settings/pages/SettingsPage.tsx +++ b/apps/web/src/features/settings/pages/SettingsPage.tsx @@ -119,7 +119,7 @@ export function SettingsPage() { return (

-

+

Paramètres

-

+

Paramètres

diff --git a/apps/web/src/pages/DeveloperPage.tsx b/apps/web/src/pages/DeveloperPage.tsx index 8db7eef32..8cf3792ca 100644 --- a/apps/web/src/pages/DeveloperPage.tsx +++ b/apps/web/src/pages/DeveloperPage.tsx @@ -11,7 +11,7 @@ export function DeveloperPage() {
-

+

Developer API

diff --git a/apps/web/src/pages/EducationPage.tsx b/apps/web/src/pages/EducationPage.tsx index b884fcf6f..51a11ce53 100644 --- a/apps/web/src/pages/EducationPage.tsx +++ b/apps/web/src/pages/EducationPage.tsx @@ -11,7 +11,7 @@ export function EducationPage() {

-

+

Veza Academy

diff --git a/apps/web/src/pages/GearPage.tsx b/apps/web/src/pages/GearPage.tsx index 5f56b32a8..2f842d91b 100644 --- a/apps/web/src/pages/GearPage.tsx +++ b/apps/web/src/pages/GearPage.tsx @@ -11,7 +11,7 @@ export function GearPage() {

-

+

Gear Locker

diff --git a/apps/web/src/pages/LivePage.tsx b/apps/web/src/pages/LivePage.tsx index 51bb6befe..dfd40f9f1 100644 --- a/apps/web/src/pages/LivePage.tsx +++ b/apps/web/src/pages/LivePage.tsx @@ -11,7 +11,7 @@ export function LivePage() {

-

+

Live Sessions

diff --git a/apps/web/src/pages/ProfilePage.tsx b/apps/web/src/pages/ProfilePage.tsx index 7eee4bab7..437fdaba7 100644 --- a/apps/web/src/pages/ProfilePage.tsx +++ b/apps/web/src/pages/ProfilePage.tsx @@ -9,7 +9,7 @@ export function ProfilePage() { return (

-

+

Mon Profil

diff --git a/apps/web/src/pages/QueuePage.tsx b/apps/web/src/pages/QueuePage.tsx index 4f20257ae..234a79b37 100644 --- a/apps/web/src/pages/QueuePage.tsx +++ b/apps/web/src/pages/QueuePage.tsx @@ -11,7 +11,7 @@ export function QueuePage() {

-

+

Play Queue

diff --git a/apps/web/src/pages/SearchPage.tsx b/apps/web/src/pages/SearchPage.tsx index 22bb0355d..4961643da 100644 --- a/apps/web/src/pages/SearchPage.tsx +++ b/apps/web/src/pages/SearchPage.tsx @@ -222,7 +222,7 @@ export function SearchPage() { {/* Tracks */} {totalTracks > 0 && (

-

+

Tracks ({totalTracks})

@@ -271,7 +271,7 @@ export function SearchPage() { {/* Playlists */} {totalPlaylists > 0 && (
-

+

Playlists ({totalPlaylists})

@@ -301,7 +301,7 @@ export function SearchPage() { {/* Users */} {totalUsers > 0 && (
-

+

Users ({totalUsers})

@@ -524,7 +524,7 @@ export function SearchPage() {
-

Start Searching

+

Start Searching

Enter a search query to find tracks, playlists, and users

diff --git a/apps/web/src/pages/SettingsPage.tsx b/apps/web/src/pages/SettingsPage.tsx index d62c20cdb..42a9967b6 100644 --- a/apps/web/src/pages/SettingsPage.tsx +++ b/apps/web/src/pages/SettingsPage.tsx @@ -40,7 +40,7 @@ export function SettingsPage() {
-

+

Settings

diff --git a/apps/web/src/pages/SocialPage.tsx b/apps/web/src/pages/SocialPage.tsx index 009d72cfe..089f17e58 100644 --- a/apps/web/src/pages/SocialPage.tsx +++ b/apps/web/src/pages/SocialPage.tsx @@ -37,7 +37,7 @@ export function SocialPage() {

-

+

Community Feed