Creative.
Innovative.
Authentic.
-
+
Based in the beautiful city of Vienna, Austria, Tideshift aims
to create long lasting partnerships built on sustainable tech
and processes.
+
Whether you're just starting out as a business or you're an
enterprise, we will cater to your specific needs and provide
@@ -39,38 +40,41 @@ import { Picture } from "astro:assets";
source software.
-
+
+
+
diff --git a/src/components/landing/ContactSection.astro b/src/components/landing/ContactSection.astro
index 6a4a764..9665144 100644
--- a/src/components/landing/ContactSection.astro
+++ b/src/components/landing/ContactSection.astro
@@ -92,3 +92,100 @@ import ArrowUpRight from "../icons/ArrowUpRight.astro";
}
}
+
+
diff --git a/src/components/landing/HeroSection.astro b/src/components/landing/HeroSection.astro
index e892980..fac9dc9 100644
--- a/src/components/landing/HeroSection.astro
+++ b/src/components/landing/HeroSection.astro
@@ -125,23 +125,22 @@ import ArrowDown from "../icons/ArrowDown.astro";
const heroSection = document.querySelector(".hero");
if (heroSection) {
- const timeline = gsap.timeline().pause();
+ const tl = gsap.timeline().pause();
- timeline.from(heroSection.querySelector(".image"), {
- duration: 2,
- opacity: 0,
- // yPercent: 20,
- ease: "expo.out",
- });
+ tl.addLabel("heading", 0);
+ tl.addLabel("image", 0.2);
+ tl.addLabel("text", 0.8);
+ tl.addLabel("arrow", 1.5);
- timeline.from(
- heroSection.querySelector(".down"),
+ tl.from(
+ heroSection.querySelector(".image"),
{
- duration: 1,
+ duration: 2,
opacity: 0,
+ xPercent: 10,
ease: "expo.out",
},
- // ">-1",
+ "image",
);
new SplitText(heroSection.querySelector("h1"), {
@@ -150,7 +149,7 @@ import ArrowDown from "../icons/ArrowDown.astro";
mask: "chars",
charsClass: "char",
onSplit: (self) => {
- timeline.from(
+ tl.from(
self.chars,
{
duration: 1,
@@ -158,8 +157,9 @@ import ArrowDown from "../icons/ArrowDown.astro";
scale: 1.2,
stagger: 0.015,
ease: "expo.out",
+ onComplete: () => self.revert(),
},
- ">-2.8",
+ "heading",
);
},
});
@@ -170,19 +170,29 @@ import ArrowDown from "../icons/ArrowDown.astro";
mask: "lines",
linesClass: "line",
onSplit: (self) => {
- timeline
- .from(
- self.lines,
- {
- duration: 0.9,
- yPercent: 105,
- stagger: 0.06,
- ease: "expo.out",
- },
- ">-1",
- )
- .play();
+ tl.from(
+ self.lines,
+ {
+ duration: 0.9,
+ yPercent: 105,
+ stagger: 0.06,
+ ease: "expo.out",
+ onComplete: () => self.revert(),
+ },
+ "text",
+ ).play();
},
});
+
+ tl.from(
+ heroSection.querySelector(".down"),
+ {
+ duration: 1,
+ opacity: 0,
+ translateY: "-100%",
+ ease: "bounce.out",
+ },
+ "arrow",
+ );
}
diff --git a/src/components/landing/ServicesSection.astro b/src/components/landing/ServicesSection.astro
index 426b23c..4377ff7 100644
--- a/src/components/landing/ServicesSection.astro
+++ b/src/components/landing/ServicesSection.astro
@@ -47,7 +47,7 @@ const services: Array
> = [