style/collapsible widget: fade content when expanding or collapsing

2026-02-05 21:34:23 +01:00 · 2026-02-03 03:03:50 +02:00 · 2026-02-03 03:03:50 +02:00 · 38489dbfeb
commit 38489dbfeb
parent ff2a3d6a28
1 changed files with 9 additions and 0 deletions
--- a/apps/client/src/widgets/react/Collapsible.css
+++ b/apps/client/src/widgets/react/Collapsible.css
@ -25,17 +25,26 @@

    .collapsible-inner-body {
        padding-top: 0.5em;
+        opacity: 0;
    }

    &.expanded {
        .collapsible-title .arrow {
            transform: rotate(90deg);
        }
+
+        .collapsible-inner-body {
+            opacity: 1;
+        }
    }

    &.with-transition {
        .collapsible-body {
            transition: height 250ms ease-in;
        }
+
+        .collapsible-inner-body {
+            transition: opacity 250ms ease-in;
+        }
    }
 }