Merge version_2 into main #2
131
src/app/page.tsx
131
src/app/page.tsx
@@ -5,14 +5,12 @@ import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
|
||||
import NavbarLayoutFloatingOverlay from "@/components/navbar/NavbarLayoutFloatingOverlay/NavbarLayoutFloatingOverlay";
|
||||
import HeroOverlay from "@/components/sections/hero/HeroOverlay";
|
||||
import FeatureBento from "@/components/sections/feature/FeatureBento";
|
||||
import FeatureCardTwentySix from "@/components/sections/feature/FeatureCardTwentySix";
|
||||
import MetricCardOne from "@/components/sections/metrics/MetricCardOne";
|
||||
import TeamCardFive from "@/components/sections/team/TeamCardFive";
|
||||
import FaqBase from "@/components/sections/faq/FaqBase";
|
||||
import ContactCTA from "@/components/sections/contact/ContactCTA";
|
||||
import FooterBase from "@/components/sections/footer/FooterBase";
|
||||
import TestimonialCardFifteen from "@/components/sections/testimonial/TestimonialCardFifteen";
|
||||
import { Sparkles, Search, ArrowUpRight, Monitor, Shield, Zap, Puzzle, TrendingUp, Award, Users, Target, Palette, Code } from "lucide-react";
|
||||
import FeatureCardMedia from "@/components/sections/feature/FeatureCardMedia";
|
||||
import MetricCardFourteen from "@/components/sections/metrics/MetricCardFourteen";
|
||||
import ContactSplitForm from "@/components/sections/contact/ContactSplitForm";
|
||||
import FooterLogoEmphasis from "@/components/sections/footer/FooterLogoEmphasis";
|
||||
import TestimonialCardOne from "@/components/sections/testimonial/TestimonialCardOne";
|
||||
import { Sparkles, ArrowUpRight, Target, Palette, Code, Users, Award, Shield } from "lucide-react";
|
||||
|
||||
export default function VisionStudioPage() {
|
||||
return (
|
||||
@@ -24,22 +22,24 @@ export default function VisionStudioPage() {
|
||||
sizing="medium"
|
||||
background="none"
|
||||
cardStyle="glass-elevated"
|
||||
primaryButtonStyle="metallic"
|
||||
primaryButtonStyle="gradient"
|
||||
secondaryButtonStyle="glass"
|
||||
headingFontWeight="medium"
|
||||
>
|
||||
<ReactLenis root>
|
||||
<NavbarLayoutFloatingOverlay
|
||||
brandName="Vision Studio"
|
||||
navItems={[
|
||||
{ name: "Work", id: "work" },
|
||||
{ name: "Services", id: "services" },
|
||||
{ name: "About", id: "about" },
|
||||
{ name: "Contact", id: "contact" },
|
||||
]}
|
||||
button={{ text: "Get Started", href: "#contact" }}
|
||||
/>
|
||||
<div id="hero">
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarLayoutFloatingOverlay
|
||||
brandName="Vision Studio"
|
||||
navItems={[
|
||||
{ name: "Work", id: "work" },
|
||||
{ name: "Services", id: "services" },
|
||||
{ name: "About", id: "about" },
|
||||
{ name: "Contact", id: "contact" },
|
||||
]}
|
||||
button={{ text: "Get Started", href: "#contact" }}
|
||||
/>
|
||||
</div>
|
||||
<div id="hero" data-section="hero">
|
||||
<HeroOverlay
|
||||
title="Designing the Future of Your Brand"
|
||||
description="Vision Studio crafts immersive digital experiences that blend creativity with strategic precision. We don't just build websites; we build identities."
|
||||
@@ -49,67 +49,86 @@ export default function VisionStudioPage() {
|
||||
buttons={[{ text: "Start Project", href: "#contact" }]}
|
||||
/>
|
||||
</div>
|
||||
<div id="services">
|
||||
<div id="services" data-section="services">
|
||||
<FeatureBento
|
||||
title="Our Core Services"
|
||||
description="Strategic solutions designed to elevate your brand presence in the modern market."
|
||||
features={[
|
||||
{
|
||||
title: "Meta Ads", description: "Data-driven ad campaigns designed to reach your target audience and scale revenue.", bentoComponent: "reveal-icon", centerIcon: Target,
|
||||
title: "Meta Ads", description: "Data-driven ad campaigns designed to reach your target audience and scale revenue.", bentoComponent: "reveal-icon", icon: Target,
|
||||
},
|
||||
{
|
||||
title: "Graphic Design", description: "Striking visual narratives that communicate your vision with clarity and style.", bentoComponent: "reveal-icon", centerIcon: Palette,
|
||||
title: "Graphic Design", description: "Striking visual narratives that communicate your vision with clarity and style.", bentoComponent: "reveal-icon", icon: Palette,
|
||||
},
|
||||
{
|
||||
title: "Web Design", description: "Exceptional, high-performance web experiences tailored for conversion and engagement.", bentoComponent: "reveal-icon", centerIcon: Code,
|
||||
title: "Web Design", description: "Exceptional, high-performance web experiences tailored for conversion and engagement.", bentoComponent: "reveal-icon", icon: Code,
|
||||
},
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
<div id="work">
|
||||
<FeatureCardTwentySix
|
||||
<div id="work" data-section="work">
|
||||
<FeatureCardMedia
|
||||
title="Selected Work"
|
||||
description="A portfolio of modern designs that push boundaries."
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
features={[
|
||||
{ title: "Brand Campaign", description: "High-conversion ad design", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/web-agency-2/project-1.webp", buttonIcon: ArrowUpRight },
|
||||
{ title: "E-commerce Platform", description: "Custom shopify development", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/web-agency-2/project-2.webp", buttonIcon: ArrowUpRight },
|
||||
{ id: "1", title: "Brand Campaign", description: "High-conversion ad design", tag: "Design", buttons: [{ text: "View", href: "#" }] },
|
||||
{ id: "2", title: "E-commerce Platform", description: "Custom shopify development", tag: "Web", buttons: [{ text: "View", href: "#" }] },
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
<div id="about">
|
||||
<div id="about" data-section="about">
|
||||
<FeatureBento
|
||||
title="Our Promise"
|
||||
description="We promise to leverage our expertise in Meta ads, Graphic Design, and Web Design to deliver a measurable growth trajectory for your studio."
|
||||
features={[]}
|
||||
/>
|
||||
</div>
|
||||
<TestimonialCardFifteen
|
||||
testimonial="Vision Studio revolutionized how we approach our visual identity. Highly recommended."
|
||||
rating={5}
|
||||
author="— Elena V., Marketing Lead"
|
||||
useInvertedBackground={false}
|
||||
/>
|
||||
<MetricCardOne
|
||||
title="Trusted Growth"
|
||||
metrics={[
|
||||
{ id: "1", value: "50+", title: "Successful Launches", description: "Across all sectors" },
|
||||
{ id: "2", value: "98%", title: "Retention", description: "Client satisfaction rate" },
|
||||
{ id: "3", value: "10X", title: "Growth", description: "Average ROI on ad spend" },
|
||||
]}
|
||||
/>
|
||||
<ContactCTA
|
||||
tag="Contact Us"
|
||||
title="Let's Bring Your Vision to Life"
|
||||
description="Connect with Vision Studio today for a consultation on your next project."
|
||||
buttons={[{ text: "Get in touch", href: "#contact" }]}
|
||||
/>
|
||||
<FooterBase
|
||||
logoText="Vision Studio"
|
||||
columns={[
|
||||
{ title: "Agency", items: [{ label: "About", href: "#" }] },
|
||||
{ title: "Services", items: [{ label: "Meta Ads", href: "#" }, { label: "Graphic Design", href: "#" }, { label: "Web Design", href: "#" }] },
|
||||
]}
|
||||
/>
|
||||
<div id="testimonial" data-section="testimonial">
|
||||
<TestimonialCardOne
|
||||
title="Client Stories"
|
||||
description="What our partners say about us."
|
||||
animationType="slide-up"
|
||||
gridVariant="uniform-all-items-equal"
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
testimonials={[
|
||||
{ id: "1", name: "Elena V.", role: "Marketing Lead", company: "TechCorp", rating: 5 }
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
<div id="metrics" data-section="metrics">
|
||||
<MetricCardFourteen
|
||||
title="Trusted Growth"
|
||||
tag="Impact"
|
||||
metricsAnimation="slide-up"
|
||||
useInvertedBackground={false}
|
||||
metrics={[
|
||||
{ id: "1", value: "50+", description: "Successful Launches" },
|
||||
{ id: "2", value: "98%", description: "Client satisfaction rate" },
|
||||
{ id: "3", value: "10X", description: "Average ROI on ad spend" },
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
<div id="contact" data-section="contact">
|
||||
<ContactSplitForm
|
||||
title="Let's Bring Your Vision to Life"
|
||||
description="Connect with Vision Studio today for a consultation on your next project."
|
||||
inputs={[{ name: "name", type: "text", placeholder: "Name" }, { name: "email", type: "email", placeholder: "Email" }]}
|
||||
useInvertedBackground={false}
|
||||
/>
|
||||
</div>
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterLogoEmphasis
|
||||
logoText="Vision Studio"
|
||||
columns={[
|
||||
{ items: [{ label: "About", href: "#" }] },
|
||||
{ items: [{ label: "Meta Ads", href: "#" }, { label: "Graphic Design", href: "#" }, { label: "Web Design", href: "#" }] },
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
</ReactLenis>
|
||||
</ThemeProvider>
|
||||
);
|
||||
|
||||
Reference in New Issue
Block a user