26 Commits

Author SHA1 Message Date
9e3372b4e4 Bob AI: change theme to dark blue 2026-02-05 13:33:40 +02:00
4ad28f4095 Bob AI: remove the testimonials section 2026-02-05 12:28:24 +02:00
329baa9365 Bob AI: delete the faq section 2026-02-05 12:27:36 +02:00
8626ffdf9f Bob AI: remove the about section 2026-02-05 12:26:50 +02:00
b5872a37bc Bob AI: replace footer with [Block: footer-base-1|Footer B... 2026-02-05 12:26:02 +02:00
41e440da98 Bob AI: replace team section with [Block: team-card-one-1|... 2026-02-05 12:25:10 +02:00
07f1cb6f54 Bob AI: [Block: team-card-one|Team Card One|/blocks/team/T... 2026-02-05 12:24:18 +02:00
d32a87dd42 Bob AI: [Block: faq-accordion-one|FAQ Accordion One|/block... 2026-02-05 12:22:11 +02:00
fe4fa93c62 Bob AI: replace about section with TextAbout 2026-02-05 12:21:17 +02:00
bd5cf8b453 Bob AI: replace nav section with [Block: navbar-style-appl... 2026-02-05 12:20:18 +02:00
d8e8e7f8d8 Bob AI: replace nav section with [Block: navbar-style-appl... 2026-02-05 12:18:41 +02:00
62a949860f Bob AI: replace hero with [Block: hero-logo-billboard|Hero... 2026-02-05 12:14:25 +02:00
e0d14009ad Bob AI: replace footer with [Block: footer-base-1|Footer B... 2026-02-05 12:08:37 +02:00
2deee11e99 Bob AI: replace team section with [Block: team-card-one-1|... 2026-02-05 12:07:38 +02:00
1e8ce5a5ff Bob AI: set theme to warm earth tones 2026-02-05 12:06:42 +02:00
7869408840 Bob AI: make it light theme 2026-02-05 12:05:17 +02:00
ddccab7ae8 Bob AI: change text color to coral 2026-02-05 12:02:33 +02:00
ab7fb7e80f Bob AI: change button color to green 2026-02-05 12:01:10 +02:00
9a38d2b701 Bob AI: change text color to black 2026-02-05 11:56:53 +02:00
0f3248e1b5 Bob AI: change background color to #1a1a2e 2026-02-05 11:42:49 +02:00
373b68fd54 Bob AI: change the background color of the hero section to... 2026-02-05 11:41:27 +02:00
4c7708cc4e Bob AI: use FeatureCardThree section instead 2026-02-04 23:28:26 +02:00
1273369bee Bob AI: you used the same component, use any other compone... 2026-02-04 23:26:57 +02:00
b872309eee Bob AI: i dont like it, replace it with something differen... 2026-02-04 23:25:26 +02:00
b9fba4751f Bob AI: add our bestsellers section 2026-02-04 23:23:30 +02:00
9b1cfe3722 Bob AI: move hero section to make it the very first sectio... 2026-02-04 23:22:27 +02:00
4 changed files with 149 additions and 71 deletions

View File

@@ -6,11 +6,13 @@ import HeroLogoBillboard from '@/components/sections/hero/HeroLogoBillboard';
import ProductCardThree from '@/components/sections/product/ProductCardThree'; import ProductCardThree from '@/components/sections/product/ProductCardThree';
import FeatureCardTwentySix from '@/components/sections/feature/FeatureCardTwentySix'; import FeatureCardTwentySix from '@/components/sections/feature/FeatureCardTwentySix';
import PricingCardThree from '@/components/sections/pricing/PricingCardThree'; import PricingCardThree from '@/components/sections/pricing/PricingCardThree';
import TestimonialCardTwelve from '@/components/sections/testimonial/TestimonialCardTwelve';
import ContactSplitForm from '@/components/sections/contact/ContactSplitForm'; import ContactSplitForm from '@/components/sections/contact/ContactSplitForm';
import FooterBaseReveal from '@/components/sections/footer/FooterBaseReveal'; import FooterBase1 from '@/components/sections/footer/FooterBase1';
import { Camera, Zap, Sparkles, Monitor, Shield, Star, Heart } from "lucide-react"; import { Camera, Zap, Sparkles, Monitor, Shield, Star, Heart } from "lucide-react";
import HeroBillboardScroll from '@/components/sections/hero/HeroBillboardScroll'; import HeroLogoBillboard from '@/components/sections/hero/HeroLogoBillboard';
import FeatureCardThree from '@/components/sections/feature/featureCardThree/FeatureCardThree';
import TeamCardOne from '@/components/sections/team/TeamCardOne';
import TeamCardOne1 from '@/components/sections/team/TeamCardOne1';
export default function LandingPage() { export default function LandingPage() {
return ( return (
@@ -26,6 +28,10 @@ export default function LandingPage() {
secondaryButtonStyle="solid" secondaryButtonStyle="solid"
headingFontWeight="light" headingFontWeight="light"
> >
<div id="hero" data-section="hero">
<HeroLogoBillboard logoText="iPhone Store" description="Explore the latest iPhone models with cutting-edge features and sleek designs." buttons={[{ label: "Shop Now", href: "/iphones", className: "bg-black text-white hover:bg-gray-800" }]} background={{ variant: "downward-rays-animated" }} imageSrc="https://images.unsplash.com/photo-1519681393784-d120267933ba?w=800&q=80" ariaLabel="iPhone Collection Hero Section" />
</div>
<div id="nav" data-section="nav"> <div id="nav" data-section="nav">
<NavbarStyleApple <NavbarStyleApple
brandName="iPhone Store" brandName="iPhone Store"
@@ -148,35 +154,6 @@ export default function LandingPage() {
/> />
</div> </div>
<div id="testimonials" data-section="testimonials">
<TestimonialCardTwelve
cardTitle="Trusted by over 50,000 satisfied customers worldwide who experience iPhone excellence daily"
cardTag="See what our customers say"
cardTagIcon={Heart}
testimonials={[
{
id: "1", name: "Sarah Johnson", imageSrc: "https://img.b2bpic.net/free-photo/caucasian-brunette-male-portrait_158595-7921.jpg", imageAlt: "Sarah Johnson"
},
{
id: "2", name: "Michael Chen", imageSrc: "https://img.b2bpic.net/free-photo/blond-businessman-happy-expression_1194-3797.jpg", imageAlt: "Michael Chen"
},
{
id: "3", name: "Emma Rodriguez", imageSrc: "https://img.b2bpic.net/free-photo/front-view-smiley-man-with-backpack_23-2149915917.jpg", imageAlt: "Emma Rodriguez"
},
{
id: "4", name: "David Kim", imageSrc: "https://img.b2bpic.net/free-photo/young-businessman-happy-expression_1194-1681.jpg", imageAlt: "David Kim"
},
{
id: "5", name: "Jessica Walsh", imageSrc: "https://img.b2bpic.net/free-photo/young-businessman-happy-expression_1194-1563.jpg", imageAlt: "Jessica Walsh"
},
{
id: "6", name: "Amanda Foster", imageSrc: "https://img.b2bpic.net/free-photo/confident-young-bald-call-center-man-standing-with-closed-posture-profile-view-isolated-purple-with-copy-space_141793-76759.jpg", imageAlt: "Amanda Foster"
}
]}
useInvertedBackground="noInvert"
/>
</div>
<div id="contact" data-section="contact"> <div id="contact" data-section="contact">
<ContactSplitForm <ContactSplitForm
title="Get Your iPhone Today" title="Get Your iPhone Today"
@@ -199,40 +176,118 @@ export default function LandingPage() {
/> />
</div> </div>
<div id="hero" data-section="hero"> <div id="layout" data-section="layout">
<HeroBillboardScroll title="Explore the Latest iPhone Models" description="Discover the latest features and designs in our iPhone collection. From photography to performance, we've got you covered." background={{ variant: "downward-rays-animated" }} tag="New Arrivals" tagIcon="Calendar" buttons={[{ label: "Shop Now", href: "/iphones", className: "bg-black text-white hover:bg-gray-800" }]} imageSrc="https://images.unsplash.com/photo-1519681393784-d120267933ba?w=800&q=80" ariaLabel="iPhone Collection Hero Section" /> <FeatureCardThree features={[
{ id: "1", title: "Wireless Charging Stand", description: "Elegant and efficient, charges your iPhone wirelessly.", imageSrc: "https://images.unsplash.com/photo-1519681393784-d120267933ba?w=800&q=80", imageAlt: "Wireless Charging Stand" },
{ id: "2", title: "Clear iPhone Case", description: "Protect your iPhone with a clear, stylish case.", imageSrc: "https://images.unsplash.com/photo-1519681393784-d120267933ba?w=800&q=80", imageAlt: "Clear iPhone Case" },
{ id: "3", title: "Bumper Case", description: "Durable bumper case for added protection.", imageSrc: "https://images.unsplash.com/photo-1519681393784-d120267933ba?w=800&q=80", imageAlt: "Bumper Case" },
{ id: "4", title: "Screen Protector", description: "Keep your iPhone screen scratch-free with this high-quality protector.", imageSrc: "https://images.unsplash.com/photo-1519681393784-d120267933ba?w=800&q=80", imageAlt: "Screen Protector" }
]} carouselMode="buttons" gridVariant="timeline" title="iPhone Accessories" description="Explore our range of iPhone accessories to enhance your device." buttons={[{ text: "Shop Now", href: "#" }]} textboxLayout="left" useInvertedBackground="light" ariaLabel="iPhone Accessories Section" className="mb-8" />
</div>
<div id="team" data-section="team">
<TeamCardOne1
title="Meet Our Team"
description="Discover the talented individuals who bring iPhone Store to life."
members={[
{ id: "1", name: "Eve Wilson", role: "Founder & CEO", imageSrc: "https://images.unsplash.com/photo-1519681393784-d120267933ba?w=800&q=80" },
{ id: "2", name: "Frank Lee", role: "CTO", imageSrc: "https://images.unsplash.com/photo-1519681393784-d120267933ba?w=800&q=80" },
{ id: "3", name: "Grace Chen", role: "Head of Design", imageSrc: "https://images.unsplash.com/photo-1519681393784-d120267933ba?w=800&q=80" },
{ id: "4", name: "Hank Green", role: "Marketing Director", imageSrc: "https://images.unsplash.com/photo-1519681393784-d120267933ba?w=800&q=80" }
]}
gridVariant="grid"
animationType="slide"
textboxLayout="boxed"
useInvertedBackground="light"
/>
</div>
<div id="navbar" data-section="navbar">
<NavbarStyleApple
brandName="iPhone Store"
navItems={[
{ name: "iPhone 13", id: "products" },
{ name: "Waterproof Tech", id: "features" },
{ name: "Affordable Plans", id: "pricing" },
{ name: "Customer Reviews", id: "testimonials" }
]}
logoUrl="https://images.unsplash.com/photo-1519681393784-d120267933ba?w=800&q=80"
/>
</div>
<div id="navbar" data-section="navbar">
<NavbarStyleApple
brandName="iPhone Store"
navItems={[
{ name: "iPhone 13", id: "products-iphone-13", image: "https://images.unsplash.com/photo-1519681393784-d120267933ba?w=800&q=80" },
{ name: "Face ID", id: "features-face-id" },
{ name: "AppleCare+", id: "pricing-applecare" },
{ name: "Customer Reviews", id: "testimonials-customers" }
]}
/>
</div> </div>
<div id="footer" data-section="footer"> <div id="footer" data-section="footer">
<FooterBaseReveal <FooterBase1
columns={[ columns={[
{ {
title: "Products", items: [ title: "Products", items: [
{ label: "iPhone 15 Pro", href: "#products" }, { label: "iPhone 15 Pro", href: "#products" },
{ label: "iPhone 15", href: "#products" }, { label: "iPhone 15", href: "#products" },
{ label: "iPhone SE", href: "#products" }, { label: "iPhone SE", href: "#products" },
{ label: "Compare Models", href: "#pricing" } { label: "Apple Watch", href: "#products" }
] ]
}, },
{ {
title: "Support", items: [ title: "Support", items: [
{ label: "Help Center", href: "#contact" }, { label: "Help Center", href: "#contact" },
{ label: "Contact Us", href: "#contact" }, { label: "Contact Us", href: "#contact" },
{ label: "Warranty Info", href: "#" }, { label: "Warranty Info", href: "#" },
{ label: "Shipping & Returns", href: "#" } { label: "FAQs", href: "#" }
] ]
}, },
{ {
title: "Company", items: [ title: "Company", items: [
{ label: "About Us", href: "#" }, { label: "About Us", href: "#" },
{ label: "Blog", href: "#" }, { label: "Blog", href: "#" },
{ label: "Careers", href: "#" }, { label: "Careers", href: "#" },
{ label: "Press", href: "#" } { label: "Press Room", href: "#" }
] ]
} }
]} ]}
copyrightText="© 2025 iPhone Store. All rights reserved." copyrightText="© 2025 iPhone Store. All rights reserved."
/> logoUrl="https://images.unsplash.com/photo-1519681393784-d120267933ba?w=800&q=80"
/>
</div>
<div id="footer" data-section="footer">
<FooterBase1
columns={[
{
title: "Products", items: [
{ label: "iPhone 15 Pro", href: "#products" },
{ label: "iPhone 15", href: "#products" },
{ label: "iPhone SE", href: "#products" }
]
},
{
title: "Support", items: [
{ label: "Help Center", href: "#contact" },
{ label: "Contact Us", href: "#contact" },
{ label: "Warranty Info", href: "#" }
]
},
{
title: "Company", items: [
{ label: "About Us", href: "#" },
{ label: "Blog", href: "#" },
{ label: "Careers", href: "#" }
]
}
]}
copyrightText="© 2025 iPhone Store. All rights reserved."
logoUrl="https://images.unsplash.com/photo-1519681393784-d120267933ba?w=800&q=80"
/>
</div> </div>
</ThemeProvider> </ThemeProvider>
); );

View File

@@ -111,12 +111,12 @@ const ContactSplitForm = ({
const getButtonConfigProps = () => { const getButtonConfigProps = () => {
if (theme.defaultButtonVariant === "hover-bubble") { if (theme.defaultButtonVariant === "hover-bubble") {
return { bgClassName: "w-full" }; return { bgClassName: "w-full bg-green-500" };
} }
if (theme.defaultButtonVariant === "icon-arrow") { if (theme.defaultButtonVariant === "icon-arrow") {
return { className: "justify-between" }; return { className: "justify-between" };
} }
return {}; return { bgClassName: "bg-green-500" };
}; };
const formContent = ( const formContent = (

View File

@@ -91,7 +91,7 @@ const HeroBillboardScroll = ({
<section <section
aria-label={ariaLabel} aria-label={ariaLabel}
ref={containerRef} ref={containerRef}
className={cls("relative h-fit flex items-center justify-center", className)} className={cls("relative h-fit flex items-center justify-center bg-[#e5b365]", className)}
> >
<HeroBackgrounds {...background} /> <HeroBackgrounds {...background} />
<div <div
@@ -108,9 +108,9 @@ const HeroBillboardScroll = ({
tagIcon={tagIcon} tagIcon={tagIcon}
buttons={buttons} buttons={buttons}
className={cls("flex flex-col gap-3 md:gap-1", textBoxClassName)} className={cls("flex flex-col gap-3 md:gap-1", textBoxClassName)}
titleClassName={cls("text-6xl font-medium text-balance", titleClassName)} titleClassName={cls("text-6xl font-medium text-[#8b4513]", titleClassName)}
descriptionClassName={cls("text-base md:text-lg leading-[1.2]", descriptionClassName)} descriptionClassName={cls("text-base md:text-lg leading-[1.2]", descriptionClassName)}
tagClassName={cls("px-3 py-1 text-sm rounded-theme card text-foreground inline-flex items-center gap-2 mb-3", tagClassName)} tagClassName={cls("px-3 py-1 text-sm rounded-theme card text-[#8b4513] inline-flex items-center gap-2 mb-3", tagClassName)}
buttonContainerClassName={cls("flex flex-wrap gap-4 mt-3", buttonContainerClassName)} buttonContainerClassName={cls("flex flex-wrap gap-4 mt-3", buttonContainerClassName)}
buttonClassName={buttonClassName} buttonClassName={buttonClassName}
buttonTextClassName={buttonTextClassName} buttonTextClassName={buttonTextClassName}
@@ -126,7 +126,7 @@ const HeroBillboardScroll = ({
> >
<div className={cls("h-full w-full overflow-hidden rounded-theme-capped card p-4", cardInnerClassName)}> <div className={cls("h-full w-full overflow-hidden rounded-theme-capped card p-4", cardInnerClassName)}>
<MediaContent <MediaContent
imageSrc={imageSrc} imageSrc="https://images.unsplash.com/photo-1519681393784-d120267933ba?w=1920&q=80"
videoSrc={videoSrc} videoSrc={videoSrc}
imageAlt={imageAlt} imageAlt={imageAlt}
videoAriaLabel={videoAriaLabel} videoAriaLabel={videoAriaLabel}
@@ -144,7 +144,7 @@ const HeroBillboardScroll = ({
> >
<div className={cls("h-full w-full overflow-hidden rounded-theme-capped card p-4", cardInnerClassName)}> <div className={cls("h-full w-full overflow-hidden rounded-theme-capped card p-4", cardInnerClassName)}>
<MediaContent <MediaContent
imageSrc={imageSrc} imageSrc="https://images.unsplash.com/photo-1519681393784-d120267933ba?w=1920&q=80"
videoSrc={videoSrc} videoSrc={videoSrc}
imageAlt={imageAlt} imageAlt={imageAlt}
videoAriaLabel={videoAriaLabel} videoAriaLabel={videoAriaLabel}

View File

@@ -157,4 +157,27 @@ const HeroLogoBillboard = ({
HeroLogoBillboard.displayName = "HeroLogoBillboard"; HeroLogoBillboard.displayName = "HeroLogoBillboard";
export default HeroLogoBillboard; export default HeroLogoBillboard;
const darkBlueTheme = {
background: "bg-dark-blue",
foreground: "text-white",
accent: "bg-dark-blue-accent",
border: "border-white/10",
balance: "text-white/75",
};
HeroLogoBillboard.defaultProps = {
className: darkBlueTheme.background,
containerClassName: darkBlueTheme.background,
logoContainerClassName: darkBlueTheme.background,
logoClassName: darkBlueTheme.foreground,
descriptionClassName: darkBlueTheme.foreground,
buttonContainerClassName: darkBlueTheme.background,
buttonClassName: darkBlueTheme.foreground,
buttonTextClassName: darkBlueTheme.foreground,
mediaWrapperClassName: darkBlueTheme.background,
imageClassName: darkBlueTheme.foreground,
browserBarClassName: darkBlueTheme.background,
addressBarClassName: darkBlueTheme.background,
};