27 Commits

Author SHA1 Message Date
63fb7b96f2 Update theme fonts 2026-05-29 22:31:43 +00:00
af161eb859 Update theme fonts 2026-05-29 22:31:43 +00:00
9460840d2f Update theme fonts 2026-05-29 22:31:36 +00:00
9cdcbf8c53 Update theme fonts 2026-05-29 22:31:36 +00:00
284aa11df3 Update theme fonts 2026-05-29 22:31:29 +00:00
cb056ccfa4 Update theme fonts 2026-05-29 22:31:28 +00:00
90a6358aef Update theme fonts 2026-05-29 22:31:22 +00:00
fe81af58b9 Update theme fonts 2026-05-29 22:31:22 +00:00
f1d0c545fa Update theme fonts 2026-05-29 22:31:17 +00:00
149fbaa49e Update theme fonts 2026-05-29 22:31:17 +00:00
cebf789349 Update theme fonts 2026-05-29 22:30:59 +00:00
65fea05fa4 Update theme fonts 2026-05-29 22:30:59 +00:00
cfd49b3eb8 Update theme fonts 2026-05-29 22:30:53 +00:00
0a2cf31d91 Update theme fonts 2026-05-29 22:30:52 +00:00
208c49e312 Remove watermark 2026-05-29 22:27:00 +00:00
63c44ceaa1 Update src/app/styles/variables.css 2026-05-29 22:26:39 +00:00
9869bf2af2 Update src/app/page.tsx 2026-05-29 22:26:39 +00:00
b5084573fa Merge version_3 into main
Merge version_3 into main
2026-05-29 22:06:39 +00:00
066dd9f8af Update src/app/styles/variables.css 2026-05-29 22:06:36 +00:00
fd6a882183 Update src/app/page.tsx 2026-05-29 22:06:35 +00:00
f0b14758f9 Merge version_2 into main
Merge version_2 into main
2026-05-29 21:58:52 +00:00
abb800fd86 Update src/app/page.tsx 2026-05-29 21:58:46 +00:00
e4d16de789 Merge version_2 into main
Merge version_2 into main
2026-05-29 21:58:10 +00:00
fb5c93b12c Update src/app/styles/variables.css 2026-05-29 21:58:07 +00:00
36333641b8 Update src/app/styles/base.css 2026-05-29 21:58:07 +00:00
bf78b30439 Update src/app/page.tsx 2026-05-29 21:58:07 +00:00
6c7f475d40 Update src/app/layout.tsx 2026-05-29 21:58:06 +00:00
4 changed files with 122 additions and 271 deletions

View File

@@ -4,25 +4,37 @@ import { Inter } from "next/font/google";
import "./globals.css"; import "./globals.css";
import "@/lib/gsap-setup"; import "@/lib/gsap-setup";
import { ServiceWrapper } from "@/components/ServiceWrapper"; import { ServiceWrapper } from "@/components/ServiceWrapper";
import Tag from "@/tag/Tag";
import { getVisualEditScript } from "@/utils/visual-edit-script"; import { getVisualEditScript } from "@/utils/visual-edit-script";
import { Open_Sans } from "next/font/google";
import { Manrope } from "next/font/google";
import { DM_Sans } from "next/font/google";
import { Poppins } from "next/font/google";
import { Roboto } from "next/font/google";
import { Archivo } from "next/font/google";
const halant = Halant({
variable: "--font-halant",
subsets: ["latin"],
weight: ["300", "400", "500", "600", "700"],
});
const inter = Inter({
variable: "--font-inter",
subsets: ["latin"],
});
export const metadata: Metadata = { export const metadata: Metadata = {
title: 'PixelForge Digital: Creative Web Agency', title: 'PixelForge Digital: Creative Web Agency',
description: 'PixelForge Digital crafts stunning, high-performance websites that captivate audiences and drive results. Elevate your online presence with our expert web design and development services.', description: 'PixelForge Digital crafts stunning, high-performance websites that captivate audiences and drive results. Elevate your online presence with our expert web design and development services.',
}; };
const dmSans = DM_Sans({
variable: "--font-dm-sans",
subsets: ["latin"],
});
const inter = Inter({
variable: "--font-inter",
subsets: ["latin"],
});
export default function RootLayout({ export default function RootLayout({
children, children,
}: Readonly<{ }: Readonly<{
@@ -31,10 +43,8 @@ export default function RootLayout({
return ( return (
<html lang="en" suppressHydrationWarning> <html lang="en" suppressHydrationWarning>
<ServiceWrapper> <ServiceWrapper>
<body <body className={`${dmSans.variable} ${inter.variable} antialiased`}>
className={`${halant.variable} ${inter.variable} antialiased`}
>
<Tag />
{children} {children}
<script <script
dangerouslySetInnerHTML={{ dangerouslySetInnerHTML={{

View File

@@ -3,23 +3,19 @@
import ReactLenis from "lenis/react"; import ReactLenis from "lenis/react";
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider"; import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import HeroSplitKpi from "@/components/sections/hero/HeroSplitKpi"; import HeroSplitKpi from "@/components/sections/hero/HeroSplitKpi";
import TextAbout from "@/components/sections/about/TextAbout"; import MediaAbout from '@/components/sections/about/MediaAbout';
import NavbarLayoutFloatingInline from "@/components/navbar/NavbarLayoutFloatingInline"; import NavbarLayoutFloatingInline from "@/components/navbar/NavbarLayoutFloatingInline";
import { Sparkles, Users, Globe, Zap, Star, Layers, Twitter, Instagram, Linkedin } from "lucide-react"; import { Layers } from "lucide-react";
import MetricCardOne from "@/components/sections/metrics/MetricCardOne"; import FeatureCardTwentyFour from '@/components/sections/feature/FeatureCardTwentyFour';
import TestimonialCardFive from "@/components/sections/testimonial/TestimonialCardFive"; import ContactCTA from '@/components/sections/contact/ContactCTA';
import FeatureCardNineteen from "@/components/sections/feature/FeatureCardNineteen"; import FooterBaseReveal from "@/components/sections/footer/FooterBaseReveal";
import FeatureCardTen from "@/components/sections/feature/FeatureCardTen";
import { Check, Code, Palette, TrendingUp } from "lucide-react";
import ContactText from "@/components/sections/contact/ContactText";
import FooterCard from "@/components/sections/footer/FooterCard";
export default function WebAgencyThemePage() { export default function WebAgencyThemePage() {
const navItems = [ const navItems = [
{ name: "Home", id: "home" }, { name: "Start", id: "hero" },
{ name: "Services", id: "services" }, { name: "Leistungen", id: "services" },
{ name: "Work", id: "work" }, { name: "Über mich", id: "about" },
{ name: "Contact", id: "contact" }, { name: "Kontakt", id: "contact" }
]; ];
return ( return (
@@ -30,7 +26,7 @@ export default function WebAgencyThemePage() {
contentWidth="medium" contentWidth="medium"
sizing="medium" sizing="medium"
background="aurora" background="aurora"
cardStyle="layered-gradient" cardStyle="solid"
primaryButtonStyle="gradient" primaryButtonStyle="gradient"
secondaryButtonStyle="glass" secondaryButtonStyle="glass"
headingFontWeight="medium" headingFontWeight="medium"
@@ -38,241 +34,86 @@ export default function WebAgencyThemePage() {
<ReactLenis root> <ReactLenis root>
<NavbarLayoutFloatingInline <NavbarLayoutFloatingInline
navItems={navItems} navItems={navItems}
brandName="Studio" brandName="Growthlab.origin"
button={{ text: "Get in Touch", href: "#contact" }} button={{ text: "Kostenloses Erstgespräch", href: "#contact" }}
/> />
<HeroSplitKpi <div id="hero" data-section="hero">
background={{ variant: "radial-gradient" }} <HeroSplitKpi
tag="Award-Winning Agency" background={{ variant: "radial-gradient" }}
tagIcon={Sparkles} title="Mehr Zeit fürs Wesentliche — angetrieben von KI & smarten Webseiten"
title="We Build Digital Experiences" description="Wir automatisieren deine Terminbuchung und bauen Webseiten, die Kunden gewinnen."
description="Transform your brand with cutting-edge web design and development. We craft stunning websites that convert visitors into customers." enableKpiAnimation={false}
enableKpiAnimation={true} kpis={[
kpis={[ { value: "90%", label: "Effizienzsteigerung" },
{ value: "150+", label: "Projects Delivered" }, { value: "24/7", label: "Verfügbarkeit" },
{ value: "98%", label: "Client Satisfaction" }, { value: "30%", label: "Kostenersparnis" }
{ value: "12+", label: "Years Experience" }, ]}
]} buttons={[
buttons={[ {
{ text: "Kostenloses Erstgespräch", href: "#contact"
text: "Start Project", }
href: "#contact", ]}
}, avatars={[]}
{ avatarText=""
text: "View Work", imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/web-agency/hero/hero1.webp"
href: "#work", imageAlt="KI-gestützte Effizienz im Unternehmen"
}, mediaAnimation="slide-up"
]} showMarqueeCard={false}
avatars={[ marqueeItems={[]}
{ src: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/web-agency/hero/hero2.webp", alt: "Team member 1" }, marqueeClassName="md:mb-5"
{ src: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/web-agency/hero/hero3.webp", alt: "Team member 2" }, />
{ src: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/web-agency/hero/hero4.webp", alt: "Team member 3" } </div>
]} <div id="services" data-section="services">
avatarText="Trusted by startups and Fortune 500 companies" <FeatureCardTwentyFour
imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/web-agency/hero/hero1.webp" title="Unsere Leistungen"
imageAlt="Web design showcase" description="Innovative Lösungen für Ihr Wachstum."
mediaAnimation="slide-up" tag="Leistungen"
showMarqueeCard={false} tagIcon={Layers}
marqueeItems={[ features={[
{ type: "image", src: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/logo.svg", alt: "Logo" }, {
{ type: "image", src: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/logo.svg", alt: "Logo" }, id: "ki-booking-assistant", title: "KI-Telefonassistent", author: "", description: "Erreichbar rund um die Uhr kein verpasster Anruf, kein entgangener Auftrag.\nBucht Termine automatisch direkt in den Kalender.\nBeantwortet wiederkehrende Kundenfragen sofort.\nReduziert No-Shows durch automatische Erinnerungen.\nKlingt natürlich und entlastet dein Team spürbar.", tags: ["KI", "Automatisierung"],
{ type: "image", src: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/logo.svg", alt: "Logo" }, imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/web-agency/process/process1.webp", imageAlt: "KI-Buchungsassistent"
{ type: "image", src: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/logo.svg", alt: "Logo" }, },
{ type: "image", src: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/logo.svg", alt: "Logo" }, {
{ type: "image", src: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/logo.svg", alt: "Logo" }, id: "website-creation", title: "Webseiten-Erstellung", author: "", description: "Moderne, schnelle Webseiten, die auf jedem Gerät überzeugen.\nKlar auf Anfragen und Buchungen ausgerichtet (mehr Kunden).\nSuchmaschinenfreundlich für bessere Sichtbarkeit.\nSchlüsselfertig ohne Technik-Stress für dich.\nIndividuelles Design statt Baukasten-Optik.", tags: ["Webdesign", "Performance"],
{ type: "image", src: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/logo.svg", alt: "Logo" }, imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/web-agency/process/process3.webp", imageAlt: "Webseiten-Erstellung"
{ type: "image", src: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/logo.svg", alt: "Logo" }, }
{ type: "image", src: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/logo.svg", alt: "Logo" }, ]}
{ type: "image", src: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/logo.svg", alt: "Logo" }, animationType="slide-up"
]} textboxLayout="default"
marqueeClassName="md:mb-5" useInvertedBackground={false}
/> />
<TextAbout </div>
title="We craft digital experiences that captivate audiences and drive meaningful results for ambitious brands worldwide." <div id="about" data-section="about">
buttons={[ <MediaAbout
{ text: "Our Process", href: "#process" }, title="Über mich"
{ text: "Meet the Team", href: "#team" }, description="Als Gründer von Growthlab.origin liegt meine Leidenschaft darin, Unternehmen durch den cleveren Einsatz von KI und maßgeschneiderten Webseiten zu nachhaltigem Wachstum zu verhelfen. Ich glaube fest daran, dass Technologie uns mehr Freiheit für das Wesentliche schenken sollte, indem sie repetitive Aufgaben automatisiert und neue Möglichkeiten schafft."
]} tag="Gründer von Growthlab.origin"
useInvertedBackground={false} imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/default/avatar.png"
/> imageAlt="Max Mustermann, Gründer von Growthlab.origin"
<FeatureCardNineteen useInvertedBackground={false}
title="Our Services" />
description="A proven methodology that delivers results consistently across every project." </div>
tag="What We Do" <div id="contact" data-section="contact">
tagIcon={Layers} <ContactCTA
features={[ tag="Kontakt"
{ title="Bereit für mehr Effizienz?"
tag: "Service 01", description="Buchen Sie jetzt Ihr kostenloses Erstgespräch und entdecken Sie, wie KI und professionelle Webseiten Ihr Geschäft transformieren können."
title: "01", buttons={[
subtitle: "Web Development", { text: "Termin anfragen", href: "#contact" }
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", background={{ variant: "radial-gradient" }}
imageAlt: "Web development", useInvertedBackground={false}
}, />
{ </div>
tag: "Service 02", <FooterBaseReveal
title: "02", logoText="Growthlab.origin"
subtitle: "Marketing", copyrightText="© 2024 Growthlab.origin. Alle Rechte vorbehalten."
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.", columns={[
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/web-agency/process/process2.webp", { title: "Navigation", items: [{ label: "Start", href: "#hero" }, { label: "Leistungen", href: "#services" }, { label: "Über mich", href: "#about" }, { label: "Kontakt", href: "#contact" }] }
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 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",
},
]}
textboxLayout="default"
useInvertedBackground={false}
/>
<MetricCardOne
title="Results That Speak"
description="Our track record of delivering exceptional digital solutions for clients across industries."
tag="Our Impact"
tagIcon={Sparkles}
metrics={[
{ id: "clients", value: "200+", title: "Happy Clients", description: "Businesses transformed through our digital solutions", icon: Users },
{ id: "projects", value: "500+", title: "Projects", description: "Websites and apps launched worldwide", icon: Globe },
{ id: "performance", value: "99%", title: "Uptime", description: "Reliable performance for all our projects", icon: Zap },
]}
gridVariant="uniform-all-items-equal"
animationType="depth-3d"
textboxLayout="default"
useInvertedBackground={false}
/>
<TestimonialCardFive
title="What Our Clients Say"
description="Hear from the brands we've helped transform through innovative digital solutions."
tag="Testimonials"
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: "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: "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}
/>
<FeatureCardTen
tag="How We Work"
tagIcon={Layers}
title="Our Process"
description="A structured approach that turns your vision into results, every step of the way."
textboxLayout="default"
animationType="slide-up"
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" },
reverse: false,
items: [
{ icon: Code, text: "In-depth research and audits" },
{ icon: Zap, text: "Clear goals and KPIs defined" },
{ icon: Check, text: "Custom project roadmap" },
],
},
{
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" },
{ icon: Layers, text: "Interactive prototypes" },
{ icon: Check, text: "Client feedback loops" },
],
},
{
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" },
{ icon: Globe, text: "QA testing and optimization" },
{ icon: Check, text: "Launch support and analytics" },
],
},
]}
/>
<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" },
]}
background={{ variant: "canvas-reveal" }}
useInvertedBackground={false}
/>
<FooterCard
logoText="Studio"
copyrightText="© 2025 Studio. All rights reserved."
socialLinks={[
{ icon: Twitter, href: "https://twitter.com", ariaLabel: "Follow us on Twitter" },
{ icon: Instagram, href: "https://instagram.com", ariaLabel: "Follow us on Instagram" },
{ icon: Linkedin, href: "https://linkedin.com", ariaLabel: "Connect on LinkedIn" },
]} ]}
/> />
</ReactLenis> </ReactLenis>
</ThemeProvider> </ThemeProvider>
); );
} }

View File

@@ -11,7 +11,7 @@ html {
body { body {
background-color: var(--background); background-color: var(--background);
color: var(--foreground); color: var(--foreground);
font-family: var(--font-inter-tight), sans-serif; font-family: var(--font-inter), sans-serif;
position: relative; position: relative;
min-height: 100vh; min-height: 100vh;
overscroll-behavior: none; overscroll-behavior: none;
@@ -24,5 +24,5 @@ h3,
h4, h4,
h5, h5,
h6 { h6 {
font-family: var(--font-inter-tight), sans-serif; font-family: var(--font-dm-sans), sans-serif;
} }

View File

@@ -10,15 +10,15 @@
--accent: #ffffff; --accent: #ffffff;
--background-accent: #ffffff; */ --background-accent: #ffffff; */
--background: #f7f6f7; --background: #ffffff;
--card: #ffffff; --card: #f9f9f9;
--foreground: #0c1325; --foreground: #1a1a1a;
--primary-cta: #0b07ff; --primary-cta: #0a7039;
--primary-cta-text: #f7f6f7; --primary-cta-text: #ffffff;
--secondary-cta: #ffffff; --secondary-cta: #f9f9f9;
--secondary-cta-text: #0c1325; --secondary-cta-text: #000f06e6;
--accent: #93b7ff; --accent: #A3C9A8;
--background-accent: #a8bae8; --background-accent: #E0EDE1;
/* text sizing - set by ThemeProvider */ /* text sizing - set by ThemeProvider */
/* --text-2xs: clamp(0.465rem, 0.62vw, 0.62rem); /* --text-2xs: clamp(0.465rem, 0.62vw, 0.62rem);