admin/portfolio
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Mark Task 7 complete, update progress log

Browse Source 
Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
This commit is contained in:
A Charlwood
2026-02-09 11:09:04 +00:00
parent a0fc24534a
commit e6f416410a
2 changed files with 13 additions and 1 deletions
Download Patch File Download Diff File Expand all files Collapse all files
IMPLEMENTATION_PLAN.md
+1 -1
View File
@@ -153,7 +153,7 @@
**Scroll-triggered animation:** Use IntersectionObserver on the skills section. When it enters the viewport (threshold 0.15), animate each skill gauge's `stroke-dashoffset` to its target value. Stagger each gauge by `100ms` (first gauge starts immediately, second at 100ms, third at 200ms, etc.). **Scroll-triggered animation:** Use IntersectionObserver on the skills section. When it enters the viewport (threshold 0.15), animate each skill gauge's `stroke-dashoffset` to its target value. Stagger each gauge by `100ms` (first gauge starts immediately, second at 100ms, third at 200ms, etc.).
- [ ] **Task 7: Build experience section with timeline and ECG decoration** - [x] **Task 7: Build experience section with timeline and ECG decoration**
Experience section (`#experience`). Section heading "Experience" in `font-size: 24px; font-weight: 700; color: var(--heading);`. Experience section (`#experience`). Section heading "Experience" in `font-size: 24px; font-weight: 700; color: var(--heading);`.
progress.txt
+12
View File
@@ -89,3 +89,15 @@
- 18 skills total: 8 Technical (teal), 6 Clinical (coral), 4 Strategic (teal) — all with correct percentages - 18 skills total: 8 Technical (teal), 6 Clinical (coral), 4 Strategic (teal) — all with correct percentages
- IntersectionObserver-based scroll animation with 100ms stagger is in place via `initSkillGauges()` - IntersectionObserver-based scroll animation with 100ms stagger is in place via `initSkillGauges()`
- Learnings: SVG `width`/`height` attributes are presentation attributes; CSS can override them when a `viewBox` is set - Learnings: SVG `width`/`height` attributes are presentation attributes; CSS can override them when a `viewBox` is set
### Iteration 7 — Task 7: Build experience section with timeline and ECG decoration
- Added complete experience section with 5 roles in a vertical timeline layout
- Timeline has vertical line at 20% from left with dots (`.current` class fills dot with teal for active roles)
- Decorative ECG waveform SVG (200x30, PQRST shape) beside section heading at 30% opacity
- 5 timeline cards with role title, organisation (teal), date pill, and bullet points
- Cards have hover effect: scale(1.01), shadow-md elevation, teal left border appears
- Responsive 768px: timeline line and dots hidden, entries become full-width stacked
- Responsive 480px: reduced card padding (16px), smaller ECG decoration (120px via CSS width)
- All CV content verified accurate: correct titles, orgs, dates, key numbers (£14.6M, 14,000, £2.6M, 70%, 200+, £220M, £1M+, 3,000+)
- HTML tag balance verified: all section/div/ul/li/h3 tags matched correctly
- No new codebase pattern learnings — timeline pattern straightforward with existing conventions