feat: implement top navigation bar (Task 2.1)

- Add chart_tab() component for chart type pills
- Implement full top_bar() with logo, title, chart tabs, data freshness
- Heritage Blue background with white text, 64px fixed height
- Reactive data freshness indicator using rx.cond for loading states
- Added Transitions import to styles
This commit is contained in:
Andrew Charlwood
2026-02-04 13:40:31 +00:00
parent 072ce852af
commit a8d9f7b757
2 changed files with 86 additions and 20 deletions
+4 -4
View File
@@ -51,14 +51,14 @@ cd pathways_app && timeout 60 python -m reflex run 2>&1 | head -30
## Phase 2: Layout Components
### 2.1 Top Navigation Bar
- [ ] Create `top_bar()` component:
- [x] Create `top_bar()` component:
- Logo (use existing NHS person logo from assets)
- App title "HCD Analysis"
- Chart type tabs/pills (Icicle active, placeholders for future charts)
- Data freshness indicator (right side): "12,450 records (2d ago)"
- [ ] Style with Heritage Blue accents, clean typography
- [ ] Fixed height: 64px
- [ ] Verify renders correctly
- [x] Style with Heritage Blue accents, clean typography
- [x] Fixed height: 64px
- [x] Verify renders correctly
### 2.2 Filter Section
- [ ] Create `filter_section()` component with card styling