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:
asepharyana
2026-08-18 09:50:52 +07:00
parent d78d7a0181
commit 95f2903067
11 changed files with 72 additions and 12 deletions
+7 -1
View File
@@ -276,6 +276,11 @@
}
.animate-breathe { animation: breathe 3.5s ease-in-out infinite; }
/* Page-enter: subtle rise+settle. Respect reduced-motion (handled globally). */
.animate-fade-up {
animation: fade-up 0.4s cubic-bezier(0.22, 1, 0.36, 1) both;
}
@media (prefers-reduced-motion: reduce) {
.scan-line::after,
.scan-line,
@@ -283,7 +288,8 @@
.animate-spin-disc,
.animate-pulse-ring,
.animate-shimmer,
.animate-breathe {
.animate-breathe,
.animate-fade-up {
animation: none !important;
}
.scan-line {