Issue-99: Refactor keyframes to be a transition

ProjectEvergreen · Oct 13, 2024 · d682779 · d682779
1 parent 2f38f36
commit d682779
Showing 1 changed file with 5 additions and 14 deletions.
diff --git a/src/components/side-nav/side-nav.module.css b/src/components/side-nav/side-nav.module.css
@@ -34,24 +34,15 @@
 
   & #indicator {
     display: inline-block;
+    transition: transform 1s ease;
   }
 }
 
-.compactMenu:has(#compact-menu:popover-open) {
-  & #indicator {
-    animation: rotateindicatoropen 1s ease;
-    animation-fill-mode: forwards;
-  }
+.compactMenu:not(:has(#compact-menu:popover-open)) #indicator {
+  transform: rotate(0deg);
 }
-
-@keyframes rotateindicatoropen {
-  from {
-    transform: rotate(0deg);
-  }
-
-  to {
-    transform: rotate(180deg);
-  }
+.compactMenu:has(#compact-menu:popover-open) #indicator {
+  transform: rotate(180deg);
 }
 
 .compactMenuPopover {