fix breathing animation

This commit is contained in:
Rhiannon Morris 2025-02-16 16:23:46 +01:00
parent 186b02a132
commit 732e5a3d47

View file

@ -107,7 +107,7 @@ html {
--side: min(65vh, 70vw); --side: min(65vh, 70vw);
--half: calc(var(--side) * .5); --half: calc(var(--side) * .5);
--nhalf: calc(0em - var(--half)); --nhalf: calc(0em - var(--half));
--breathe: calc(var(--side) * .1); --breathe: calc(var(--side) * 0.02);
} }
#outer { #outer {
@ -135,14 +135,12 @@ html {
overscroll-behavior: contain; overscroll-behavior: contain;
} }
@supports (scrollbar-color: pink orange) { /* safari detector */ #cube:not([data-moving]) > section:not([data-state=active]) {
#cube:not([data-moving]) > section { animation: breathe 7.5s infinite ease-in-out;
animation: breathe 9s infinite ease-in-out;
} }
@keyframes breathe { @keyframes breathe {
35% { transform: translateZ(var(--breathe)) var(--base-transform); } 40% { transform: var(--base-transform) translateZ(var(--breathe)); }
}
} }
@media (prefers-reduced-motion: no-preference) { @media (prefers-reduced-motion: no-preference) {