feat: add fade in

2024-12-16 15:17:41 +01:00
parent 06d2dddb1b
commit 63055bcd65
9 changed files with 67 additions and 4 deletions
--- a/packages/base/Resources/Public/Scss/abstracts/_fade-in.scss
+++ b/packages/base/Resources/Public/Scss/abstracts/_fade-in.scss
@@ -0,0 +1,19 @@
+.fade-in-hidden {
+  opacity: 0;
+  transform: translateY(1.5rem);
+  transition: opacity 0.5s ease-out, transform 0.5s ease-out;
+}
+.fade-in-visible {
+  opacity: 1;
+  transform: translateY(0);
+}
+
+/* Respect prefers-reduced-motion: reduce (for accessibility).
+   If user prefers reduced motion, override transitions. */
+@media (prefers-reduced-motion: reduce) {
+  .fade-in-hidden {
+    opacity: 1;
+    transform: none;
+    transition: none;
+  }
+}