- Add responsive 2-panel layout (mobile single-col, tablet/desktop grid) - Unify specialization ranking with credit bars, status badges, and expandable allocation breakdowns (remove standalone ResultsDashboard) - Inline decision tree ceiling data on course buttons with spec counts - Add Clear All button to reset all course selections - Add collapsible CreditLegend explaining bars, badges, and limits - Extract ModeComparison and MutualExclusionWarnings to Notifications - Add useMediaQuery hook with matchMedia-based breakpoint detection
1.9 KiB
1.9 KiB
ADDED Requirements
Requirement: Specialization rows include credit progress
Each specialization row in the ranking list SHALL display the credit progress bar and allocated/threshold credits alongside the rank, name, and status badge. The row layout SHALL be: reorder controls, rank number, name, credits (e.g. "7.5 / 9.0"), status badge, with a credit bar below.
Scenario: Row displays allocated credits and bar
- WHEN a specialization has 7.5 allocated credits from pinned courses
- THEN the row SHALL show "7.5 / 9.0" and a credit progress bar filled to 7.5/9.0
Scenario: Row displays zero credits
- WHEN a specialization has no allocated credits
- THEN the row SHALL show "0 / 9.0" and an empty credit progress bar with the 9-credit threshold marker visible
Requirement: Expandable allocation breakdown
Achieved specialization rows SHALL be tappable/clickable to expand and show the allocation breakdown (which courses contribute how many credits).
Scenario: Tap to expand achieved spec
- WHEN a user taps an achieved specialization row
- THEN the row SHALL expand to show a list of contributing courses and their credit amounts
Scenario: Tap to collapse
- WHEN a user taps an already-expanded achieved specialization row
- THEN the allocation breakdown SHALL collapse
Scenario: Non-achieved specs are not expandable
- WHEN a user taps a specialization that is not achieved
- THEN nothing SHALL happen (no expand/collapse)
Requirement: Achievement summary
The panel SHALL display a summary count above the ranking list showing how many specializations are currently achieved.
Scenario: Some achieved
- WHEN 2 specializations are achieved
- THEN the panel SHALL display "2 specializations achieved"
Scenario: None achieved
- WHEN no specializations are achieved
- THEN the panel SHALL display "No specializations achieved yet"