From fb705249bb08fadf60530ab8fbd2611ff05eecee Mon Sep 17 00:00:00 2001
From: Ivan <8611739+IRBorisov@users.noreply.github.com>
Date: Wed, 18 Jun 2025 10:16:26 +0300
Subject: [PATCH] M: Add animation to details element

---
 rsconcept/frontend/src/styling/setup.css | 23 +++++++++++++++++++----
 1 file changed, 19 insertions(+), 4 deletions(-)

diff --git a/rsconcept/frontend/src/styling/setup.css b/rsconcept/frontend/src/styling/setup.css
index 9698a7cf..b6f1e3d4 100644
--- a/rsconcept/frontend/src/styling/setup.css
+++ b/rsconcept/frontend/src/styling/setup.css
@@ -23,12 +23,12 @@
   }
 
   html {
+    interpolate-size: allow-keywords;
+
     text-size-adjust: none;
 
     hanging-punctuation: first last;
     color-scheme: dark light;
-
-    interpolate-size: allow-keywords;
   }
 
   body {
@@ -54,8 +54,6 @@
   }
 
   :root {
-    interpolate-size: allow-keywords;
-
     font-size: var(--font-size-base);
     line-height: var(--line-height);
     font-family: var(--font-main);
@@ -142,6 +140,23 @@
     content: '–\2009';
   }
 
+  details {
+    overflow: hidden;
+  }
+
+  details::details-content {
+    block-size: 0;
+
+    transition-property: block-size, content-visibility;
+    transition-duration: var(--duration-dropdown);
+    transition-timing-function: var(--ease-in-out);
+    transition-behavior: allow-discrete;
+  }
+
+  details[open]::details-content {
+    block-size: auto;
+  }
+
   summary {
     cursor: pointer;
     list-style: none;