diff --git a/components/about-page/Header.vue b/components/about-page/Header.vue index 27966eb..47b1b5c 100644 --- a/components/about-page/Header.vue +++ b/components/about-page/Header.vue @@ -1,95 +1,148 @@ @@ -315,17 +407,15 @@ onMounted(() => { \ No newline at end of file diff --git a/components/about-page/Map.vue b/components/about-page/Map.vue index 8d39c40..f5ef851 100644 --- a/components/about-page/Map.vue +++ b/components/about-page/Map.vue @@ -32,7 +32,7 @@ -
+

آدرس

-

+

@@ -94,7 +94,9 @@ /> -
+ + +
@@ -118,7 +120,7 @@

- { + if (window.innerWidth < 768) { + document.getElementById("dynamic").classList.remove("about") + } const panels = gsap.utils.toArray(".panel"); - gsap.set(panels, { xPercent: 0, yPercent: 100, autoAlpha: 1 }); - console.clear(); + gsap.set(panels, { xPercent: 0, yPercent: 100, autoAlpha: 2 }); + ctx = gsap.context((self) => { - - gsap.to("#crclrMotion", { scrollTrigger: { trigger: ".panel", @@ -247,11 +249,8 @@ onMounted(() => { start: "top 80%", end: () => "+=3000", - // "+=" + 150 * panels.length + "%", - // "+=" + document.querySelector(".about").getBoundingClientRect().width, scrub: 1, }, - // ease: pathEase("#motionPath"), // the ease of the snap animation ("power3" by default) motionPath: { path: "#aboutPath", align: "#aboutPath", @@ -272,29 +271,34 @@ onMounted(() => { yPercent: (i) => (i ? 140 : 0), }); const tl = gsap.timeline({ + defaults: { + duration: 1, + ease: "power1.inOut", + }, scrollTrigger: { trigger: ".about", start: "bottom center", end: () => "+=" + 40 * panels.length + "%", - // y: 50000, pin: true, scrub: 1, }, - y: 11000, + }); panels.forEach((panel, index) => { - if (index) { + tl.to( panel, { - y: -window.innerHeight * 0.001, - yPercent: 0, - ease: "none", + y:-window.innerHeight * 0.001, + yPercent: 0, }, - "+=0.25" - ); - } + "<", + ).to(panel,{ + autoAlpha: 0, + }) + + }); }); diff --git a/components/home-page/Header.vue b/components/home-page/Header.vue index 8f466cb..0a0cb4c 100644 --- a/components/home-page/Header.vue +++ b/components/home-page/Header.vue @@ -4,7 +4,38 @@ class="!max-w-[100vw] transform-bubbles header h-[76.923vw] lg:h-[48.802vw] text-white flex flex-col items-center" > + + + + + + + + + + + + + { ctx = gsap.context((self) => { + gsap.to(".rotating-bubbles", { scrollTrigger: { trigger: ".transform-bubbles", @@ -91,6 +134,18 @@ onMounted(() => { duration: 3, ease: "none", }); + gsap.to(".rotating-mobile", { + scrollTrigger: { + trigger: ".transform-bubbles", + scrub: 1, + start: "center center", + end: "+=200", + }, + rotation: 0, + duration: 3, + ease: "none", + }); + gsap.to(".animate #motion", { strokeDashoffset: 300, repeat: -1, @@ -99,9 +154,9 @@ onMounted(() => { }); gsap.to(".arrow", { strokeDashoffset: 300, - x: 700, - y: -130, - rotation: -90, + x: 700, + y: -130, + rotation: -90, scrollTrigger: { trigger: ".transform-bubbles", scrub: 1, diff --git a/components/home-page/RoadMap.vue b/components/home-page/RoadMap.vue index a43f10f..3162246 100644 --- a/components/home-page/RoadMap.vue +++ b/components/home-page/RoadMap.vue @@ -8,6 +8,7 @@ نقشه راه از تولید به مصرف محصولات شینان

+ + product-name

+ +
+ + + + + - - - - - - +
+
+ + + + + + + + + + + + +

@@ -107,7 +127,7 @@ onMounted(() => { scrub: true, pin: true, start: "center center", - end: "+=800vw", + end: "+=500vw", }, }) .from(".start", { @@ -118,7 +138,7 @@ onMounted(() => { trigger: "#flipSection", scrub: 1, start: "center center", - end: "+=800", + end: "+=350", }, rotation: 500, duration: 3, @@ -129,11 +149,11 @@ onMounted(() => { trigger: "#flipSection", scrub: 1, start: "center center", - end: "+=800", + end: "+=350vw", }, rotation: -500, duration: 3, - ease: "none", + ease: "slow(0.7,0.7,false)", }); }); diff --git a/components/honor-page/ShinanHonors.vue b/components/honor-page/ShinanHonors.vue index a58eec7..c1f3530 100644 --- a/components/honor-page/ShinanHonors.vue +++ b/components/honor-page/ShinanHonors.vue @@ -1,5 +1,5 @@