web/SupportedServices: better popover animation

This commit is contained in:
wukko 2024-11-13 23:24:50 +06:00
parent 0e09bf9895
commit 3203f5bb2f
No known key found for this signature in database
GPG key ID: 3E30B3F26C7B4AA2

View file

@ -73,24 +73,29 @@
#services-popover { #services-popover {
display: flex; display: flex;
flex-direction: column; flex-direction: column;
transition: transform 0.2s cubic-bezier(0.53, 0.05, 0.23, 0.99);
border-radius: 18px; border-radius: 18px;
background: var(--button); background: var(--button);
box-shadow: box-shadow:
var(--button-box-shadow), var(--button-box-shadow),
0 0 10px 10px var(--button-stroke); 0 0 10px 10px var(--button-stroke);
transform: scale(0);
transform-origin: top center;
position: relative; position: relative;
padding: 12px; padding: 12px;
gap: 6px; gap: 6px;
top: 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 { #services-popover.expanded {
transform: scale(1); transform: scale(1);
opacity: 1;
} }
#services-button { #services-button {