diff --git a/src/components/MosaicModal.vue b/src/components/MosaicModal.vue index 0f12b28..726e39c 100644 --- a/src/components/MosaicModal.vue +++ b/src/components/MosaicModal.vue @@ -66,26 +66,30 @@ const closeWindow = ref() const tl = shallowRef() const ANIMATION_SETTINGS = { duration: 0.5, - ease: 'power3.out', + ease: 'expo.out', } onMounted(() => { tl.value = gsap.timeline() tl.value.fromTo( dlWindow.value, - { opacity: 0, height: 0 }, - { opacity: 1, height: 'auto', ...ANIMATION_SETTINGS }, + { opacity: 0, clipPath: 'inset(0% 0% 100% 0%)' }, + { opacity: 1, clipPath: 'inset(0% 0% 0% 0%)', ...ANIMATION_SETTINGS }, ) tl.value.fromTo( gifWindow.value, - { opacity: 0, height: 0 }, - { opacity: 1, height: 'auto', ...ANIMATION_SETTINGS }, + { opacity: 0, clipPath: 'inset(0% 0% 100% 0%)' }, + { + opacity: 1, + clipPath: 'inset(0% 0% 0% 0%)', + ...ANIMATION_SETTINGS, + }, '<+0.1', ) tl.value.fromTo( contentWindow.value, - { opacity: 0, height: 0 }, - { opacity: 1, height: 'auto', ...ANIMATION_SETTINGS }, + { opacity: 0, clipPath: 'inset(0% 0% 100% 0%)' }, + { opacity: 1, clipPath: 'inset(0% 0% 0% 0%)', ...ANIMATION_SETTINGS }, '<+0.1', ) tl.value.fromTo( diff --git a/src/components/strapi/Copy.vue b/src/components/strapi/Copy.vue index 14d709f..c672052 100644 --- a/src/components/strapi/Copy.vue +++ b/src/components/strapi/Copy.vue @@ -1,5 +1,5 @@