monkeytypegame/monkeytype
1
1
Fork 0
mirror of https://github.com/monkeytypegame/monkeytype.git synced 2025-12-28 02:48:43 +08:00
Code Issues Projects Releases Packages Wiki Activity

fix(animation modal): animations stacking unnecessairly

Browse source
This commit is contained in:
Miodec 2025-11-18 17:23:44 +01:00
parent fa669fb274
commit 3454da18e0
1 changed files with 24 additions and 8 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

32
frontend/src/ts/utils/animated-modal.ts
View file

@ -248,6 +248,10 @@ export default class AnimatedModal<
this.focusFirstInput(options?.focusFirstInput);
}, 1);
const hasModalAnimation =
(options?.customAnimation?.modal ??
this.customHideAnimations?.modal) !== undefined;
const modalAnimation = options?.customAnimation?.modal ??
this.customShowAnimations?.modal ?? {
opacity: [0, 1],
@ -269,10 +273,14 @@ export default class AnimatedModal<
: options?.animationMode ?? "both";
if (animationMode === "both" || animationMode === "none") {
animate(this.modalEl, {
...modalAnimation,
duration: animationMode === "none" ? 0 : modalAnimationDuration,
});
if (hasModalAnimation) {
animate(this.modalEl, {
...modalAnimation,
duration: animationMode === "none" ? 0 : modalAnimationDuration,
});
} else {
this.modalEl.style.opacity = "1";
}
animate(this.wrapperEl, {
...wrapperAnimation,
@ -322,6 +330,10 @@ export default class AnimatedModal<
await options?.beforeAnimation?.(this.modalEl);
const hasModalAnimation =
(options?.customAnimation?.modal ??
this.customHideAnimations?.modal) !== undefined;
const modalAnimation = options?.customAnimation?.modal ??
this.customHideAnimations?.modal ?? {
opacity: [1, 0],
@ -351,10 +363,14 @@ export default class AnimatedModal<
: options?.animationMode ?? "both";
if (animationMode === "both" || animationMode === "none") {
animate(this.modalEl, {
...modalAnimation,
duration: animationMode === "none" ? 0 : modalAnimationDuration,
});
if (hasModalAnimation) {
animate(this.modalEl, {
...modalAnimation,
duration: animationMode === "none" ? 0 : modalAnimationDuration,
});
} else {
this.modalEl.style.opacity = "1";
}
animate(this.wrapperEl, {
...wrapperAnimation,