# Progress Log — Login Logo & Blur Refinements # Branch: ralph/login-logo-refinements # Started: 2026-02-15 ## Codebase Patterns ### Project Structure - Components in `src/components/`, tiles in `src/components/tiles/` - Data files in `src/data/` - Types in `src/types/pmr.ts` and `src/types/index.ts` - Hooks in `src/hooks/`, Contexts in `src/contexts/`, Lib in `src/lib/` - Path alias: `@/` maps to `./src/` ### Phase Management - App.tsx controls phase: 'boot' -> 'ecg' -> 'login' -> 'pmr' - BootSequence.tsx, ECGAnimation.tsx — LOCKED, do not modify - LoginScreen.tsx bridges to dashboard ### Typography - Elvaro Grotesque (`font-ui`, `var(--font-ui)`) — primary UI font - Blumir (`font-ui-alt`) — alternative variable font - Geist Mono (`font-geist`, `var(--font-geist-mono)`) — timestamps, data values - Fira Code (`font-mono`) — boot/ECG terminal only - Do NOT use Inter, Roboto, DM Sans, or system defaults ### Design Tokens (index.css CSS variables) - --surface: #FFFFFF (card/topbar background) - --bg-dashboard: #F0F5F4 (warm sage content background) - --accent: #0D6E6E (teal primary) - --accent-hover: #0A8080 - --accent-light: rgba(10,128,128,0.08) - --border: #D4E0DE (structural borders) - --border-card: #E4EDEB (card/inner borders) - --text-primary: #1A2B2A - --text-secondary: #5B7A78 - --text-tertiary: #8DA8A5 - --sidebar-width: 304px - --topbar-height: 56px ### Known Dependencies - React 18.3.1, TypeScript, Vite, Tailwind CSS - Framer Motion 11.15.0, Lucide React 0.468.0, fuse.js 7.0.0 ### Key Files for This Feature - src/components/CvmisLogo.tsx — logo component with animation (timing constants to extract) - src/components/LoginScreen.tsx — main login screen (overlay, blur, card styling) - src/App.tsx — phase management (skip/restore boot sequence) - src/index.css — CSS custom properties, design tokens ### CvmisLogo Component (from previous run) - `size` prop: numeric, sets SVG height attribute directly - `cssHeight` prop: string, sets height via CSS style (use for clamp/responsive values) - `animated` prop: boolean, enables framer-motion reveal animation (1000ms total) - Logo animation: 500ms rise (green capsule) + 500ms fan-out (all three) = 1000ms total - All timing values are named constants at top of file — tune there, not inline - Blend constants (OVERLAY_BLEND_*) are exported for use by other components (US-005) ### LoginScreen.tsx State (from previous run) - Overlay: fixed inset-0 z-50, rgba(240, 245, 244, 0.7) + backdrop-filter: blur(20px) - TopBar is zIndex: 100 — currently renders ABOVE the z-50 overlay (bug) - Card borderRadius: 12px, inputs/button borderRadius: 4px - Some colors already tokenized (--surface, --accent, --bg-dashboard) from previous run - Some colors still hardcoded (#111827 input text, button bg states, caret color) --- ## 2026-02-15 - US-001: Skip to login phase for dev iteration - Changed initial Phase state from `'boot'` to `'login'` in `src/App.tsx` line 47 - Files changed: `src/App.tsx` - **Learnings for future iterations:** - Phase state is a simple `useState` on line 47 of App.tsx - All phase rendering logic (`boot`, `ecg`, `login`, `pmr`) remains intact — only initial value changes - US-011 will revert this exact change back to `'boot'` --- ## 2026-02-15 - US-002: Extract animation timing into named constants - Extracted all inline timing values in CvmisLogo.tsx to named constants at top of file - Constants added: RISE_DURATION_MS, RISE_DURATION_S, RISE_OPACITY_DURATION_S, RISE_EASING, RISE_START_Y, FAN_DELAY_AFTER_RISE_MS, FAN_DURATION_S, FAN_ROTATION_DEG, FAN_HORIZONTAL_PX, FAN_RIGHT_STAGGER_S, TOTAL_ANIMATION_MS - Added overlap blend constants for US-005: OVERLAY_BLEND_START_PROGRESS, OVERLAP_BLEND_MAX_OPACITY, OVERLAP_BLEND_TRANSITION_DURATION_S (exported) - Files changed: `src/components/CvmisLogo.tsx` - **Learnings for future iterations:** - Blend constants are `export`ed because TypeScript strict mode flags unused `const` declarations — exporting avoids the TS6133 error while making them available for US-005 - TOTAL_ANIMATION_MS is computed from FAN_DELAY_AFTER_RISE_MS + FAN_DURATION_S * 1000, so changing rise or fan timing automatically updates the done-timer - FAN_EASING was already a named constant before this story; it was left in place and grouped with the new fan constants ---