Compare commits
4 Commits
| Author | SHA1 | Date | |
|---|---|---|---|
| 5aaca79216 | |||
| 98e4f3e4a7 | |||
| 439f7fec68 | |||
| 189adf3865 |
408
src/app/page.tsx
408
src/app/page.tsx
@@ -1,16 +1,6 @@
|
|||||||
"use client"
|
"use client";
|
||||||
|
|
||||||
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
|
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
|
||||||
import NavbarStyleCentered from '@/components/navbar/NavbarStyleCentered/NavbarStyleCentered';
|
|
||||||
import HeroLogoBillboardSplit from '@/components/sections/hero/HeroLogoBillboardSplit';
|
|
||||||
import ParallaxAbout from '@/components/sections/about/ParallaxAbout';
|
|
||||||
import FeatureCardTwenty from '@/components/sections/feature/FeatureCardTwenty';
|
|
||||||
import TeamCardOne from '@/components/sections/team/TeamCardOne';
|
|
||||||
import TestimonialCardTwelve from '@/components/sections/testimonial/TestimonialCardTwelve';
|
|
||||||
import FaqSplitMedia from '@/components/sections/faq/FaqSplitMedia';
|
|
||||||
import BlogCardFive from '@/components/sections/blog/BlogCardFive';
|
|
||||||
import ContactSplitForm from '@/components/sections/contact/ContactSplitForm';
|
|
||||||
import FooterBase from '@/components/sections/footer/FooterBase';
|
|
||||||
|
|
||||||
export default function StarWarsPage() {
|
export default function StarWarsPage() {
|
||||||
return (
|
return (
|
||||||
@@ -27,201 +17,261 @@ export default function StarWarsPage() {
|
|||||||
headingFontWeight="semibold"
|
headingFontWeight="semibold"
|
||||||
>
|
>
|
||||||
<div id="nav" data-section="nav">
|
<div id="nav" data-section="nav">
|
||||||
<NavbarStyleCentered
|
<div className="flex items-center justify-between p-4">
|
||||||
brandName="Star Wars Fans"
|
<div className="text-xl font-semibold">Star Wars Fans</div>
|
||||||
navItems={[
|
<nav className="flex space-x-6">
|
||||||
{ name: "Home", id: "home" },
|
<a href="#home" className="hover:text-primary transition-colors">Home</a>
|
||||||
{ name: "Community", id: "about" },
|
<a href="#about" className="hover:text-primary transition-colors">Community</a>
|
||||||
{ name: "News", id: "blog" },
|
<a href="#blog" className="hover:text-primary transition-colors">News</a>
|
||||||
{ name: "Members", id: "team" },
|
<a href="#team" className="hover:text-primary transition-colors">Members</a>
|
||||||
{ name: "Contact", id: "contact" }
|
<a href="#contact" className="hover:text-primary transition-colors">Contact</a>
|
||||||
]}
|
</nav>
|
||||||
button={{ text: "Join Us", href: "contact" }}
|
<a href="#contact" className="px-4 py-2 bg-primary text-white rounded-lg hover:bg-primary/80 transition-colors">Join Us</a>
|
||||||
/>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div id="hero" data-section="hero">
|
<div id="hero" data-section="hero">
|
||||||
<HeroLogoBillboardSplit
|
<section className="py-20 px-6">
|
||||||
logoText="STAR WARS"
|
<div className="max-w-6xl mx-auto text-center">
|
||||||
description="Join the ultimate community for Star Wars fans. Connect with fellow enthusiasts, share your passion, and explore the galaxy together."
|
<h1 className="text-5xl font-bold mb-6">STAR WARS</h1>
|
||||||
buttons={[
|
<p className="text-xl mb-8 max-w-3xl mx-auto">Join the ultimate community for Star Wars fans. Connect with fellow enthusiasts, share your passion, and explore the galaxy together.</p>
|
||||||
{ text: "Explore Community", href: "about" },
|
<div className="space-x-4">
|
||||||
{ text: "Latest News", href: "blog" }
|
<a href="#about" className="inline-block px-6 py-3 bg-primary text-white rounded-lg hover:bg-primary/80 transition-colors">Explore Community</a>
|
||||||
]}
|
<a href="#blog" className="inline-block px-6 py-3 border border-primary text-primary rounded-lg hover:bg-primary hover:text-white transition-colors">Latest News</a>
|
||||||
layoutOrder="default"
|
</div>
|
||||||
imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766502903034-h9gvp12t.png"
|
<div className="mt-12">
|
||||||
imageAlt="Star Wars galaxy backdrop"
|
<img src="https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766502903034-h9gvp12t.png" alt="Star Wars galaxy backdrop" className="w-full h-96 object-cover rounded-lg" />
|
||||||
frameStyle="card"
|
</div>
|
||||||
/>
|
</div>
|
||||||
|
</section>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div id="about" data-section="about">
|
<div id="about" data-section="about">
|
||||||
<ParallaxAbout
|
<section className="py-20 px-6">
|
||||||
title="Welcome to the Galaxy"
|
<div className="max-w-6xl mx-auto">
|
||||||
description="We are a thriving community dedicated to celebrating everything Star Wars. From the original trilogy to the latest series, we bring fans together to discuss, celebrate, and share their love for this iconic universe."
|
<div className="grid grid-cols-1 lg:grid-cols-2 gap-12 items-center">
|
||||||
tag="About Us"
|
<div>
|
||||||
imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766502904271-z2pntgqf.jpg"
|
<span className="text-sm font-medium text-primary mb-2 block">About Us</span>
|
||||||
imageAlt="Star Wars universe"
|
<h2 className="text-4xl font-bold mb-6">Welcome to the Galaxy</h2>
|
||||||
buttons={[{ text: "Learn More", href: "contact" }]}
|
<p className="text-lg mb-8">We are a thriving community dedicated to celebrating everything Star Wars. From the original trilogy to the latest series, we bring fans together to discuss, celebrate, and share their love for this iconic universe.</p>
|
||||||
/>
|
<a href="#contact" className="inline-block px-6 py-3 bg-primary text-white rounded-lg hover:bg-primary/80 transition-colors">Learn More</a>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<img src="https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766502904271-z2pntgqf.jpg" alt="Star Wars universe" className="w-full h-96 object-cover rounded-lg" />
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div id="features" data-section="features">
|
<div id="features" data-section="features">
|
||||||
<FeatureCardTwenty
|
<section className="py-20 px-6">
|
||||||
title="What We Offer"
|
<div className="max-w-6xl mx-auto">
|
||||||
description="Connect with the community through various activities and resources designed for Star Wars enthusiasts of all levels."
|
<div className="text-center mb-12">
|
||||||
images={[
|
<h2 className="text-4xl font-bold mb-6">What We Offer</h2>
|
||||||
{ id: 1, imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766502906375-82uc6wjl.jpg" },
|
<p className="text-lg max-w-3xl mx-auto mb-8">Connect with the community through various activities and resources designed for Star Wars enthusiasts of all levels.</p>
|
||||||
{ id: 2, imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766502907661-wjlq2nxn.jpg" },
|
</div>
|
||||||
{ id: 3, imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766502910619-wwr2g7a8.jpg" },
|
<div className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-4 gap-6 mb-8">
|
||||||
{ id: 4, imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766502903034-h9gvp12t.png" }
|
<img src="https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766502906375-82uc6wjl.jpg" alt="Feature 1" className="w-full h-48 object-cover rounded-lg" />
|
||||||
]}
|
<img src="https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766502907661-wjlq2nxn.jpg" alt="Feature 2" className="w-full h-48 object-cover rounded-lg" />
|
||||||
textboxLayout="default"
|
<img src="https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766502910619-wwr2g7a8.jpg" alt="Feature 3" className="w-full h-48 object-cover rounded-lg" />
|
||||||
useInvertedBackground="noInvert"
|
<img src="https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766502903034-h9gvp12t.png" alt="Feature 4" className="w-full h-48 object-cover rounded-lg" />
|
||||||
buttons={[{ text: "Join Now", href: "contact" }]}
|
</div>
|
||||||
/>
|
<div className="text-center">
|
||||||
|
<a href="#contact" className="inline-block px-6 py-3 bg-primary text-white rounded-lg hover:bg-primary/80 transition-colors">Join Now</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div id="team" data-section="team">
|
<div id="team" data-section="team">
|
||||||
<TeamCardOne
|
<section className="py-20 px-6">
|
||||||
title="Community Leaders"
|
<div className="max-w-6xl mx-auto">
|
||||||
description="Meet the passionate individuals leading our Star Wars fan community."
|
<div className="text-center mb-12">
|
||||||
members={[
|
<h2 className="text-4xl font-bold mb-6">Community Leaders</h2>
|
||||||
{ id: "1", name: "Luke S.", role: "Community Manager", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766414401529-6db20epg.jpg" },
|
<p className="text-lg max-w-3xl mx-auto">Meet the passionate individuals leading our Star Wars fan community.</p>
|
||||||
{ id: "2", name: "Leia M.", role: "Content Director", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766492697041-9adqfrju.jpg" },
|
</div>
|
||||||
{ id: "3", name: "Han C.", role: "Events Coordinator", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766502911819-f5rnce5q.jpg" }
|
<div className="grid grid-cols-1 md:grid-cols-3 gap-8">
|
||||||
]}
|
<div className="text-center">
|
||||||
textboxLayout="default"
|
<img src="https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766414401529-6db20epg.jpg" alt="Luke S." className="w-32 h-32 rounded-full mx-auto mb-4 object-cover" />
|
||||||
animationType="slide-up"
|
<h3 className="text-xl font-semibold mb-2">Luke S.</h3>
|
||||||
useInvertedBackground="noInvert"
|
<p className="text-gray-600">Community Manager</p>
|
||||||
gridVariant="uniform-all-items-equal"
|
</div>
|
||||||
/>
|
<div className="text-center">
|
||||||
|
<img src="https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766492697041-9adqfrju.jpg" alt="Leia M." className="w-32 h-32 rounded-full mx-auto mb-4 object-cover" />
|
||||||
|
<h3 className="text-xl font-semibold mb-2">Leia M.</h3>
|
||||||
|
<p className="text-gray-600">Content Director</p>
|
||||||
|
</div>
|
||||||
|
<div className="text-center">
|
||||||
|
<img src="https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766502911819-f5rnce5q.jpg" alt="Han C." className="w-32 h-32 rounded-full mx-auto mb-4 object-cover" />
|
||||||
|
<h3 className="text-xl font-semibold mb-2">Han C.</h3>
|
||||||
|
<p className="text-gray-600">Events Coordinator</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div id="testimonials" data-section="testimonials">
|
<div id="testimonials" data-section="testimonials">
|
||||||
<TestimonialCardTwelve
|
<section className="py-20 px-6">
|
||||||
testimonials={[
|
<div className="max-w-6xl mx-auto">
|
||||||
{ id: "1", name: "Alex J.", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766502912600-84fr3x4z.jpg" },
|
<div className="text-center mb-12">
|
||||||
{ id: "2", name: "Sarah K.", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766502913367-8j5yog7q.jpg" },
|
<span className="text-sm font-medium text-primary mb-2 block">Community Stories</span>
|
||||||
{ id: "3", name: "Michael T.", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766502914201-sdgv9pae.jpg" },
|
<h2 className="text-4xl font-bold mb-6">Join thousands of Star Wars fans connecting and sharing their passion every day</h2>
|
||||||
{ id: "4", name: "Emma R.", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766502914968-w4h9h050.jpg" }
|
</div>
|
||||||
]}
|
<div className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-4 gap-6">
|
||||||
cardTitle="Join thousands of Star Wars fans connecting and sharing their passion every day"
|
<div className="text-center">
|
||||||
cardTag="Community Stories"
|
<img src="https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766502912600-84fr3x4z.jpg" alt="Alex J." className="w-20 h-20 rounded-full mx-auto mb-4 object-cover" />
|
||||||
useInvertedBackground="noInvert"
|
<h4 className="font-semibold">Alex J.</h4>
|
||||||
/>
|
</div>
|
||||||
|
<div className="text-center">
|
||||||
|
<img src="https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766502913367-8j5yog7q.jpg" alt="Sarah K." className="w-20 h-20 rounded-full mx-auto mb-4 object-cover" />
|
||||||
|
<h4 className="font-semibold">Sarah K.</h4>
|
||||||
|
</div>
|
||||||
|
<div className="text-center">
|
||||||
|
<img src="https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766502914201-sdgv9pae.jpg" alt="Michael T." className="w-20 h-20 rounded-full mx-auto mb-4 object-cover" />
|
||||||
|
<h4 className="font-semibold">Michael T.</h4>
|
||||||
|
</div>
|
||||||
|
<div className="text-center">
|
||||||
|
<img src="https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766502914968-w4h9h050.jpg" alt="Emma R." className="w-20 h-20 rounded-full mx-auto mb-4 object-cover" />
|
||||||
|
<h4 className="font-semibold">Emma R.</h4>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div id="faq" data-section="faq">
|
<div id="faq" data-section="faq">
|
||||||
<FaqSplitMedia
|
<section className="py-20 px-6">
|
||||||
title="Frequently Asked Questions"
|
<div className="max-w-6xl mx-auto">
|
||||||
description="Find answers to common questions about our community and membership."
|
<div className="grid grid-cols-1 lg:grid-cols-2 gap-12">
|
||||||
faqs={[
|
<div>
|
||||||
{
|
<h2 className="text-4xl font-bold mb-6">Frequently Asked Questions</h2>
|
||||||
id: "1",
|
<p className="text-lg mb-8">Find answers to common questions about our community and membership.</p>
|
||||||
title: "How do I join the community?",
|
<div className="space-y-6">
|
||||||
content: "Joining is simple! Complete our registration form on the contact page and you will receive confirmation within 24 hours. Membership is free and open to all Star Wars enthusiasts."
|
<div className="border-b pb-4">
|
||||||
},
|
<h3 className="text-xl font-semibold mb-2">How do I join the community?</h3>
|
||||||
{
|
<p>Joining is simple! Complete our registration form on the contact page and you will receive confirmation within 24 hours. Membership is free and open to all Star Wars enthusiasts.</p>
|
||||||
id: "2",
|
</div>
|
||||||
title: "What events do you organize?",
|
<div className="border-b pb-4">
|
||||||
content: "We organize monthly movie screenings, discussion forums, fan meetups, and exclusive viewing events for new releases. Check our news section for upcoming events."
|
<h3 className="text-xl font-semibold mb-2">What events do you organize?</h3>
|
||||||
},
|
<p>We organize monthly movie screenings, discussion forums, fan meetups, and exclusive viewing events for new releases. Check our news section for upcoming events.</p>
|
||||||
{
|
</div>
|
||||||
id: "3",
|
<div className="border-b pb-4">
|
||||||
title: "Is there a membership fee?",
|
<h3 className="text-xl font-semibold mb-2">Is there a membership fee?</h3>
|
||||||
content: "No, our community is completely free to join. We rely on volunteer members and donations to keep our community running smoothly."
|
<p>No, our community is completely free to join. We rely on volunteer members and donations to keep our community running smoothly.</p>
|
||||||
},
|
</div>
|
||||||
{
|
<div className="border-b pb-4">
|
||||||
id: "4",
|
<h3 className="text-xl font-semibold mb-2">Can I share fan content?</h3>
|
||||||
title: "Can I share fan content?",
|
<p>Absolutely! We encourage members to share fan art, theories, reviews, and creative content. Please respect copyright and community guidelines when sharing.</p>
|
||||||
content: "Absolutely! We encourage members to share fan art, theories, reviews, and creative content. Please respect copyright and community guidelines when sharing."
|
</div>
|
||||||
}
|
</div>
|
||||||
]}
|
</div>
|
||||||
imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766502905270-5whkj6nu.jpg"
|
<div>
|
||||||
imageAlt="Star Wars galaxy"
|
<img src="https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766502905270-5whkj6nu.jpg" alt="Star Wars galaxy" className="w-full h-full object-cover rounded-lg" />
|
||||||
textboxLayout="default"
|
</div>
|
||||||
useInvertedBackground="noInvert"
|
</div>
|
||||||
mediaPosition="right"
|
</div>
|
||||||
/>
|
</section>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div id="blog" data-section="blog">
|
<div id="blog" data-section="blog">
|
||||||
<BlogCardFive
|
<section className="py-20 px-6">
|
||||||
title="Latest Updates"
|
<div className="max-w-6xl mx-auto">
|
||||||
description="Stay informed with the latest news, reviews, and discussions from the Star Wars universe."
|
<div className="text-center mb-12">
|
||||||
blogs={[
|
<h2 className="text-4xl font-bold mb-6">Latest Updates</h2>
|
||||||
{
|
<p className="text-lg max-w-3xl mx-auto">Stay informed with the latest news, reviews, and discussions from the Star Wars universe.</p>
|
||||||
id: "1",
|
</div>
|
||||||
title: "A New Hope: The Latest Series Announcement",
|
<div className="grid grid-cols-1 md:grid-cols-2 gap-8">
|
||||||
items: ["News", "Jan 15, 2025", "5 min read"],
|
<div className="bg-white rounded-lg shadow-lg overflow-hidden">
|
||||||
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766502908501-qegkac9j.jpg"
|
<img src="https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766502908501-qegkac9j.jpg" alt="A New Hope" className="w-full h-48 object-cover" />
|
||||||
},
|
<div className="p-6">
|
||||||
{
|
<div className="flex items-center space-x-2 text-sm text-gray-500 mb-2">
|
||||||
id: "2",
|
<span>News</span>
|
||||||
title: "Fan Theories: Exploring Character Connections Across the Saga",
|
<span>•</span>
|
||||||
items: ["Analysis", "Jan 12, 2025", "8 min read"],
|
<span>Jan 15, 2025</span>
|
||||||
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766502909492-uldg0gxd.jpg"
|
<span>•</span>
|
||||||
}
|
<span>5 min read</span>
|
||||||
]}
|
</div>
|
||||||
animationType="slide-up"
|
<h3 className="text-xl font-semibold mb-2">A New Hope: The Latest Series Announcement</h3>
|
||||||
textboxLayout="default"
|
</div>
|
||||||
useInvertedBackground="noInvert"
|
</div>
|
||||||
/>
|
<div className="bg-white rounded-lg shadow-lg overflow-hidden">
|
||||||
|
<img src="https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766502909492-uldg0gxd.jpg" alt="Fan Theories" className="w-full h-48 object-cover" />
|
||||||
|
<div className="p-6">
|
||||||
|
<div className="flex items-center space-x-2 text-sm text-gray-500 mb-2">
|
||||||
|
<span>Analysis</span>
|
||||||
|
<span>•</span>
|
||||||
|
<span>Jan 12, 2025</span>
|
||||||
|
<span>•</span>
|
||||||
|
<span>8 min read</span>
|
||||||
|
</div>
|
||||||
|
<h3 className="text-xl font-semibold mb-2">Fan Theories: Exploring Character Connections Across the Saga</h3>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div id="contact" data-section="contact">
|
<div id="contact" data-section="contact">
|
||||||
<ContactSplitForm
|
<section className="py-20 px-6">
|
||||||
title="Join the Community"
|
<div className="max-w-6xl mx-auto">
|
||||||
description="Ready to connect with fellow Star Wars fans? Sign up for our newsletter and become part of our growing community today."
|
<div className="grid grid-cols-1 lg:grid-cols-2 gap-12">
|
||||||
inputs={[
|
<div>
|
||||||
{ name: "name", type: "text", placeholder: "Your Name", required: true },
|
<h2 className="text-4xl font-bold mb-6">Join the Community</h2>
|
||||||
{ name: "email", type: "email", placeholder: "Your Email", required: true }
|
<p className="text-lg mb-8">Ready to connect with fellow Star Wars fans? Sign up for our newsletter and become part of our growing community today.</p>
|
||||||
]}
|
<form className="space-y-6">
|
||||||
textarea={{
|
<input type="text" name="name" placeholder="Your Name" required className="w-full px-4 py-3 border border-gray-300 rounded-lg focus:ring-2 focus:ring-primary focus:border-transparent" />
|
||||||
name: "message",
|
<input type="email" name="email" placeholder="Your Email" required className="w-full px-4 py-3 border border-gray-300 rounded-lg focus:ring-2 focus:ring-primary focus:border-transparent" />
|
||||||
placeholder: "Tell us about your favorite Star Wars moment...",
|
<textarea name="message" placeholder="Tell us about your favorite Star Wars moment..." rows={4} className="w-full px-4 py-3 border border-gray-300 rounded-lg focus:ring-2 focus:ring-primary focus:border-transparent resize-none"></textarea>
|
||||||
rows: 4,
|
<button type="submit" className="w-full px-6 py-3 bg-primary text-white rounded-lg hover:bg-primary/80 transition-colors">Join Community</button>
|
||||||
required: false
|
</form>
|
||||||
}}
|
</div>
|
||||||
useInvertedBackground="noInvert"
|
<div>
|
||||||
imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766502916033-zltpd7vx.jpg"
|
<img src="https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766502916033-zltpd7vx.jpg" alt="Star Wars community connection" className="w-full h-full object-cover rounded-lg" />
|
||||||
imageAlt="Star Wars community connection"
|
</div>
|
||||||
mediaPosition="right"
|
</div>
|
||||||
buttonText="Join Community"
|
</div>
|
||||||
/>
|
</section>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div id="footer" data-section="footer">
|
<div id="footer" data-section="footer">
|
||||||
<FooterBase
|
<footer className="py-20 px-6 bg-gray-900 text-white">
|
||||||
logoText="Star Wars Fans"
|
<div className="max-w-6xl mx-auto">
|
||||||
copyrightText="© 2025 Star Wars Fan Community. All rights reserved."
|
<div className="grid grid-cols-1 md:grid-cols-4 gap-8">
|
||||||
columns={[
|
<div>
|
||||||
{
|
<h3 className="text-xl font-bold mb-4">Star Wars Fans</h3>
|
||||||
title: "Community",
|
</div>
|
||||||
items: [
|
<div>
|
||||||
{ label: "About Us", href: "about" },
|
<h4 className="font-semibold mb-4">Community</h4>
|
||||||
{ label: "Members", href: "team" },
|
<ul className="space-y-2">
|
||||||
{ label: "Events", href: "blog" }
|
<li><a href="#about" className="hover:text-primary transition-colors">About Us</a></li>
|
||||||
]
|
<li><a href="#team" className="hover:text-primary transition-colors">Members</a></li>
|
||||||
},
|
<li><a href="#blog" className="hover:text-primary transition-colors">Events</a></li>
|
||||||
{
|
</ul>
|
||||||
title: "Resources",
|
</div>
|
||||||
items: [
|
<div>
|
||||||
{ label: "News", href: "blog" },
|
<h4 className="font-semibold mb-4">Resources</h4>
|
||||||
{ label: "FAQ", href: "faq" },
|
<ul className="space-y-2">
|
||||||
{ label: "Contact", href: "contact" }
|
<li><a href="#blog" className="hover:text-primary transition-colors">News</a></li>
|
||||||
]
|
<li><a href="#faq" className="hover:text-primary transition-colors">FAQ</a></li>
|
||||||
},
|
<li><a href="#contact" className="hover:text-primary transition-colors">Contact</a></li>
|
||||||
{
|
</ul>
|
||||||
title: "Legal",
|
</div>
|
||||||
items: [
|
<div>
|
||||||
{ label: "Privacy Policy", href: "privacy" },
|
<h4 className="font-semibold mb-4">Legal</h4>
|
||||||
{ label: "Terms of Service", href: "terms" }
|
<ul className="space-y-2">
|
||||||
]
|
<li><a href="#privacy" className="hover:text-primary transition-colors">Privacy Policy</a></li>
|
||||||
}
|
<li><a href="#terms" className="hover:text-primary transition-colors">Terms of Service</a></li>
|
||||||
]}
|
</ul>
|
||||||
/>
|
</div>
|
||||||
|
</div>
|
||||||
|
<div className="border-t border-gray-700 mt-12 pt-8 text-center">
|
||||||
|
<p>© 2025 Star Wars Fan Community. All rights reserved.</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</footer>
|
||||||
</div>
|
</div>
|
||||||
</ThemeProvider>
|
</ThemeProvider>
|
||||||
);
|
);
|
||||||
|
|||||||
Reference in New Issue
Block a user