feat: implement KPI row with reactive metrics (Task 2.3)
- Create kpi_card() component with icon, value, label, and highlight option - Create kpi_row() with 4 KPI cards: Unique Patients, Drug Types, Total Cost, Indication Match - Add computed vars for formatted KPI display values - Add placeholder KPI state variables (unique_patients, total_drugs, total_cost, indication_match_rate) - Use design system tokens for styling with hover effects - Responsive flex-wrap layout for smaller screens
This commit is contained in:
@@ -74,14 +74,14 @@ cd pathways_app && timeout 60 python -m reflex run 2>&1 | head -30
|
||||
- [x] Style according to design system
|
||||
|
||||
### 2.3 KPI Row
|
||||
- [ ] Create `kpi_card()` component:
|
||||
- [x] Create `kpi_card()` component:
|
||||
- Large mono number (32-48px)
|
||||
- Label below (caption style)
|
||||
- Subtle background tint
|
||||
- [ ] Create `kpi_row()` component with responsive grid
|
||||
- [ ] Initially show: Unique Patients count
|
||||
- [ ] Leave space for future metrics (Drugs count, Total cost, Match rate)
|
||||
- [ ] KPIs should be reactive to filter state
|
||||
- [x] Create `kpi_row()` component with responsive grid
|
||||
- [x] Initially show: Unique Patients count
|
||||
- [x] Leave space for future metrics (Drugs count, Total cost, Match rate)
|
||||
- [x] KPIs should be reactive to filter state
|
||||
|
||||
### 2.4 Chart Container
|
||||
- [ ] Create `chart_section()` component
|
||||
|
||||
Reference in New Issue
Block a user