admin/portfolio
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity
47 Commits 1 Branch 0 Tags
6cc54d8a29011730db6ed0c9c251325f5104bfa0
Commit Graph

10 Commits

Author SHA1 Message Date
admin 6cc54d8a29 Task 11: Implement scroll animations and responsive design 
- Add xs (480px) breakpoint to tailwind config for mobile
- Standardize scroll-reveal animations to opacity 0→1, y 24→0
- Add responsive padding to main container (px-5 xs:px-6 md:px-8)
- Add responsive section padding (py-12 xs:py-16 md:py-20)
- FloatingNav: responsive width and font/padding on mobile
- Hero: responsive vitals grid, title font clamp to 28px min
- Skills: responsive grid (2→3→auto-fit), smaller gauges on mobile
- Experience: responsive card padding, ECG decoration size
- Education/Projects: responsive grids matching concept.html
- Contact/Footer: responsive padding
 2026-02-10 17:20:27 +00:00
admin 1a2c43323b Task 10: Build Footer component with ECG decoration 
- Created Footer.tsx with decorative ECG waveform SVG
- Footer uses Framer Motion for scroll-triggered entrance animation
- Centered layout with border-top, muted attribution text
- Integrated Footer into App.tsx content phase
- Three-phase orchestration (boot → ecg → content) already working
 2026-02-10 17:03:11 +00:00
admin 13c2aa2121 feat: Build Education, Projects, and Contact sections (Task 9) 2026-02-10 16:54:25 +00:00
admin 09e4f92270 feat: Build Experience section with timeline (Task 8) 
- Create Experience.tsx component with vertical timeline layout
- Add 5 roles from NHS and Tesco with bullet points
- ECG waveform SVG decoration beside heading
- Timeline dots filled for current roles
- Hover effects on cards (scale, shadow, left border)
- Scroll-triggered animations using useScrollReveal hook
- Responsive: hide timeline line/dots on mobile
- Fix useScrollReveal ref type for React 18+ compatibility
 2026-02-10 16:48:14 +00:00
admin 0ffc71f110 feat: Build Skills section with SVG circular gauges 
- Create Skills.tsx with three categories (Technical, Clinical, Strategic)
- Add SkillGauge component with animated circular SVG progress
- Create useScrollReveal.ts hook for IntersectionObserver-based animations
- Staggered gauge fill animations (100ms delay per skill)
- Exact 18 skills with percentages from concept.html
- Hover effects matching concept.html styling
 2026-02-10 16:39:39 +00:00
admin e5042260c1 feat: Build Hero section component (Task 6) 
- Create Hero.tsx with name, title, location pill, summary paragraph
- Add four vital sign metric cards (10+ Years, Python/SQL/BI, Pop. Health, NHS N&W)
- Implement staggered entrance animations with Framer Motion
- Add hover elevation effects on vital cards
- Responsive design with flex-wrap for mobile
 2026-02-10 16:32:55 +00:00
admin 3eb91a3cec Task 5: Build FloatingNav component with active section tracking 
- Created useActiveSection hook using IntersectionObserver for scroll tracking
- Built FloatingNav with Framer Motion animated indicator dot
- Added section IDs to App.tsx for scroll targets
- Added scrollbar-hide utility and smooth scroll to index.css
 2026-02-10 16:25:14 +00:00
admin a07557091a Task 4: Build ECGAnimation component with canvas-based heartbeat and name drawing 2026-02-10 16:08:07 +00:00
admin 77c03144a9 Task 2 & 3: Set up project structure and build BootSequence component 
- Task 2: Project structure and types already complete from Task 1
- Task 3: Create BootSequence component with Framer Motion
  - 14 boot lines with 220ms staggered delays
  - Terminal typing animation with opacity/translateY transitions
  - Blinking cursor using CSS animation
  - AnimatePresence for 800ms exit fade
  - Total boot time ~4.28s matching concept.html
- Update App.tsx to use BootSequence with phase transitions
 2026-02-10 15:59:44 +00:00
admin f140c16881 Task 1: Initialize React project with Vite, TypeScript, Tailwind 
- Scaffolded project with React 18, Vite, TypeScript
- Configured Tailwind CSS with custom design tokens (teal, coral, ecg colors)
- Added Framer Motion and Lucide React dependencies
- Set up Google Fonts (Fira Code, Plus Jakarta Sans, Inter Tight)
- Created TypeScript interfaces for CV data types
- Added utility function for skill gauge calculations
- Quality checks passing: typecheck, build, lint all clean
 2026-02-10 15:39:29 +00:00