From 3203f5bb2feedae639c4766b78488ecc6a402bc2 Mon Sep 17 00:00:00 2001
From: wukko <me@wukko.me>
Date: Wed, 13 Nov 2024 23:24:50 +0600
Subject: [PATCH] web/SupportedServices: better popover animation

---
 web/src/components/save/SupportedServices.svelte | 13 +++++++++----
 1 file changed, 9 insertions(+), 4 deletions(-)

diff --git a/web/src/components/save/SupportedServices.svelte b/web/src/components/save/SupportedServices.svelte
index bb1251af..099fefa6 100644
--- a/web/src/components/save/SupportedServices.svelte
+++ b/web/src/components/save/SupportedServices.svelte
@@ -73,24 +73,29 @@
     #services-popover {
         display: flex;
         flex-direction: column;
-        transition: transform 0.2s cubic-bezier(0.53, 0.05, 0.23, 0.99);
         border-radius: 18px;
         background: var(--button);
         box-shadow:
             var(--button-box-shadow),
             0 0 10px 10px var(--button-stroke);
 
-        transform: scale(0);
-        transform-origin: top center;
         position: relative;
-
         padding: 12px;
         gap: 6px;
         top: 6px;
+
+        opacity: 0;
+        transform: scale(0);
+        transform-origin: top center;
+
+        transition:
+            transform 0.2s cubic-bezier(0.53, 0.05, 0.23, 0.99),
+            opacity 0.2s cubic-bezier(0.53, 0.05, 0.23, 0.99);
     }
 
     #services-popover.expanded {
         transform: scale(1);
+        opacity: 1;
     }
 
     #services-button {