heymlz/hossein-por-shop
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Fix bugs

Browse Source
This commit is contained in:
marzban-dev
2025-03-19 18:00:29 +03:30
parent d0a745a817
commit 211ecb6a8f
1 changed files with 14 additions and 14 deletions
Download Patch File Download Diff File Expand all files Collapse all files
frontend/components/home/Hero.vue
+14 -14
View File
@@ -32,7 +32,9 @@ let scrollTrigger: ScrollTrigger;
// methods // methods
const onSwiper = (swiper: SwiperClass) => { const onSwiper = (swiper: SwiperClass) => {
showLoadingOverlay.value = false; setTimeout(() => {
showLoadingOverlay.value = false;
}, 1000);
swiper_instance.value = swiper; swiper_instance.value = swiper;
}; };
@@ -70,11 +72,9 @@ const initializeGsapAnimation = () => {
}, { }, {
value: 1.2 value: 1.2
}, "=") }, "=")
.fromTo("#header-navbar", { .fromTo(".header-navbar-item", {
background: "transparent",
filter: "invert(100%)" filter: "invert(100%)"
}, { }, {
background: "transparent",
filter: "invert(0%)" filter: "invert(0%)"
}, "=") }, "=")
.fromTo("#header-navbar", { .fromTo("#header-navbar", {
@@ -96,7 +96,9 @@ const initializeGsapAnimation = () => {
const resetTimelineForMobile = () => { const resetTimelineForMobile = () => {
gsap.to("#header-navbar", { gsap.to("#header-navbar", {
background: "white", background: "white"
});
gsap.to(".header-navbar-item", {
filter: "invert(0%)" filter: "invert(0%)"
}); });
gsap.set(".header-slider-item", { gsap.set(".header-slider-item", {
@@ -113,6 +115,7 @@ onMounted(() => {
initializeGsapAnimation(); initializeGsapAnimation();
scrollTrigger = ScrollTrigger.create({ scrollTrigger = ScrollTrigger.create({
anticipatePin: 1,
trigger: "#header-slider-container", trigger: "#header-slider-container",
animation: gsapTimeline, animation: gsapTimeline,
scrub: 1, scrub: 1,
@@ -124,27 +127,23 @@ onMounted(() => {
const calculateOnResize = () => { const calculateOnResize = () => {
if (window.innerWidth > 768) { if (window.innerWidth > 768) {
gsap.to("#header-navbar", {
background: "transparent",
filter: "invert(100%)"
});
scrollTrigger.enable(); scrollTrigger.enable();
} else { } else {
resetTimelineForMobile(); resetTimelineForMobile();
scrollTrigger.disable(); scrollTrigger.disable();
} }
} };
setTimeout(() => { setTimeout(() => {
calculateOnResize() calculateOnResize();
}, 100); }, 100);
setTimeout(() => { setTimeout(() => {
calculateOnResize() calculateOnResize();
}, 200); }, 200);
window.addEventListener("resize", () => { window.addEventListener("resize", () => {
calculateOnResize() calculateOnResize();
}); });
}); });
@@ -213,7 +212,8 @@ onUnmounted(() => {
<div class="flex items-center gap-4 lg:gap-8"> <div class="flex items-center gap-4 lg:gap-8">
<div <div
class="hover:scale-110 size-[36px] md:size-[42px] lg:size-[50px] relative flex items-center justify-center"> class="hover:scale-110 size-[36px] md:size-[42px] lg:size-[50px] relative flex items-center justify-center">
<div class="size-full scale-75 bg-white absolute rounded-full animate-ping" /> <div
class="size-full scale-75 bg-white absolute rounded-full animate-ping" />
<button <button
@click="isMuted = !isMuted" @click="isMuted = !isMuted"
class="transition-all cursor-pointer flex-center bg-white z-10 size-full rounded-full" class="transition-all cursor-pointer flex-center bg-white z-10 size-full rounded-full"