feat(frontend): micro-interactions — page-enter transition + MetricTile lift
- Add animate-fade-up utility (reduced-motion aware) and a PageTransition wrapper; every dashboard view now rises + settles on mount/route change. - MetricTile gains a subtle hover lift (-translate-y) + ring-focus glow. - Theme toggle and command palette (⌘K) already existed and persist; no-op.
This commit is contained in:
@@ -0,0 +1,15 @@
|
||||
import { cn } from "@/lib/utils";
|
||||
|
||||
/**
|
||||
* Wraps a view's root so the whole panel stack rises + settles on mount.
|
||||
* The animation is disabled under prefers-reduced-motion via globals.css.
|
||||
*/
|
||||
export function PageTransition({
|
||||
children,
|
||||
className,
|
||||
}: {
|
||||
children: React.ReactNode;
|
||||
className?: string;
|
||||
}) {
|
||||
return <div className={cn("animate-fade-up", className)}>{children}</div>;
|
||||
}
|
||||
Reference in New Issue
Block a user