Merge version_16 into main

Update src/app/page.tsx
2026-05-09 16:50:43 +00:00 · 2026-05-09 16:50:37 +00:00 · 2026-05-09 16:04:01 +00:00 · 2026-05-09 16:03:58 +00:00 · 2026-05-09 16:03:57 +00:00 · 2026-05-09 16:03:57 +00:00
4 changed files with 152 additions and 103 deletions
--- a/src/app/about/page.tsx
+++ b/src/app/about/page.tsx
@@ -0,0 +1,62 @@
+"use client";
+
+import ReactLenis from "lenis/react";
+import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
+import NavbarLayoutFloatingInline from "@/components/navbar/NavbarLayoutFloatingInline";
+import AboutMetric from "@/components/sections/about/AboutMetric";
+import { Users, Globe, Zap } from "lucide-react";
+import FooterLogoReveal from "@/components/sections/footer/FooterLogoReveal";
+
+export default function AboutPage() {
+    const navItems = [
+        { name: "Home", id: "/" },
+        { name: "Services", id: "services" },
+        { name: "Work", id: "work" },
+        { name: "About", id: "/about" },
+        { name: "Contact", id: "/contact" },
+    ];
+
+    return (
+        <ThemeProvider
+            defaultButtonVariant="icon-arrow"
+            defaultTextAnimation="entrance-slide"
+            borderRadius="pill"
+            contentWidth="medium"
+            sizing="medium"
+            background="aurora"
+            cardStyle="layered-gradient"
+            primaryButtonStyle="gradient"
+            secondaryButtonStyle="glass"
+            headingFontWeight="medium"
+        >
+            <ReactLenis root>
+                <div id="nav" data-section="nav">
+                    <NavbarLayoutFloatingInline
+                        navItems={navItems}
+                        brandName="Studio"
+                        button={{ text: "Get in Touch", href: "/contact" }}
+                    />
+                </div>
+                <div id="about" data-section="about">
+                    <AboutMetric
+                        title="Our Story"
+                        metrics={[
+                            { icon: Users, label: "Team Members", value: "40+" },
+                            { icon: Globe, label: "Countries", value: "15" },
+                            { icon: Zap, label: "Projects", value: "500+" }
+                        ]}
+                        metricsAnimation="slide-up"
+                        useInvertedBackground={false}
+                    />
+                </div>
+                <div id="footer" data-section="footer">
+                    <FooterLogoReveal
+                        logoText="Studio"
+                        leftLink={{ text: "Privacy", href: "/privacy" }}
+                        rightLink={{ text: "Terms", href: "/terms" }}
+                    />
+                </div>
+            </ReactLenis>
+        </ThemeProvider>
+    );
+}
--- a/src/app/contact/page.tsx
+++ b/src/app/contact/page.tsx
@@ -0,0 +1,61 @@
+"use client";
+
+import ReactLenis from "lenis/react";
+import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
+import NavbarLayoutFloatingInline from "@/components/navbar/NavbarLayoutFloatingInline";
+import ContactCTA from "@/components/sections/contact/ContactCTA";
+import FooterLogoReveal from "@/components/sections/footer/FooterLogoReveal";
+
+export default function ContactPage() {
+    const navItems = [
+        { name: "Home", id: "/" },
+        { name: "Services", id: "services" },
+        { name: "Work", id: "work" },
+        { name: "About", id: "/about" },
+        { name: "Contact", id: "/contact" },
+    ];
+
+    return (
+        <ThemeProvider
+            defaultButtonVariant="icon-arrow"
+            defaultTextAnimation="entrance-slide"
+            borderRadius="pill"
+            contentWidth="medium"
+            sizing="medium"
+            background="aurora"
+            cardStyle="layered-gradient"
+            primaryButtonStyle="gradient"
+            secondaryButtonStyle="glass"
+            headingFontWeight="medium"
+        >
+            <ReactLenis root>
+                <div id="nav" data-section="nav">
+                    <NavbarLayoutFloatingInline
+                        navItems={navItems}
+                        brandName="Studio"
+                        button={{ text: "Get Started", href: "/contact" }}
+                    />
+                </div>
+                <div id="contact" data-section="contact">
+                    <ContactCTA
+                        tag="Contact Us"
+                        title="Let's Build Something Great"
+                        description="Reach out to discuss your project and see how we can help your brand grow."
+                        buttons={[
+                            { text: "Send Message", href: "#" }
+                        ]}
+                        background={{ variant: "canvas-reveal" }}
+                        useInvertedBackground={false}
+                    />
+                </div>
+                <div id="footer" data-section="footer">
+                    <FooterLogoReveal
+                        logoText="Studio"
+                        leftLink={{ text: "Privacy", href: "/privacy" }}
+                        rightLink={{ text: "Terms", href: "/terms" }}
+                    />
+                </div>
+            </ReactLenis>
+        </ThemeProvider>
+    );
+}
--- a/src/app/page.tsx
+++ b/src/app/page.tsx
@@ -19,7 +19,8 @@ export default function WebAgencyThemePage() {
        { name: "Home", id: "home" },
        { name: "Services", id: "services" },
        { name: "Work", id: "work" },
-        { name: "Contact", id: "contact" },
+        { name: "About", id: "/about" },
+        { name: "Contact", id: "/contact" },
    ];

    return (
@@ -39,7 +40,7 @@ export default function WebAgencyThemePage() {
                <NavbarLayoutFloatingInline
                    navItems={navItems}
                    brandName="Studio"
-                    button={{ text: "Get in Touch", href: "#contact" }}
+                    button={{ text: "Get in Touch", href: "/contact" }}
                />
                <HeroSplitKpi
                    background={{ variant: "radial-gradient" }}
@@ -55,13 +56,9 @@ export default function WebAgencyThemePage() {
                    ]}
                    buttons={[
                        {
-                            text: "Start Project",
-                            href: "#contact",
-                        },
+                            text: "Start Project",                            href: "/contact"},
                        {
-                            text: "View Work",
-                            href: "#work",
-                        },
+                            text: "View Work",                            href: "#work"},
                    ]}
                    avatars={[
                        { src: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/web-agency/hero/hero2.webp", alt: "Team member 1" },
@@ -87,14 +84,14 @@ export default function WebAgencyThemePage() {
                    ]}
                    marqueeClassName="md:mb-5"
                />
-                <TextAbout
+                <div id="services"><TextAbout
                    title="We craft digital experiences that captivate audiences and drive meaningful results for ambitious brands worldwide."
                    buttons={[
                        { text: "Our Process", href: "#process" },
                        { text: "Meet the Team", href: "#team" },
                    ]}
                    useInvertedBackground={false}
-                />
+                /></div>
                <FeatureCardNineteen
                    title="Our Services"
                    description="A proven methodology that delivers results consistently across every project."
@@ -102,37 +99,13 @@ export default function WebAgencyThemePage() {
                    tagIcon={Layers}
                    features={[
                        {
-                            tag: "Service 01",
-                            title: "01",
-                            subtitle: "Web Development",
-                            description: "Your website should be more than functional—it should resonate. We craft bespoke digital experiences that merge innovation with creativity, delivering intuitive, visually stunning platforms that captivate audiences, reflect your brand's essence, and adapt to future opportunities.",
-                            imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/web-agency/process/process1.webp",
-                            imageAlt: "Web development",
-                        },
+                            tag: "Service 01",                            title: "01",                            subtitle: "Web Development",                            description: "Build high-performance, custom websites that boost engagement, scale with your traffic, and turn casual visitors into loyal customers.",                            imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/web-agency/process/process1.webp",                            imageAlt: "Web development"},
                        {
-                            tag: "Service 02",
-                            title: "02",
-                            subtitle: "Marketing",
-                            description: "Impactful marketing goes beyond visibility—it creates connections. We fuse creativity with analytics to craft adaptive strategies that engage your audience authentically, keeping your brand relevant and resonant while delivering measurable results in an ever-evolving digital world.",
-                            imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/web-agency/process/process2.webp",
-                            imageAlt: "Marketing",
-                        },
+                            tag: "Service 02",                            title: "02",                            subtitle: "Marketing",                            description: "Execute data-driven campaigns that amplify your reach, lower your acquisition costs, and maximize your return on ad spend.",                            imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/web-agency/process/process2.webp",                            imageAlt: "Marketing"},
                        {
-                            tag: "Service 03",
-                            title: "03",
-                            subtitle: "Design",
-                            description: "Design is your brand's voice. We craft visuals and layouts that communicate purpose, inspire trust, and connect emotionally. By harmonizing artistry with intent, our designs transform user interactions into meaningful, memorable experiences that align with your identity.",
-                            imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/web-agency/process/process3.webp",
-                            imageAlt: "Design",
-                        },
+                            tag: "Service 03",                            title: "03",                            subtitle: "Design",                            description: "Create striking brand visuals that differentiate you from competitors and build instant trust with your target audience.",                            imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/web-agency/process/process3.webp",                            imageAlt: "Design"},
                        {
-                            tag: "Service 04",
-                            title: "04",
-                            subtitle: "Software Development",
-                            description: "We build custom software that evolves with your business. By addressing unique challenges, our tailored solutions streamline workflows, eliminate inefficiencies, and foster innovation—empowering you to scale, adapt, and maintain a competitive edge in an ever-changing landscape.",
-                            imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/web-agency/process/process4.webp",
-                            imageAlt: "Software development",
-                        },
+                            tag: "Service 04",                            title: "04",                            subtitle: "Software Development",                            description: "Develop secure, scalable software solutions that streamline your operations and unlock new revenue streams for your business.",                            imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/web-agency/process/process4.webp",                            imageAlt: "Software development"},
                    ]}
                    textboxLayout="default"
                    useInvertedBackground={false}
@@ -159,53 +132,13 @@ export default function WebAgencyThemePage() {
                    tagIcon={Star}
                    testimonials={[
                        {
-                            id: "1",
-                            name: "Sarah Johnson",
-                            date: "CEO, TechStart",
-                            title: "Transformed Our Digital Presence",
-                            quote: "Working with Studio was a game-changer for our startup. They delivered a website that not only looks stunning but converts visitors into customers at twice our previous rate.",
-                            tag: "Web Development",
-                            avatarSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/web-agency/hero/hero2.webp",
-                            avatarAlt: "Sarah Johnson",
-                            imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/web-agency/hero/hero2.webp",
-                            imageAlt: "TechStart project showcase",
-                        },
+                            id: "1",                            name: "Sarah Johnson",                            date: "CEO, TechStart",                            title: "Transformed Our Digital Presence",                            quote: "Working with Studio was a game-changer for our startup. They delivered a website that not only looks stunning but converts visitors into customers at twice our previous rate.",                            tag: "Web Development",                            avatarSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/web-agency/hero/hero2.webp",                            avatarAlt: "Sarah Johnson",                            imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/web-agency/hero/hero2.webp",                            imageAlt: "TechStart project showcase"},
                        {
-                            id: "2",
-                            name: "Michael Chen",
-                            date: "Founder, GrowthLab",
-                            title: "Exceeded All Expectations",
-                            quote: "The team's attention to detail and creative vision brought our brand to life in ways we never imagined. Our new platform has received incredible feedback from users.",
-                            tag: "Brand Design",
-                            avatarSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/web-agency/hero/hero3.webp",
-                            avatarAlt: "Michael Chen",
-                            imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/web-agency/hero/hero3.webp",
-                            imageAlt: "GrowthLab project showcase",
-                        },
+                            id: "2",                            name: "Michael Chen",                            date: "Founder, GrowthLab",                            title: "Exceeded All Expectations",                            quote: "The team's attention to detail and creative vision brought our brand to life in ways we never imagined. Our new platform has received incredible feedback from users.",                            tag: "Brand Design",                            avatarSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/web-agency/hero/hero3.webp",                            avatarAlt: "Michael Chen",                            imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/web-agency/hero/hero3.webp",                            imageAlt: "GrowthLab project showcase"},
                        {
-                            id: "3",
-                            name: "Emily Rodriguez",
-                            date: "Marketing Director, Elevate",
-                            title: "A True Partnership",
-                            quote: "From strategy to execution, Studio understood our vision and delivered beyond what we hoped for. The new website has become our most powerful marketing asset.",
-                            tag: "E-commerce",
-                            avatarSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/web-agency/hero/hero4.webp",
-                            avatarAlt: "Emil Svenson",
-                            imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/web-agency/hero/hero4.webp",
-                            imageAlt: "Elevate project showcase",
-                        },
+                            id: "3",                            name: "Emily Rodriguez",                            date: "Marketing Director, Elevate",                            title: "A True Partnership",                            quote: "From strategy to execution, Studio understood our vision and delivered beyond what we hoped for. The new website has become our most powerful marketing asset.",                            tag: "E-commerce",                            avatarSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/web-agency/hero/hero4.webp",                            avatarAlt: "Emil Svenson",                            imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/web-agency/hero/hero4.webp",                            imageAlt: "Elevate project showcase"},
                        {
-                            id: "4",
-                            name: "David Park",
-                            date: "CTO, InnovateCo",
-                            title: "Technical Excellence",
-                            quote: "The development team delivered a high-performance application that handles our complex requirements with ease. Their technical expertise is unmatched in the industry.",
-                            tag: "Web Application",
-                            avatarSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/web-agency/hero/hero5.webp",
-                            avatarAlt: "David Park",
-                            imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/web-agency/hero/hero5.webp",
-                            imageAlt: "InnovateCo project showcase",
-                        },
+                            id: "4",                            name: "David Park",                            date: "CTO, InnovateCo",                            title: "Technical Excellence",                            quote: "The development team delivered a high-performance application that handles our complex requirements with ease. Their technical expertise is unmatched in the industry.",                            tag: "Web Application",                            avatarSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/web-agency/hero/hero5.webp",                            avatarAlt: "David Park",                            imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/web-agency/hero/hero5.webp",                            imageAlt: "InnovateCo project showcase"},
                    ]}
                    textboxLayout="default"
                    useInvertedBackground={false}
@@ -220,9 +153,7 @@ export default function WebAgencyThemePage() {
                    useInvertedBackground={false}
                    features={[
                        {
-                            title: "Discovery & Strategy",
-                            description: "We start by understanding your goals, audience, and market to build a roadmap tailored to your business.",
-                            media: { imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/web-agency/services/how1.webp", imageAlt: "Discovery and strategy" },
+                            title: "Discovery & Strategy",                            description: "We start by understanding your goals, audience, and market to build a roadmap tailored to your business.",                            media: { imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/web-agency/services/how1.webp", imageAlt: "Discovery and strategy" },
                            reverse: false,
                            items: [
                                { icon: Code, text: "In-depth research and audits" },
@@ -231,9 +162,7 @@ export default function WebAgencyThemePage() {
                            ],
                        },
                        {
-                            title: "Design & Prototyping",
-                            description: "We translate strategy into visual concepts, iterating with you until every detail feels right.",
-                            media: { imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/web-agency/services/how2.webp", imageAlt: "Design and prototyping" },
+                            title: "Design & Prototyping",                            description: "We translate strategy into visual concepts, iterating with you until every detail feels right.",                            media: { imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/web-agency/services/how2.webp", imageAlt: "Design and prototyping" },
                            reverse: true,
                            items: [
                                { icon: Palette, text: "Wireframes and mockups" },
@@ -242,9 +171,7 @@ export default function WebAgencyThemePage() {
                            ],
                        },
                        {
-                            title: "Build & Launch",
-                            description: "We develop, test, and deploy your project with precision, ensuring a smooth launch and measurable impact.",
-                            media: { imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/web-agency/services/how3.webp", imageAlt: "Build and launch" },
+                            title: "Build & Launch",                            description: "We develop, test, and deploy your project with precision, ensuring a smooth launch and measurable impact.",                            media: { imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/web-agency/services/how3.webp", imageAlt: "Build and launch" },
                            reverse: false,
                            items: [
                                { icon: TrendingUp, text: "Agile development sprints" },
@@ -257,8 +184,7 @@ export default function WebAgencyThemePage() {
                <ContactText
                    text="Ready to transform your digital presence? Let's create something extraordinary together."
                    buttons={[
-                        { text: "Start a Project", href: "#contact" },
-                        { text: "Schedule a Call", href: "#call" },
+                        { text: "Start Your Transformation", href: "/contact" },
                    ]}
                    background={{ variant: "canvas-reveal" }}
                    useInvertedBackground={false}
@@ -275,4 +201,4 @@ export default function WebAgencyThemePage() {
            </ReactLenis>
        </ThemeProvider>
    );
-}
+}
--- a/src/app/styles/variables.css
+++ b/src/app/styles/variables.css
@@ -10,15 +10,15 @@
  --accent: #ffffff;
  --background-accent: #ffffff; */

-  --background: #ffffff;
-  --card: #f9f9f9;
-  --foreground: #120a00e6;
-  --primary-cta: #ff8c42;
-  --primary-cta-text: #ffffff;
-  --secondary-cta: #f9f9f9;
-  --secondary-cta-text: #120a00e6;
-  --accent: #e2e2e2;
-  --background-accent: #c4c4c4;
+  --background: #000000;
+  --card: #1f4035;
+  --foreground: #ffffff;
+  --primary-cta: #ffffff;
+  --primary-cta-text: #051a12;
+  --secondary-cta: #0d2b1f;
+  --secondary-cta-text: #d4f6e8;
+  --accent: #0d5238;
+  --background-accent: #10b981;

  /* text sizing - set by ThemeProvider */
  /* --text-2xs: clamp(0.465rem, 0.62vw, 0.62rem);
Author	SHA1	Message	Date
bender	7b75da6542	Merge version_16 into main Merge version_16 into main	2026-05-09 16:50:43 +00:00
bender	bc76521648	Update src/app/page.tsx	2026-05-09 16:50:37 +00:00
bender	e501a8f2b7	Merge version_15 into main Merge version_15 into main	2026-05-09 16:04:01 +00:00
bender	f66aa09853	Update src/app/page.tsx	2026-05-09 16:03:58 +00:00
bender	d11f179552	Update src/app/contact/page.tsx	2026-05-09 16:03:57 +00:00
bender	17dcbfbba0	Add src/app/about/page.tsx	2026-05-09 16:03:57 +00:00
bender	e498b64a01	Merge version_14 into main Merge version_14 into main	2026-05-09 12:08:01 +00:00
bender	691c7eb94f	Update src/app/page.tsx	2026-05-09 12:07:58 +00:00
bender	81bc508916	Merge version_13 into main Merge version_13 into main	2026-05-09 12:07:05 +00:00
bender	d3bd81dda5	Update src/app/contact/page.tsx	2026-05-09 12:06:59 +00:00
bender	814fe97805	Merge version_13 into main Merge version_13 into main	2026-05-09 12:06:37 +00:00
bender	815fab03a3	Update src/app/contact/page.tsx	2026-05-09 12:06:34 +00:00
bender	991fea1dfc	Merge version_13 into main Merge version_13 into main	2026-05-09 12:06:13 +00:00
bender	f1d5a306bf	Update src/app/page.tsx	2026-05-09 12:06:10 +00:00
bender	c65b1d167a	Add src/app/contact/page.tsx	2026-05-09 12:06:09 +00:00
bender	2ee8e7df0e	Merge version_12 into main Merge version_12 into main	2026-05-09 12:04:22 +00:00
bender	6af39260c2	Update theme colors	2026-05-09 12:04:16 +00:00
bender	875281424f	Merge version_11 into main Merge version_11 into main	2026-05-09 12:04:13 +00:00
bender	f9bcd78136	Update theme colors	2026-05-09 12:04:10 +00:00
bender	d58099aefb	Merge version_10 into main Merge version_10 into main	2026-05-09 12:04:07 +00:00
bender	13d0d74298	Update theme colors	2026-05-09 12:04:04 +00:00
bender	4fd75e4351	Merge version_9 into main Merge version_9 into main	2026-05-09 11:42:15 +00:00
bender	427e63b534	Update theme colors	2026-05-09 11:42:12 +00:00
bender	3071073ddc	Merge version_8 into main Merge version_8 into main	2026-05-09 11:41:47 +00:00
bender	3fbc301dce	Update theme colors	2026-05-09 11:41:41 +00:00
bender	7a3c132f58	Merge version_7 into main Merge version_7 into main	2026-05-09 11:41:35 +00:00
bender	f1a43a8479	Merge version_6 into main Merge version_6 into main	2026-05-09 11:41:07 +00:00
bender	65d670a57c	Merge version_5 into main Merge version_5 into main	2026-05-09 11:40:54 +00:00
bender	bb8c55b511	Merge version_4 into main Merge version_4 into main	2026-05-09 11:40:42 +00:00
bender	519ed25702	Merge version_3 into main Merge version_3 into main	2026-05-09 11:40:02 +00:00
bender	0c9834e21a	Merge version_2 into main Merge version_2 into main	2026-05-09 11:39:57 +00:00