## Why ### Problem Cards across the app lacked visual interactivity. Adding a cursor-tracking glowing border effect improves the UI polish and makes the dashboard and other card-heavy pages feel more dynamic. ## What ### Changes - Install `motion` package (required for the `animate()` call in the effect) - Add `GlowingEffect` component at `resources/js/components/ui/glowing-effect.tsx` — tracks pointer position and renders an animated conic gradient border that follows the cursor - Update the base `Card` primitive to include `<GlowingEffect>` as the first child with `spread=40`, `proximity=64`, `inactiveZone=0.01`, `glow=true` — all consumers inherit the effect automatically - Remove `overflow-hidden` from the net-worth chart's `<Card>` (it was clipping the effect) and move it to `<CardContent>` where it's actually needed to contain the chart ## Verification ### Tests No new logic was introduced — this is a purely visual enhancement to an existing UI primitive. Existing tests remain unaffected. ### Manual Move the cursor near and over any card (dashboard stats, account balances, net worth chart, cashflow, budgets) to see the gradient border glow follow the cursor. |
||
|---|---|---|
| .. | ||
| css | ||
| js | ||
| views | ||