fix(css): animations

mbaraa · May 27, 2024 · 7145f51 · 7145f51
1 parent 09b75b8
commit 7145f51
Show file tree

Hide file tree

Showing 3 changed files with 6 additions and 2 deletions.
diff --git a/static/css/style.css b/static/css/style.css
@@ -13,18 +13,23 @@ table {
 * {
   --animation-duration: 0.4s;
   -webkit-transition:
+    all var(--animation-duration),
     background-color var(--animation-duration),
     opacity var(--animation-duration);
   -moz-transition:
+    all var(--animation-duration),
     background-color var(--animation-duration),
     opacity var(--animation-duration);
   -o-transition:
+    all var(--animation-duration),
     background-color var(--animation-duration),
     opacity var(--animation-duration);
   -ms-transition:
+    all var(--animation-duration),
     background-color var(--animation-duration),
     opacity var(--animation-duration);
   transition:
+    all var(--animation-duration),
     background-color var(--animation-duration),
     opacity var(--animation-duration);
 }

diff --git a/static/js/player.js b/static/js/player.js
@@ -420,8 +420,8 @@ function expand() {
 function collapse() {
   if (playerEl.classList.contains("exapnded")) {
     playerEl.classList.remove("exapnded");
-    expandedMobilePlayer.classList.add("hidden");
     collapsedMobilePlayer.classList.remove("hidden");
+    expandedMobilePlayer.classList.add("hidden");
   }
 }
 

diff --git a/views/components/player/mobile_player.templ b/views/components/player/mobile_player.templ
@@ -24,7 +24,6 @@ templ mobilePlayer() {
         .collapsed {
             height: 90px;
             max-height: 90px;
-            transition: max-height .5s;
         }
         .exapnded {
             height: 550px;