Update src/app/brands/[slug]/page.tsx
This commit is contained in:
@@ -3,55 +3,28 @@
|
||||
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
|
||||
import NavbarStyleFullscreen from "@/components/navbar/NavbarStyleFullscreen/NavbarStyleFullscreen";
|
||||
import HeroSplitTestimonial from "@/components/sections/hero/HeroSplitTestimonial";
|
||||
import TextSplitAbout from "@/components/sections/about/TextSplitAbout";
|
||||
import SocialProofOne from "@/components/sections/socialProof/SocialProofOne";
|
||||
import ProductCardTwo from "@/components/sections/product/ProductCardTwo";
|
||||
import FeatureCardTwentyFive from "@/components/sections/feature/FeatureCardTwentyFive";
|
||||
import BlogCardThree from "@/components/sections/blog/BlogCardThree";
|
||||
import MetricCardThree from "@/components/sections/metrics/MetricCardThree";
|
||||
import TextSplitAbout from "@/components/sections/about/TextSplitAbout";
|
||||
import FaqSplitMedia from "@/components/sections/faq/FaqSplitMedia";
|
||||
import ContactCTA from "@/components/sections/contact/ContactCTA";
|
||||
import FooterLogoEmphasis from "@/components/sections/footer/FooterLogoEmphasis";
|
||||
import { Car, Award, Zap } from "lucide-react";
|
||||
import Link from "next/link";
|
||||
import {
|
||||
Car,
|
||||
Zap,
|
||||
Award,
|
||||
Sparkles,
|
||||
Building2,
|
||||
History,
|
||||
Globe,
|
||||
Mail,
|
||||
} from "lucide-react";
|
||||
|
||||
export default function BrandDetailPage() {
|
||||
const navItems = [
|
||||
{ name: "Search", id: "search" },
|
||||
{ name: "Browse", id: "browse" },
|
||||
{ name: "Compare", id: "compare" },
|
||||
{ name: "Timeline", id: "timeline" },
|
||||
{ name: "About", id: "about" },
|
||||
];
|
||||
|
||||
const footerColumns = [
|
||||
{
|
||||
items: [
|
||||
{ label: "Search Database", href: "/search" },
|
||||
{ label: "Browse Vehicles", href: "/browse" },
|
||||
{ label: "Compare Cars", href: "/compare" },
|
||||
{ label: "Timeline Explorer", href: "/timeline" },
|
||||
],
|
||||
},
|
||||
{
|
||||
items: [
|
||||
{ label: "Brand Directory", href: "/brands" },
|
||||
{ label: "Model Guide", href: "/models" },
|
||||
{ label: "Specifications", href: "/specs" },
|
||||
{ label: "Production Data", href: "/production" },
|
||||
],
|
||||
},
|
||||
{
|
||||
items: [
|
||||
{ label: "About Us", href: "/about" },
|
||||
{ label: "Help & Support", href: "/help" },
|
||||
{ label: "Contact", href: "/contact" },
|
||||
{ label: "Contribute Data", href: "/contribute" },
|
||||
],
|
||||
},
|
||||
{
|
||||
items: [
|
||||
{ label: "Privacy Policy", href: "/privacy" },
|
||||
{ label: "Terms of Service", href: "/terms" },
|
||||
{ label: "Data Attribution", href: "/attribution" },
|
||||
{ label: "Sitemap", href: "/sitemap" },
|
||||
],
|
||||
},
|
||||
];
|
||||
|
||||
return (
|
||||
<ThemeProvider
|
||||
defaultButtonVariant="shift-hover"
|
||||
@@ -67,153 +40,257 @@ export default function BrandDetailPage() {
|
||||
>
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarStyleFullscreen
|
||||
navItems={navItems}
|
||||
navItems={[
|
||||
{ name: "Search", id: "/search" },
|
||||
{ name: "Browse", id: "/browse" },
|
||||
{ name: "Compare", id: "/compare" },
|
||||
{ name: "Timeline", id: "/timeline" },
|
||||
{ name: "About", id: "/about" },
|
||||
]}
|
||||
brandName="AutoArchive"
|
||||
bottomLeftText="Explore Automotive History"
|
||||
bottomRightText="1886 to Present"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="brand-hero" data-section="brand-hero">
|
||||
<div id="hero" data-section="hero">
|
||||
<HeroSplitTestimonial
|
||||
title="Ferrari: The Prancing Horse Legacy"
|
||||
description="Discover the complete history of Ferrari, from Enzo's vision in 1947 to today's hybrid hypercars. Explore every model, generation, and legendary achievement."
|
||||
tag="Brand Heritage"
|
||||
title="Brand Heritage"
|
||||
description="Explore the complete history and legacy of this iconic automotive manufacturer."
|
||||
tag="Brand Details"
|
||||
tagIcon={Car}
|
||||
tagAnimation="entrance-slide"
|
||||
background={{ variant: "aurora" }}
|
||||
imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AaEFWytZ9QS584IizrKmiAvruy/a-pristine-ferrari-250-gto-from-1962-196-1772823293817-62111fec.png?_wi=3"
|
||||
imageAlt="Ferrari 250 GTO Classic"
|
||||
mediaAnimation="entrance-slide"
|
||||
tagAnimation="slide-up"
|
||||
background={{ variant: "plain" }}
|
||||
imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AaEFWytZ9QS584IizrKmiAvruy/a-modern-sleek-automotive-database-inter-1772823292340-23f02fb5.png"
|
||||
imageAlt="Brand Overview"
|
||||
mediaAnimation="slide-up"
|
||||
imagePosition="right"
|
||||
testimonials={[
|
||||
{
|
||||
name: "Racing Historian",
|
||||
handle: "Classic Car Enthusiast",
|
||||
testimonial: "Ferrari's design language has remained unmistakable for over 75 years. A true automotive icon.",
|
||||
rating: 5,
|
||||
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AaEFWytZ9QS584IizrKmiAvruy/small-circular-avatar-portrait-of-an-aut-1772823290144-6017089c.png",
|
||||
},
|
||||
{
|
||||
name: "Automotive Designer",
|
||||
handle: "Design Expert",
|
||||
testimonial: "Every Ferrari represents the pinnacle of automotive design and engineering excellence.",
|
||||
rating: 5,
|
||||
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AaEFWytZ9QS584IizrKmiAvruy/small-circular-avatar-portrait-of-an-aut-1772823290583-29073bf8.png?_wi=1",
|
||||
},
|
||||
{
|
||||
name: "Collector",
|
||||
handle: "Vintage Vehicle Curator",
|
||||
testimonial: "Ferrari's heritage and performance records make it the world's most coveted brand.",
|
||||
rating: 5,
|
||||
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AaEFWytZ9QS584IizrKmiAvruy/small-circular-avatar-portrait-of-a-tech-1772823290751-a93bf9d8.png",
|
||||
},
|
||||
name: "Brand Enthusiast", handle: "Automotive Expert", testimonial:
|
||||
"A comprehensive overview of this legendary brand's evolution and impact.", rating: 5,
|
||||
imageSrc:
|
||||
"https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AaEFWytZ9QS584IizrKmiAvruy/portrait-of-a-knowledgeable-automotive-h-1772823290619-648d0b48.png"},
|
||||
]}
|
||||
testimonialRotationInterval={5000}
|
||||
buttons={[
|
||||
{ text: "View All Models", href: "/browse" },
|
||||
{ text: "Compare Ferraris", href: "/compare" },
|
||||
{ text: "View Models", href: "/browse" },
|
||||
{ text: "Compare", href: "/compare" },
|
||||
]}
|
||||
buttonAnimation="entrance-slide"
|
||||
buttonAnimation="slide-up"
|
||||
useInvertedBackground={false}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="brand-about" data-section="brand-about">
|
||||
<TextSplitAbout
|
||||
title="The Ferrari Story"
|
||||
description={[
|
||||
"Founded in 1947 by Enzo Ferrari, the company began as a race team before producing street-legal vehicles. Enzo's philosophy—'Competition is necessary for the creation of efficient vehicles'—still guides Ferrari today.",
|
||||
"From the legendary 125 S to the groundbreaking SF90 Stradale, Ferrari has consistently pushed the boundaries of automotive engineering and design. Every model represents years of racing experience translated into production vehicles.",
|
||||
"With over 13,000 vehicles built across 75 years, Ferrari remains the most exclusive and sought-after supercar manufacturer in the world. The prancing horse emblem symbolizes speed, performance, and uncompromising excellence.",
|
||||
<div id="popular-brands" data-section="popular-brands">
|
||||
<SocialProofOne
|
||||
title="Related Brands"
|
||||
description="Explore other iconic manufacturers in our database"
|
||||
tag="Similar Brands"
|
||||
tagAnimation="slide-up"
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
names=[
|
||||
"Ferrari", "Porsche", "BMW", "Mercedes-Benz", "Lamborghini"]
|
||||
speed={40}
|
||||
showCard={true}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="featured-vehicles" data-section="featured-vehicles">
|
||||
<ProductCardTwo
|
||||
title="Iconic Models"
|
||||
description="The most famous vehicles from this brand"
|
||||
tag="Heritage Collection"
|
||||
tagAnimation="slide-up"
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
animationType="slide-up"
|
||||
gridVariant="four-items-2x2-equal-grid"
|
||||
products={[
|
||||
{
|
||||
id: "1", brand: "Brand", name: "Model One", price: "Classic Era", rating: 5,
|
||||
reviewCount: "Legendary", imageSrc:
|
||||
"https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AaEFWytZ9QS584IizrKmiAvruy/a-pristine-ferrari-250-gto-from-1962-196-1772823293817-62111fec.png?_wi=1", imageAlt: "Model One"},
|
||||
{
|
||||
id: "2", brand: "Brand", name: "Model Two", price: "Modern Era", rating: 5,
|
||||
reviewCount: "Iconic", imageSrc:
|
||||
"https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AaEFWytZ9QS584IizrKmiAvruy/a-timeless-porsche-911-silver-or-charcoa-1772823291321-59c5e153.png?_wi=1", imageAlt: "Model Two"},
|
||||
{
|
||||
id: "3", brand: "Brand", name: "Model Three", price: "Performance", rating: 5,
|
||||
reviewCount: "Historic", imageSrc:
|
||||
"https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AaEFWytZ9QS584IizrKmiAvruy/a-beautiful-jaguar-e-type-from-1961-1974-1772823292102-305f7185.png?_wi=1", imageAlt: "Model Three"},
|
||||
{
|
||||
id: "4", brand: "Brand", name: "Model Four", price: "Contemporary", rating: 5,
|
||||
reviewCount: "Classic", imageSrc:
|
||||
"https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AaEFWytZ9QS584IizrKmiAvruy/a-classic-bmw-2002-from-1968-1976-bright-1772823292733-3909ad83.png?_wi=1", imageAlt: "Model Four"},
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="browse-decade" data-section="browse-decade">
|
||||
<FeatureCardTwentyFive
|
||||
title="Brand Timeline"
|
||||
description="Explore the brand's evolution across different eras"
|
||||
tag="Historical Overview"
|
||||
tagAnimation="slide-up"
|
||||
animationType="depth-3d"
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
features={[
|
||||
{
|
||||
title: "Foundation Era (1900-1920s)", description: "The early years of the brand's establishment", icon: Zap,
|
||||
mediaItems: [
|
||||
{
|
||||
imageSrc:
|
||||
"https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AaEFWytZ9QS584IizrKmiAvruy/early-1900s-automobiles-brass-and-iron-c-1772823291918-1a562875.png?_wi=1", imageAlt: "Foundation Era"},
|
||||
{
|
||||
imageSrc:
|
||||
"https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AaEFWytZ9QS584IizrKmiAvruy/collection-of-classic-automobiles-from-1-1772823292369-d23ee272.png?_wi=1", imageAlt: "Early Development"},
|
||||
],
|
||||
},
|
||||
{
|
||||
title: "Golden Age (1930-1950s)", description: "Period of design excellence and innovation", icon: Award,
|
||||
mediaItems: [
|
||||
{
|
||||
imageSrc:
|
||||
"https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AaEFWytZ9QS584IizrKmiAvruy/1930s-1950s-classic-cars-showcasing-art--1772823292276-01b2e0ec.png?_wi=1", imageAlt: "Golden Age Design"},
|
||||
{
|
||||
imageSrc:
|
||||
"https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AaEFWytZ9QS584IizrKmiAvruy/post-world-war-ii-automobiles-from-1945--1772823292672-0ffd3a1d.png?_wi=1", imageAlt: "Post-War Innovation"},
|
||||
],
|
||||
},
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="legendary-cars" data-section="legendary-cars">
|
||||
<BlogCardThree
|
||||
title="Brand Stories"
|
||||
description="Discover the history and impact of this automotive brand"
|
||||
tag="Heritage"
|
||||
tagAnimation="slide-up"
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
animationType="slide-up"
|
||||
carouselMode="buttons"
|
||||
blogs={[
|
||||
{
|
||||
id: "1", category: "History", title: "Brand Origins and Development", excerpt: "Explore the founding story and early years", imageSrc:
|
||||
"https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AaEFWytZ9QS584IizrKmiAvruy/ferrari-250-gto-iconic-red-racing-car-in-1772823292116-a7e77200.png?_wi=1", imageAlt: "Brand History", authorName: "Automotive Historian", authorAvatar:
|
||||
"https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AaEFWytZ9QS584IizrKmiAvruy/small-circular-avatar-portrait-of-an-aut-1772823290144-6017089c.png", date: "Featured Article"},
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="metrics" data-section="metrics">
|
||||
<MetricCardThree
|
||||
title="Brand Statistics"
|
||||
description="Key numbers in brand history"
|
||||
tag="By The Numbers"
|
||||
tagAnimation="slide-up"
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
animationType="scale-rotate"
|
||||
metrics={[
|
||||
{
|
||||
id: "1", icon: Building2,
|
||||
title: "Founded", value: "1886"},
|
||||
{
|
||||
id: "2", icon: Car,
|
||||
title: "Models", value: "100+"},
|
||||
{
|
||||
id: "3", icon: History,
|
||||
title: "Years Active", value: "138"},
|
||||
{
|
||||
id: "4", icon: Globe,
|
||||
title: "Countries", value: "50+"},
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="about" data-section="about">
|
||||
<TextSplitAbout
|
||||
title="About This Brand"
|
||||
description={[
|
||||
"This iconic automotive brand has been a leader in innovation and design for over a century.", "From its humble beginnings to its current position as an industry pioneer, this manufacturer has consistently delivered excellence.", "Our database provides comprehensive information about every model and generation produced by this legendary brand."]}
|
||||
showBorder={true}
|
||||
useInvertedBackground={false}
|
||||
buttons={[
|
||||
{ text: "Browse All Models", href: "/browse" },
|
||||
{ text: "View Timeline", href: "/timeline" },
|
||||
{ text: "View Models", href: "/browse" },
|
||||
{ text: "Search Database", href: "/search" },
|
||||
]}
|
||||
buttonAnimation="entrance-slide"
|
||||
buttonAnimation="slide-up"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="brand-models" data-section="brand-models">
|
||||
<FeatureCardTwentyFive
|
||||
features={[
|
||||
{
|
||||
title: "Classic Era (1947-1970)",
|
||||
description: "The foundation of Ferrari excellence with hand-built race cars and early road vehicles.",
|
||||
icon: Award,
|
||||
mediaItems: [
|
||||
{
|
||||
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AaEFWytZ9QS584IizrKmiAvruy/a-pristine-ferrari-250-gto-from-1962-196-1772823293817-62111fec.png?_wi=4",
|
||||
imageAlt: "Ferrari 250 GTO",
|
||||
},
|
||||
{
|
||||
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AaEFWytZ9QS584IizrKmiAvruy/1930s-1950s-classic-cars-showcasing-art--1772823292276-01b2e0ec.png?_wi=3",
|
||||
imageAlt: "Classic Ferrari Models",
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
title: "Golden Age (1970-1990)",
|
||||
description: "Revolutionary designs like the Daytona and Testarossa defined an era of automotive excellence.",
|
||||
icon: Zap,
|
||||
mediaItems: [
|
||||
{
|
||||
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AaEFWytZ9QS584IizrKmiAvruy/1980s-performance-vehicles-and-supercars-1772823291859-2f85f5af.png?_wi=3",
|
||||
imageAlt: "1980s Ferrari Models",
|
||||
},
|
||||
{
|
||||
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AaEFWytZ9QS584IizrKmiAvruy/blog-ferrari-250-gto-1772823292116-a7e77200.png",
|
||||
imageAlt: "Ferrari Heritage",
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
title: "Modern Era (1990-2010)",
|
||||
description: "V12 masterpieces and modern engineering merged traditional values with cutting-edge technology.",
|
||||
icon: Car,
|
||||
mediaItems: [
|
||||
{
|
||||
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AaEFWytZ9QS584IizrKmiAvruy/1990s-modern-cars-featuring-sleek-sports-1772823291648-3191a1df.png?_wi=3",
|
||||
imageAlt: "1990s Ferrari Models",
|
||||
},
|
||||
{
|
||||
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AaEFWytZ9QS584IizrKmiAvruy/a-timeless-porsche-911-silver-or-charcoa-1772823291321-59c5e153.png?_wi=3",
|
||||
imageAlt: "Modern Performance Era",
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
title: "Hybrid Revolution (2010-Present)",
|
||||
description: "Advanced hybrid systems combine electric power with twin-turbo engines for unprecedented performance.",
|
||||
icon: Zap,
|
||||
mediaItems: [
|
||||
{
|
||||
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AaEFWytZ9QS584IizrKmiAvruy/modern-2020s-electric-and-autonomous-veh-1772823292629-c57b318c.png?_wi=3",
|
||||
imageAlt: "Modern Ferrari Hybrid",
|
||||
},
|
||||
{
|
||||
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AaEFWytZ9QS584IizrKmiAvruy/blog-tesla-revolution-1772823291685-64082b06.png",
|
||||
imageAlt: "Future of Ferrari",
|
||||
},
|
||||
],
|
||||
},
|
||||
]}
|
||||
animationType="depth-3d"
|
||||
title="Ferrari Model Evolution"
|
||||
description="Explore the iconic lineages and generations that shaped Ferrari's legendary heritage"
|
||||
tag="Heritage Collection"
|
||||
tagAnimation="entrance-slide"
|
||||
<div id="faq" data-section="faq">
|
||||
<FaqSplitMedia
|
||||
title="Brand FAQs"
|
||||
description="Common questions about this manufacturer"
|
||||
tag="Help"
|
||||
tagAnimation="slide-up"
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
mediaAnimation="slide-up"
|
||||
faqsAnimation="slide-up"
|
||||
imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AaEFWytZ9QS584IizrKmiAvruy/modern-customer-support-and-help-resourc-1772823291668-afcab7fc.png"
|
||||
imageAlt="Brand Support"
|
||||
mediaPosition="left"
|
||||
faqs={[
|
||||
{
|
||||
id: "1", title: "When was this brand founded?", content: "This brand was founded in the late 19th century and has been producing vehicles ever since."},
|
||||
{
|
||||
id: "2", title: "How many models has this brand produced?", content: "The brand has produced over 100 different models throughout its history, with countless generations and variants."},
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="cta" data-section="cta">
|
||||
<ContactCTA
|
||||
tag="Explore More"
|
||||
tagIcon={Zap}
|
||||
tagAnimation="slide-up"
|
||||
title="Discover More About This Brand"
|
||||
description="Browse our complete database of models, specifications, and historical information about this iconic manufacturer."
|
||||
buttons={[
|
||||
{ text: "View All Models", href: "/browse" },
|
||||
{ text: "Compare Vehicles", href: "/compare" },
|
||||
]}
|
||||
buttonAnimation="slide-up"
|
||||
background={{ variant: "plain" }}
|
||||
useInvertedBackground={false}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="brand-footer" data-section="brand-footer">
|
||||
<FooterLogoEmphasis columns={footerColumns} logoText="AutoArchive" />
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterLogoEmphasis
|
||||
logoText="AutoArchive"
|
||||
columns={[
|
||||
{
|
||||
items: [
|
||||
{ label: "Search Database", href: "/search" },
|
||||
{ label: "Browse Vehicles", href: "/browse" },
|
||||
{ label: "Compare Cars", href: "/compare" },
|
||||
],
|
||||
},
|
||||
{
|
||||
items: [
|
||||
{ label: "About Us", href: "/" },
|
||||
{ label: "Help & Support", href: "/help" },
|
||||
{ label: "Contact", href: "/contact" },
|
||||
],
|
||||
},
|
||||
{
|
||||
items: [
|
||||
{ label: "Privacy Policy", href: "/privacy" },
|
||||
{ label: "Terms of Service", href: "/terms" },
|
||||
{ label: "Sitemap", href: "/sitemap" },
|
||||
],
|
||||
},
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
</ThemeProvider>
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user