Extract inline styles to CSS classes
Move JavaScript style objects from home page components into reusable
CSS classes in App.css. This follows the existing pattern (intel-button,
intel-card, intel-input) and consolidates all visual styling in one place.
New CSS classes added:
- .panel-card (--accent, --warning, --teal) — sidebar panels
- .section-heading (--accent, --warning, --teal) — monospace headings
- .stat-card modifiers (--clickable, --active, --warning, --danger)
- .stat-card__label / .stat-card__value (--accent, --neutral, etc.)
- .severity-badge (--critical, --high, --medium, --low)
- .glow-dot (--critical, --high, --medium, --low)
- .sidebar-ticket — compact ticket cards
- .workflow-item — Ivanti workflow entries
- .workflow-state-badge — teal state pill
- .ticket-status-badge — small status indicator
- .archive-item (--active, --resolved) — finding archive entries
- .big-counter (--warning, --teal) — large centered stat numbers
Benefits:
- 578 fewer lines of JavaScript across components
- Styles are browser-cached separately from JS bundle
- Single source of truth for the design system
- Easier to update colors/spacing project-wide