From cf1f46645224bf380f6ca7f1454e78a99123fdfa Mon Sep 17 00:00:00 2001 From: Andy Charlwood Date: Sat, 14 Feb 2026 20:31:22 +0000 Subject: [PATCH] feat: US-023 - Scale LastConsultationSubsection and main content padding --- Ralph/prd.json | 2 +- Ralph/progress.txt | 14 ++++++++++++++ src/components/DashboardLayout.tsx | 18 +++++++++--------- 3 files changed, 24 insertions(+), 10 deletions(-) diff --git a/Ralph/prd.json b/Ralph/prd.json index a071404..76b9087 100644 --- a/Ralph/prd.json +++ b/Ralph/prd.json @@ -123,7 +123,7 @@ "Verify in browser using dev-browser skill" ], "priority": 6, - "passes": false, + "passes": true, "notes": "LastConsultationSubsection is defined inline in DashboardLayout.tsx (around lines 57-232). The main content padding classes are on the element around line 369." }, { diff --git a/Ralph/progress.txt b/Ralph/progress.txt index 0f6d948..d89f1c4 100644 --- a/Ralph/progress.txt +++ b/Ralph/progress.txt @@ -117,3 +117,17 @@ - The sublabel uses font-geist (monospace) for the "technical texture" pattern --- +## 2026-02-14 — US-023 +- Scaled LastConsultationSubsection: field label 10px→12px, field value 11.5px→13px, role title 13.5px→15px +- Examination bullet fontSize 12.5px→14px, bullet dot top offset 7px→8px for new line height +- View full record button 12px→13px, ChevronRight 14→15 +- Field gap 16px→20px for better spacing between metadata fields +- Updated main content padding from 'p-4 pb-8 md:p-6 md:pb-10 lg:px-7 lg:pt-6 lg:pb-10' to 'p-5 pb-10 md:p-7 md:pb-12 lg:px-8 lg:pt-7 lg:pb-12' +- Files changed: src/components/DashboardLayout.tsx +- **Learnings for future iterations:** + - LastConsultationSubsection is defined inline in DashboardLayout.tsx (lines ~57-232), not in a separate file + - fieldLabelStyle and fieldValueStyle are shared CSSProperties objects — changing them updates all 4 field columns (Date, Organisation, Type, Band) at once + - The bullet dot `top` offset needs to be adjusted when bullet fontSize changes — at 14px text with 1.5 line-height, 8px top centers the 5px dot + - Main content padding uses Tailwind responsive classes on — these are cumulative (p-5 base, md:p-7 overrides, lg:px-8/lg:pt-7 overrides further) +--- + diff --git a/src/components/DashboardLayout.tsx b/src/components/DashboardLayout.tsx index 1959029..4c884df 100644 --- a/src/components/DashboardLayout.tsx +++ b/src/components/DashboardLayout.tsx @@ -89,7 +89,7 @@ function LastConsultationSubsection() { } const fieldLabelStyle: React.CSSProperties = { - fontSize: '10px', + fontSize: '12px', textTransform: 'uppercase', letterSpacing: '0.06em', color: 'var(--text-tertiary)', @@ -97,7 +97,7 @@ function LastConsultationSubsection() { } const fieldValueStyle: React.CSSProperties = { - fontSize: '11.5px', + fontSize: '13px', fontWeight: 600, color: 'var(--text-primary)', } @@ -114,7 +114,7 @@ function LastConsultationSubsection() { style={{ display: 'flex', flexWrap: 'wrap', - gap: '16px', + gap: '20px', marginBottom: '14px', paddingBottom: '14px', borderBottom: '1px solid var(--border-light)', @@ -152,7 +152,7 @@ function LastConsultationSubsection() {
View full record - +
) @@ -366,7 +366,7 @@ export function DashboardLayout() { animate="visible" variants={contentVariants} aria-label="Dashboard content" - className="pmr-scrollbar p-4 pb-8 md:p-6 md:pb-10 lg:px-7 lg:pt-6 lg:pb-10" + className="pmr-scrollbar p-5 pb-10 md:p-7 md:pb-12 lg:px-8 lg:pt-7 lg:pb-12" style={{ flex: 1, overflowY: 'auto',