4 Commits

Author SHA1 Message Date
33c3baed7c Update src/app/page.tsx 2025-12-29 23:08:36 +00:00
26b9970db5 Update src/app/page.tsx 2025-12-29 23:06:44 +00:00
f61edf9782 Update src/app/layout.tsx 2025-12-29 23:06:43 +00:00
4200728a95 Update src/app/globals.css 2025-12-29 23:06:42 +00:00
3 changed files with 178 additions and 177 deletions

View File

@@ -4,13 +4,13 @@
/* Base units */
/* --vw is set by ThemeProvider */
--background: #fbfaff;;
--card: #f7f5ff;;
--foreground: #0f0022;;
--primary-cta: #8b5cf6;;
--background: #ffffff;;
--card: #fcfcfc;;
--foreground: #000000e6;;
--primary-cta: #1a1a1a;;
--secondary-cta: #ffffff;;
--accent: #d8cef5;;
--background-accent: #c4a8f9;;
--accent: #bebebe;;
--background-accent: #c4c4c4;;
/* text sizing - set by ThemeProvider */
/* --text-2xs: clamp(0.465rem, 0.62vw, 0.62rem);
@@ -495,7 +495,7 @@ html {
body {
background-color: var(--background);
color: var(--foreground);
font-family: var(--font-space-grotesk), sans-serif;
font-family: var(--font-poppins), sans-serif;
position: relative;
min-height: 100vh;
overscroll-behavior: none;
@@ -508,5 +508,5 @@ h3,
h4,
h5,
h6 {
font-family: var(--font-space-grotesk), sans-serif;
font-family: var(--font-poppins), sans-serif;
}

View File

@@ -1,33 +1,34 @@
import type { Metadata } from "next";
import { Space_Grotesk } from "next/font/google";
import { Poppins } from "next/font/google";
import "./globals.css";
import { ServiceWrapper } from "@/components/ServiceWrapper";
import Tag from "@/tag/Tag";
const spaceGrotesk = Space_Grotesk({
variable: "--font-space-grotesk",
const poppins = Poppins({
variable: "--font-poppins",
subsets: ["latin"],
weight: ["100", "200", "300", "400", "500", "600", "700", "800", "900"],
});
export const metadata: Metadata = {
title: "AffiliateHub - Earn More with Affiliate Marketing",
description: "Join thousands of successful affiliates. Unlock your earning potential with real-time analytics, marketing automation, and 24/7 support.",
keywords: ["affiliate marketing", "earn money", "affiliate program", "commission tracking", "marketing platform"],
metadataBase: new URL("https://affiliatehub.com"),
title: "Fashion Forward - Premium Clothing Collection",
description: "Discover our curated collection of premium clothing. High-quality fabrics, modern designs, and timeless styles for every occasion.",
keywords: ["fashion", "clothing", "premium wear", "designer clothes", "style"],
metadataBase: new URL("https://fashionforward.com"),
alternates: {
canonical: "https://affiliatehub.com"
canonical: "https://fashionforward.com"
},
openGraph: {
title: "AffiliateHub - Earn More with Affiliate Marketing",
description: "Join thousands of successful affiliates. Unlock your earning potential with real-time analytics, marketing automation, and 24/7 support.",
url: "https://affiliatehub.com",
siteName: "AffiliateHub",
title: "Fashion Forward - Premium Clothing Collection",
description: "Discover our curated collection of premium clothing. High-quality fabrics, modern designs, and timeless styles for every occasion.",
url: "https://fashionforward.com",
siteName: "Fashion Forward",
type: "website"
},
twitter: {
card: "summary_large_image",
title: "AffiliateHub - Earn More with Affiliate Marketing",
description: "Join thousands of successful affiliates. Unlock your earning potential with real-time analytics, marketing automation, and 24/7 support."
title: "Fashion Forward - Premium Clothing Collection",
description: "Discover our curated collection of premium clothing. High-quality fabrics, modern designs, and timeless styles for every occasion."
}
};
@@ -40,7 +41,7 @@ export default function RootLayout({
<html lang="en" suppressHydrationWarning>
<ServiceWrapper>
<body
className={spaceGrotesk.variable}
className={poppins.variable}
>
<Tag />
{children}
@@ -1266,4 +1267,4 @@ export default function RootLayout({
</ServiceWrapper>
</html>
);
}
}

View File

@@ -1,290 +1,290 @@
"use client"
"use client";
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import NavbarStyleCentered from '@/components/navbar/NavbarStyleCentered/NavbarStyleCentered';
import HeroLogoCarousel from '@/components/sections/hero/HeroLogoCarousel';
import InlineImageSplitTextAbout from '@/components/sections/about/InlineImageSplitTextAbout';
import FeatureCardFifteen from '@/components/sections/feature/FeatureCardFifteen';
import TestimonialCardEight from '@/components/sections/testimonial/TestimonialCardEight';
import FaqSplitMedia from '@/components/sections/faq/FaqSplitMedia';
import ContactFaq from '@/components/sections/contact/ContactFaq';
import FooterBaseSocial from '@/components/sections/footer/FooterBaseSocial';
import { Phone, Twitter, Linkedin, Facebook, Youtube } from 'lucide-react';
import HeroSplitAvatars from '@/components/sections/hero/HeroSplitAvatars';
import ProductCardOne from '@/components/sections/product/ProductCardOne';
import FeatureCardThree from '@/components/sections/feature/featureCardThree/FeatureCardThree';
import TestimonialCardOne from '@/components/sections/testimonial/TestimonialCardOne';
import FaqSplitText from '@/components/sections/faq/FaqSplitText';
import ContactCenter from '@/components/sections/contact/ContactCenter';
import FooterLogoEmphasis from '@/components/sections/footer/FooterLogoEmphasis';
import { Mail, Heart, ShoppingBag } from 'lucide-react';
export default function LandingPage() {
return (
<ThemeProvider
defaultButtonVariant="text-shift"
defaultTextAnimation="reveal-blur"
borderRadius="soft"
contentWidth="smallMedium"
sizing="mediumSizeLargeTitles"
background="floatingGradient"
cardStyle="inset"
primaryButtonStyle="shadow"
defaultButtonVariant="expand-hover"
defaultTextAnimation="entrance-slide"
borderRadius="rounded"
contentWidth="medium"
sizing="mediumLarge"
background="none"
cardStyle="solid-accent"
primaryButtonStyle="gradient"
secondaryButtonStyle="glass"
headingFontWeight="normal"
headingFontWeight="semibold"
>
<div id="nav" data-section="nav">
<NavbarStyleCentered
brandName="AffiliateHub"
brandName="Fashion Forward"
navItems={[
{ name: "Home", id: "home" },
{ name: "Shop", id: "shop" },
{ name: "About", id: "about" },
{ name: "Features", id: "features" },
{ name: "Testimonials", id: "testimonials" },
{ name: "Collections", id: "collections" },
{ name: "Reviews", id: "reviews" },
{ name: "Contact", id: "contact" }
]}
button={{
text: "Get Started",
href: "contact"
}}
button={{ text: "Sign Up", href: "contact" }}
/>
</div>
<div id="hero" data-section="hero">
<HeroLogoCarousel
logoText="AffiliateHub"
description="Unlock your earning potential with our cutting-edge affiliate marketing platform. Get real-time tracking, advanced analytics, and dedicated support to scale your affiliate business."
mediaItems={[
{
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766983288368-py19hzaj.jpg",
imageAlt: "Affiliate marketing success dashboard"
},
<HeroSplitAvatars
title="Elevate Your Style"
description="Discover our premium collection of carefully curated clothing pieces designed for the modern fashion enthusiast. From timeless classics to contemporary trends."
tag="New Collection"
tagIcon={ShoppingBag}
imagePosition="right"
imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766983288368-py19hzaj.jpg"
imageAlt="Fashion collection showcase"
avatars={[
{ src: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766399072529-1z8sle2r.jpg", alt: "Customer 1" },
{ src: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766140153329-bmp1nqc3.jpg", alt: "Customer 2" },
{ src: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766318234070-3a71e283.jpg", alt: "Customer 3" },
{ src: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766184201718-hfojd9bk.jpg", alt: "Customer 4" },
{ src: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766787044450-9f4y10ts.jpg", alt: "Customer 5" }
]}
avatarText="Join 10,000+ fashion lovers"
buttons={[
{ text: "Shop Now", href: "shop" },
{ text: "Explore Collection", href: "collections" }
]}
/>
</div>
<div id="shop" data-section="shop">
<ProductCardOne
title="Featured Collection"
description="Hand-picked pieces from our latest arrivals. Each item is selected for quality, style, and comfort."
tag="Best Sellers"
textboxLayout="default"
animationType="slide-up"
useInvertedBackground="noInvert"
gridVariant="uniform-all-items-equal"
products={[
{
id: "1",
name: "Premium Cotton T-Shirt",
price: "$49.99",
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766787041844-tzssa0wc.jpg",
imageAlt: "Marketing analytics and performance metrics"
imageAlt: "Premium Cotton T-Shirt",
isFavorited: false
},
{
id: "2",
name: "Elegant Silk Blouse",
price: "$89.99",
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766983289277-elw8ical.jpg",
imageAlt: "Collaborative marketing team working together"
imageAlt: "Elegant Silk Blouse",
isFavorited: false
},
{
id: "3",
name: "Classic Denim Jeans",
price: "$79.99",
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766983290082-rq47q3ut.jpg",
imageAlt: "Earning potential and financial growth"
imageAlt: "Classic Denim Jeans",
isFavorited: false
},
{
id: "4",
name: "Luxury Leather Jacket",
price: "$199.99",
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766983291397-8uh3i1cf.jpg",
imageAlt: "Network and partnership connections"
imageAlt: "Luxury Leather Jacket",
isFavorited: false
}
]}
/>
</div>
<div id="about" data-section="about">
<InlineImageSplitTextAbout
heading={[
{ type: "text", content: "Empowering Marketers Since 2015" },
{
type: "image",
src: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766787044450-9f4y10ts.jpg",
alt: "AffiliateHub team"
},
{ type: "text", content: "to maximize their earnings" }
]}
useInvertedBackground="noInvert"
buttons={[
{ text: "Learn More", href: "#features" }
]}
/>
</div>
<div id="features" data-section="features">
<FeatureCardFifteen
title="Everything You Need to Succeed"
description="Our comprehensive platform provides all the tools and features you need to build, manage, and scale your affiliate marketing business."
animationType="slide-up"
<FeatureCardThree
title="Why Choose Our Fashion"
description="We believe in quality, sustainability, and timeless style. Every piece in our collection is carefully selected to meet our high standards."
tag="Our Promise"
textboxLayout="default"
animationType="slide-up"
useInvertedBackground="noInvert"
gridVariant="uniform-all-items-equal"
features={[
{
id: "1",
title: "Real-Time Analytics",
description: "Track every click, conversion, and commission in real-time with our advanced analytics dashboard.",
title: "Premium Quality",
description: "We source only the finest fabrics and materials from trusted suppliers around the world.",
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766983292413-wq7r64pm.jpg",
imageAlt: "Analytics dashboard interface"
imageAlt: "Premium fabric quality"
},
{
id: "2",
title: "Marketing Automation",
description: "Automate your campaigns and reach your audience at scale with our intelligent marketing tools.",
title: "Sustainable Fashion",
description: "Eco-friendly production methods and ethical sourcing practices for a better future.",
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766787045743-6gjau4zf.jpg",
imageAlt: "Marketing automation workflow"
imageAlt: "Sustainable production"
},
{
id: "3",
title: "Commission Tracking",
description: "Transparent commission tracking with instant payouts and detailed payment history.",
title: "Expert Craftsmanship",
description: "Each piece is handcrafted by skilled artisans with decades of experience in fashion.",
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766983293269-qul9w8a9.jpg",
imageAlt: "Commission tracking system"
imageAlt: "Expert craftsmanship"
},
{
id: "4",
title: "24/7 Support",
description: "Dedicated support team available round the clock to help you succeed.",
title: "Customer Support",
description: "Dedicated support team ready to help with styling advice and any questions.",
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766983294082-ngjm8l0d.jpg",
imageAlt: "Customer support team"
imageAlt: "Customer support"
}
]}
/>
</div>
<div id="testimonials" data-section="testimonials">
<TestimonialCardEight
title="Success Stories from Our Affiliates"
description="See how our platform has helped thousands of marketers grow their income and build sustainable businesses."
<div id="reviews" data-section="reviews">
<TestimonialCardOne
title="What Our Customers Love"
description="Read authentic reviews from fashion enthusiasts who have transformed their wardrobe with our collection."
tag="Customer Reviews"
textboxLayout="default"
animationType="slide-up"
useInvertedBackground="noInvert"
gridVariant="uniform-all-items-equal"
testimonials={[
{
id: "1",
name: "Sarah Mitchell",
role: "Digital Marketer",
company: "Growth Marketing Co",
role: "Fashion Blogger",
company: "Style & Substance",
rating: 5,
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766399072529-1z8sle2r.jpg",
imageAlt: "Sarah Mitchell portrait"
imageAlt: "Sarah Mitchell"
},
{
id: "2",
name: "James Chen",
role: "Marketing Manager",
company: "Tech Solutions Inc",
role: "Fashion Designer",
company: "Creative Studio",
rating: 5,
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766140153329-bmp1nqc3.jpg",
imageAlt: "James Chen portrait"
imageAlt: "James Chen"
},
{
id: "3",
name: "Emma Johnson",
role: "Affiliate Director",
company: "Online Ventures",
role: "Style Consultant",
company: "Fashion Forward",
rating: 5,
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766318234070-3a71e283.jpg",
imageAlt: "Emma Johnson portrait"
imageAlt: "Emma Johnson"
},
{
id: "4",
name: "Michael Rodriguez",
role: "Independent Affiliate",
company: "Digital Entrepreneurs",
role: "Fashion Enthusiast",
company: "Style Community",
rating: 5,
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766184201718-hfojd9bk.jpg",
imageAlt: "Michael Rodriguez portrait"
imageAlt: "Michael Rodriguez"
}
]}
/>
</div>
<div id="faq" data-section="faq">
<FaqSplitMedia
title="Common Questions About Affiliate Marketing"
description="Find answers to frequently asked questions about our platform and affiliate program."
textboxLayout="default"
<div id="collections" data-section="collections">
<FaqSplitText
sideTitle="Frequently Asked Questions"
sideDescription="Find answers to common questions about our collections, sizing, and policies."
textPosition="left"
useInvertedBackground="noInvert"
imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766140104217-wfflli6f.jpg"
imageAlt="Customer support team helping affiliates"
mediaPosition="left"
faqs={[
{
id: "1",
title: "How much can I earn as an affiliate?",
content: "Earnings depend on your marketing efforts and the products you promote. Our top affiliates earn $5,000+ per month. We offer competitive commission rates ranging from 15% to 40% depending on the product tier."
title: "What is your return policy?",
content: "We offer a 30-day return policy on all items. If you're not satisfied with your purchase, simply return it in original condition for a full refund or exchange."
},
{
id: "2",
title: "How often do I get paid?",
content: "We offer flexible payment schedules. Choose weekly, bi-weekly, or monthly payouts. Payments are processed automatically to your preferred payment method with no hidden fees."
title: "How do I find my size?",
content: "Our size guide is available on each product page. We offer international sizing options including XS to XXL. Feel free to contact us if you need personalized sizing assistance."
},
{
id: "3",
title: "What marketing materials are provided?",
content: "We provide banners, landing pages, email templates, social media graphics, and video assets. All materials are professionally designed and ready to use."
title: "Do you ship internationally?",
content: "Yes! We ship to over 150 countries worldwide. Shipping costs and delivery times vary by location. Standard shipping takes 5-7 business days."
},
{
id: "4",
title: "Do I need experience to get started?",
content: "No experience necessary! We provide training, resources, and dedicated support to help you succeed, whether you're a seasoned marketer or just starting out."
title: "Are your materials ethically sourced?",
content: "Absolutely. We partner exclusively with suppliers who follow fair trade practices and environmental standards. All our manufacturers are certified for ethical production."
},
{
id: "5",
title: "What's your cookie duration?",
content: "We offer a 45-day cookie window, giving you plenty of time to convert your referred customers. This is one of the longest in the industry."
title: "Can I customize my order?",
content: "We offer customization options for select items including monogramming, embroidery, and color matching. Contact our team for details on personalization services."
}
]}
/>
</div>
<div id="contact" data-section="contact">
<ContactFaq
ctaTitle="Ready to Start Earning?"
ctaDescription="Join thousands of successful affiliates. Book a call with our team to discuss your affiliate marketing goals."
ctaButton={{
text: "Book a Free Call",
href: "contact"
}}
ctaIcon={Phone}
<ContactCenter
tag="Get In Touch"
title="Join Our Fashion Community"
description="Subscribe to our newsletter for exclusive previews, style tips, and special offers on new collections."
tagIcon={Mail}
useInvertedBackground="noInvert"
animationType="slide-up"
faqs={[
{
id: "1",
title: "What's the application process?",
content: "Simply fill out our affiliate application form. We review applications within 24 hours. Most qualified marketers are approved immediately."
},
{
id: "2",
title: "Are there any fees to join?",
content: "Absolutely not! Joining our affiliate program is completely free. There are no setup fees, monthly fees, or hidden charges."
},
{
id: "3",
title: "Can I promote multiple products?",
content: "Yes! We encourage our affiliates to promote multiple products from our catalog. This diversifies your income streams and maximizes earning potential."
}
]}
inputPlaceholder="Enter your email address"
buttonText="Subscribe"
termsText="We respect your privacy. Unsubscribe anytime. No spam, ever."
/>
</div>
<div id="footer" data-section="footer">
<FooterBaseSocial
logoText="AffiliateHub"
description="Empower your affiliate marketing business with tools designed for success. Join our community of top earners today."
<FooterLogoEmphasis
columns={[
{
title: "Platform",
items: [
{ label: "Dashboard", href: "#" },
{ label: "Analytics", href: "#" },
{ label: "Resources", href: "#" }
{ label: "New Arrivals", href: "shop" },
{ label: "Best Sellers", href: "shop" },
{ label: "Sale", href: "shop" }
]
},
{
title: "Company",
items: [
{ label: "About Us", href: "about" },
{ label: "Blog", href: "#" },
{ label: "Careers", href: "#" }
{ label: "Our Story", href: "about" },
{ label: "Sustainability", href: "about" }
]
},
{
items: [
{ label: "Contact", href: "contact" },
{ label: "Support", href: "contact" },
{ label: "Size Guide", href: "#" }
]
},
{
title: "Legal",
items: [
{ label: "Terms of Service", href: "#" },
{ label: "Privacy Policy", href: "#" },
{ label: "Contact", href: "contact" }
{ label: "Terms of Service", href: "#" },
{ label: "Shipping Info", href: "#" }
]
}
]}
socialLinks={[
{ icon: Twitter, href: "https://twitter.com", ariaLabel: "Twitter" },
{ icon: Linkedin, href: "https://linkedin.com", ariaLabel: "LinkedIn" },
{ icon: Facebook, href: "https://facebook.com", ariaLabel: "Facebook" },
{ icon: Youtube, href: "https://youtube.com", ariaLabel: "YouTube" }
]}
copyrightText="© 2025 AffiliateHub. All rights reserved."
logoText="Fashion Forward"
/>
</div>
</ThemeProvider>
);
}
}