Update src/app/shop/page.tsx

Update src/app/shop/[id]/page.tsx
Update src/app/page.tsx
2026-02-20 13:15:19 +00:00 · 2026-02-20 13:15:18 +00:00 · 2026-02-20 13:15:18 +00:00 · 2026-02-20 13:15:17 +00:00 · 2026-02-20 13:15:16 +00:00 · 2026-02-20 13:15:15 +00:00
6 changed files with 154 additions and 93 deletions
--- a/src/app/about/page.tsx
+++ b/src/app/about/page.tsx
@@ -0,0 +1,72 @@
+"use client";
+
+import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
+import NavbarStyleApple from '@/components/navbar/NavbarStyleApple/NavbarStyleApple';
+import FooterLogoEmphasis from '@/components/sections/footer/FooterLogoEmphasis';
+
+export default function AboutPage() {
+  const navItems = [
+    { name: 'Home', id: '/' },
+    { name: 'About', id: '/about' },
+    { name: 'Features', id: '/#features' },
+    { name: 'Showcase', id: '/#product' },
+    { name: 'News', id: '/blog' },
+    { name: 'Shop', id: '/shop' },
+    { name: 'Team', id: '/#team' },
+    { name: 'Contact', id: '/#contact' }
+  ];
+
+  const footerColumns = [
+    { items: [{ label: 'About Us', href: '/about' }, { label: 'Features', href: '#features' }, { label: 'News', href: '/blog' }] },
+    { items: [{ label: 'Community', href: '#product' }, { label: 'Team', href: '#team' }, { label: 'FAQ', href: '#faq' }] },
+    { items: [{ label: 'Contact', href: '#contact' }, { label: 'Privacy Policy', href: '#' }, { label: 'Terms of Service', href: '#' }] }
+  ];
+
+  return (
+    <ThemeProvider
+      defaultButtonVariant="directional-hover"
+      defaultTextAnimation="background-highlight"
+      borderRadius="rounded"
+      contentWidth="mediumSmall"
+      sizing="medium"
+      background="noise"
+      cardStyle="subtle-shadow"
+      primaryButtonStyle="gradient"
+      secondaryButtonStyle="layered"
+      headingFontWeight="medium"
+    >
+      <div id="nav" data-section="nav">
+        <NavbarStyleApple
+          brandName="Star Wars Fan Club"
+          navItems={navItems}
+        />
+      </div>
+
+      <main className="min-h-screen flex flex-col items-center justify-center py-20 px-4 sm:px-6 lg:px-8">
+        <div id="about-community" data-section="about-community" className="w-full max-w-content-width mx-auto text-center pt-20 pb-10">
+          <h1 className="text-4xl sm:text-5xl font-bold text-foreground mb-6">
+            Our Community: United by the Force
+          </h1>
+          <p className="text-lg text-foreground/80 leading-relaxed max-w-3xl mx-auto">
+            Welcome to the heart of the Star Wars Fan Club – our vibrant and growing community!
+            We are a diverse group of enthusiasts from across the galaxy, united by a shared
+            passion for the epic sagas, compelling characters, and rich lore of Star Wars.
+            Here, you'll find fellow fans eager to discuss theories, share fan art, celebrate
+            milestones, and relive iconic moments. Whether you're a seasoned Jedi Master or
+            a curious Padawan, there's a place for you to connect, engage, and deepen your
+            love for a galaxy far, far away. Join us as we explore new horizons, debate the
+            mysteries of the Force, and keep the spirit of Star Wars alive!
+          </p>
+        </div>
+      </main>
+
+      <div id="footer" data-section="footer">
+        <FooterLogoEmphasis
+          columns={footerColumns}
+          logoText="Star Wars Fan Club"
+          containerClassName="bg-background-accent text-foreground"
+        />
+      </div>
+    </ThemeProvider>
+  );
+}
--- a/src/app/blog/page.tsx
+++ b/src/app/blog/page.tsx
@@ -10,6 +10,23 @@ import BlogCardThree from "@/components/sections/blog/BlogCardThree";
 export default function BlogPage() {
    const { posts, isLoading } = useBlogPosts();

+    const navItems = [
+        { name: 'Home', id: '/' },
+        { name: 'About', id: '/about' },
+        { name: 'Features', id: '/#features' },
+        { name: 'Showcase', id: '/#product' },
+        { name: 'News', id: '/blog' },
+        { name: 'Shop', id: '/shop' },
+        { name: 'Team', id: '/#team' },
+        { name: 'Contact', id: '/#contact' }
+    ];
+
+    const footerColumns = [
+        { items: [{ label: 'About Us', href: '/about' }, { label: 'Features', href: '#features' }, { label: 'News', href: '/blog' }] },
+        { items: [{ label: 'Community', href: '#product' }, { label: 'Team', href: '#team' }, { label: 'FAQ', href: '#faq' }] },
+        { items: [{ label: 'Contact', href: '#contact' }, { label: 'Privacy Policy', href: '#' }, { label: 'Terms of Service', href: '#' }] }
+    ];
+
    return (
        <ThemeProvider
            defaultButtonVariant="directional-hover"
@@ -27,16 +44,7 @@ export default function BlogPage() {
                <div id="nav" data-section="nav">
                    <NavbarStyleApple
                        brandName="Star Wars Fan Club"
-                        navItems={[
-                            { name: 'Home', id: '/' },
-                            { name: 'About', id: '/#about' },
-                            { name: 'Features', id: '/#features' },
-                            { name: 'Showcase', id: '/#product' },
-                            { name: 'News', id: '/blog' },
-                            { name: 'Shop', id: '/shop' },
-                            { name: 'Team', id: '/#team' },
-                            { name: 'Contact', id: '/#contact' }
-                        ]}
+                        navItems={navItems}
                    />
                </div>

@@ -57,11 +65,7 @@ export default function BlogPage() {
                )}
                <div id="footer" data-section="footer">
                    <FooterLogoEmphasis
-                        columns={[
-                            { items: [{ label: 'About Us', href: '#about' }, { label: 'Features', href: '#features' }, { label: 'News', href: '/blog' }] },
-                            { items: [{ label: 'Community', href: '#product' }, { label: 'Team', href: '#team' }, { label: 'FAQ', href: '#faq' }] },
-                            { items: [{ label: 'Contact', href: '#contact' }, { label: 'Privacy Policy', href: '#' }, { label: 'Terms of Service', href: '#' }] }
-                        ]}
+                        columns={footerColumns}
                        logoText="Star Wars Fan Club"
                        containerClassName="bg-background-accent text-foreground"
                    />
--- a/src/app/layout.tsx
+++ b/src/app/layout.tsx
@@ -14,7 +14,7 @@ const sourceSans3 = Source_Sans_3({
 });

 export const metadata: Metadata = {
-  title: "Star Wars Fan Club - Join the Galaxy's Ultimate Fandom",  description: "Join the Star Wars Fan Club! Explore lore, share theories, connect with fans, and stay updated on all things from a galaxy far, far away.",  keywords: "Star Wars, fan club, fandom, lightsaber, galaxy, sci-fi, community, forum, news, lore, fan art, cosplay",  openGraph: {
+  title: "Star Wars Fan Club - Join the Galaxy's Ultimate Fandom",  description: "Join the Star Wars Fan Club! Explore lore, share theories, connect with fans, and stay updated on all things from a galaxy far, far away.",  keywords: "Star Wars, fan club, fandom, lightsaber, galaxy, sci-fi, community, forum, news, lore, fan art, cosplay, about",  openGraph: {
    title: "Star Wars Fan Club - Join the Galaxy's Ultimate Fandom",    description: "Join the Star Wars Fan Club! Explore lore, share theories, connect with fans, and stay updated on all things from a galaxy far, far away.",    url: "https://starwarsfanclub.com",    siteName: "Star Wars Fan Club",    images: [
      {
        url: "https://img.b2bpic.net/free-vector/modern-composition-with-two-crossed-light-swords_23-2147926469.jpg",        alt: "Lightsaber igniting in space"}
--- a/src/app/page.tsx
+++ b/src/app/page.tsx
@@ -13,6 +13,23 @@ import ContactText from '@/components/sections/contact/ContactText';
 import FooterLogoEmphasis from '@/components/sections/footer/FooterLogoEmphasis';

 export default function LandingPage() {
+  const navItems = [
+    { name: 'Home', id: '/' },
+    { name: 'About', id: '/about' },
+    { name: 'Features', id: '/#features' },
+    { name: 'Showcase', id: '/#product' },
+    { name: 'News', id: '/blog' },
+    { name: 'Shop', id: '/shop' },
+    { name: 'Team', id: '/#team' },
+    { name: 'Contact', id: '/#contact' }
+  ];
+
+  const footerColumns = [
+    { items: [{ label: 'About Us', href: '/about' }, { label: 'Features', href: '#features' }, { label: 'News', href: '/blog' }] },
+    { items: [{ label: 'Community', href: '#product' }, { label: 'Team', href: '#team' }, { label: 'FAQ', href: '#faq' }] },
+    { items: [{ label: 'Contact', href: '#contact' }, { label: 'Privacy Policy', href: '#' }, { label: 'Terms of Service', href: '#' }] }
+  ];
+
  return (
    <ThemeProvider
      defaultButtonVariant="directional-hover"
@@ -29,16 +46,7 @@ export default function LandingPage() {
      <div id="nav" data-section="nav">
        <NavbarStyleApple 
          brandName="Star Wars Fan Club"
-          navItems={[
-            { name: 'Home', id: '/' },
-            { name: 'About', id: '/#about' },
-            { name: 'Features', id: '/#features' },
-            { name: 'Showcase', id: '/#product' },
-            { name: 'News', id: '/blog' },
-            { name: 'Shop', id: '/shop' },
-            { name: 'Team', id: '/#team' },
-            { name: 'Contact', id: '/#contact' }
-          ]}
+          navItems={navItems}
        />
      </div>
      <div id="hero" data-section="hero">
@@ -62,7 +70,7 @@ export default function LandingPage() {
          title="Unite the Fandom"
          description="From the original trilogy to the latest series, our club is a gathering place for every Star Wars enthusiast. Share theories, debate iconic moments, and immerse yourself in a community that understands the Force."
          tag="About Our Club"
-          buttons={[{ text: 'Our Mission', href: '#' }]}
+          buttons={[{ text: 'Our Mission', href: '/about' }]} 
          imageSrc="https://img.b2bpic.net/free-photo/fencing_654080-2262.jpg"
          imageAlt="Group of Star Wars fans at a convention"
          useInvertedBackground={false}
@@ -170,7 +178,7 @@ export default function LandingPage() {
        <ContactText 
          text="Ready to embark on your Star Wars journey with us? Join the ranks of fellow fans and become part of our galactic community today!"
          animationType="entrance-slide"
-          buttons={[{ text: 'Join the Rebellion', href: '#' }]}
+          buttons={[{ text: 'Join the Rebellion', href: '/#contact' }]} 
          background={{ variant: 'radial-gradient' }}
          useInvertedBackground={false}
          contentClassName="max-w-mediumSmall text-center"
@@ -178,11 +186,7 @@ export default function LandingPage() {
      </div>
      <div id="footer" data-section="footer">
        <FooterLogoEmphasis 
-          columns={[
-            { items: [{ label: 'About Us', href: '#about' }, { label: 'Features', href: '#features' }, { label: 'News', href: '/blog' }] },
-            { items: [{ label: 'Community', href: '#product' }, { label: 'Team', href: '#team' }, { label: 'FAQ', href: '#faq' }] },
-            { items: [{ label: 'Contact', href: '#contact' }, { label: 'Privacy Policy', href: '#' }, { label: 'Terms of Service', href: '#' }] }
-          ]}
+          columns={footerColumns}
          logoText="Star Wars Fan Club"
          containerClassName="bg-background-accent text-foreground"
        />
--- a/src/app/shop/[id]/page.tsx
+++ b/src/app/shop/[id]/page.tsx
@@ -66,6 +66,23 @@ export default function ProductPage({ params }: ProductPageProps) {
        await checkout(getCheckoutItems(), { successUrl: currentUrl.toString() });
    }, [cartItems, checkout, getCheckoutItems]);

+    const navItems = [
+        { name: 'Home', id: '/' },
+        { name: 'About', id: '/about' },
+        { name: 'Features', id: '/#features' },
+        { name: 'Showcase', id: '/#product' },
+        { name: 'News', id: '/blog' },
+        { name: 'Shop', id: '/shop' },
+        { name: 'Team', id: '/#team' },
+        { name: 'Contact', id: '/#contact' }
+    ];
+
+    const footerColumns = [
+        { items: [{ label: 'About Us', href: '/about' }, { label: 'Features', href: '#features' }, { label: 'News', href: '/blog' }] },
+        { items: [{ label: 'Community', href: '#product' }, { label: 'Team', href: '#team' }, { label: 'FAQ', href: '#faq' }] },
+        { items: [{ label: 'Contact', href: '#contact' }, { label: 'Privacy Policy', href: '#' }, { label: 'Terms of Service', href: '#' }] }
+    ];
+
    if (isLoading) {
        return (
            <ThemeProvider
@@ -84,16 +101,7 @@ export default function ProductPage({ params }: ProductPageProps) {
                    <div id="nav" data-section="nav">
                        <NavbarStyleApple
                            brandName="Star Wars Fan Club"
-                            navItems={[
-                                { name: 'Home', id: '/' },
-                                { name: 'About', id: '/#about' },
-                                { name: 'Features', id: '/#features' },
-                                { name: 'Showcase', id: '/#product' },
-                                { name: 'News', id: '/blog' },
-                                { name: 'Shop', id: '/shop' },
-                                { name: 'Team', id: '/#team' },
-                                { name: 'Contact', id: '/#contact' }
-                            ]}
+                            navItems={navItems}
                            button={{ text: "Cart", onClick: () => setCartOpen(true) }}
                        />
                    </div>
@@ -123,16 +131,7 @@ export default function ProductPage({ params }: ProductPageProps) {
                    <div id="nav" data-section="nav">
                        <NavbarStyleApple
                            brandName="Star Wars Fan Club"
-                            navItems={[
-                                { name: 'Home', id: '/' },
-                                { name: 'About', id: '/#about' },
-                                { name: 'Features', id: '/#features' },
-                                { name: 'Showcase', id: '/#product' },
-                                { name: 'News', id: '/blog' },
-                                { name: 'Shop', id: '/shop' },
-                                { name: 'Team', id: '/#team' },
-                                { name: 'Contact', id: '/#contact' }
-                            ]}
+                            navItems={navItems}
                            button={{ text: "Cart", onClick: () => setCartOpen(true) }}
                        />
                    </div>
@@ -169,16 +168,7 @@ export default function ProductPage({ params }: ProductPageProps) {
                <div id="nav" data-section="nav">
                    <NavbarStyleApple
                        brandName="Star Wars Fan Club"
-                        navItems={[
-                            { name: 'Home', id: '/' },
-                            { name: 'About', id: '/#about' },
-                            { name: 'Features', id: '/#features' },
-                            { name: 'Showcase', id: '/#product' },
-                            { name: 'News', id: '/blog' },
-                            { name: 'Shop', id: '/shop' },
-                            { name: 'Team', id: '/#team' },
-                            { name: 'Contact', id: '/#contact' }
-                        ]}
+                        navItems={navItems}
                        button={{ text: "Cart", onClick: () => setCartOpen(true) }}
                    />
                </div>
@@ -220,11 +210,7 @@ export default function ProductPage({ params }: ProductPageProps) {
                </div>
                <div id="footer" data-section="footer">
                    <FooterLogoEmphasis
-                        columns={[
-                            { items: [{ label: 'About Us', href: '#about' }, { label: 'Features', href: '#features' }, { label: 'News', href: '/blog' }] },
-                            { items: [{ label: 'Community', href: '#product' }, { label: 'Team', href: '#team' }, { label: 'FAQ', href: '#faq' }] },
-                            { items: [{ label: 'Contact', href: '#contact' }, { label: 'Privacy Policy', href: '#' }, { label: 'Terms of Service', href: '#' }] }
-                        ]}
+                        columns={footerColumns}
                        logoText="Star Wars Fan Club"
                        containerClassName="bg-background-accent text-foreground"
                    />
--- a/src/app/shop/page.tsx
+++ b/src/app/shop/page.tsx
@@ -41,6 +41,23 @@ export default function ShopPage() {
        await checkout(getCheckoutItems(), { successUrl: currentUrl.toString() });
    }, [cartItems, checkout, getCheckoutItems]);

+    const navItems = [
+        { name: 'Home', id: '/' },
+        { name: 'About', id: '/about' },
+        { name: 'Features', id: '/#features' },
+        { name: 'Showcase', id: '/#product' },
+        { name: 'News', id: '/blog' },
+        { name: 'Shop', id: '/shop' },
+        { name: 'Team', id: '/#team' },
+        { name: 'Contact', id: '/#contact' }
+    ];
+
+    const footerColumns = [
+        { items: [{ label: 'About Us', href: '/about' }, { label: 'Features', href: '#features' }, { label: 'News', href: '/blog' }] },
+        { items: [{ label: 'Community', href: '#product' }, { label: 'Team', href: '#team' }, { label: 'FAQ', href: '#faq' }] },
+        { items: [{ label: 'Contact', href: '#contact' }, { label: 'Privacy Policy', href: '#' }, { label: 'Terms of Service', href: '#' }] }
+    ];
+
    if (isLoading) {
        return (
            <ThemeProvider
@@ -59,16 +76,7 @@ export default function ShopPage() {
                    <div id="nav" data-section="nav">
                        <NavbarStyleApple
                            brandName="Star Wars Fan Club"
-                            navItems={[
-                                { name: 'Home', id: '/' },
-                                { name: 'About', id: '/#about' },
-                                { name: 'Features', id: '/#features' },
-                                { name: 'Showcase', id: '/#product' },
-                                { name: 'News', id: '/blog' },
-                                { name: 'Shop', id: '/shop' },
-                                { name: 'Team', id: '/#team' },
-                                { name: 'Contact', id: '/#contact' }
-                            ]}
+                            navItems={navItems}
                            button={{ text: "Cart", onClick: () => setCartOpen(true) }}
                        />
                    </div>
@@ -97,16 +105,7 @@ export default function ShopPage() {
                <div id="nav" data-section="nav">
                    <NavbarStyleApple
                        brandName="Star Wars Fan Club"
-                        navItems={[
-                            { name: 'Home', id: '/' },
-                            { name: 'About', id: '/#about' },
-                            { name: 'Features', id: '/#features' },
-                            { name: 'Showcase', id: '/#product' },
-                            { name: 'News', id: '/blog' },
-                            { name: 'Shop', id: '/shop' },
-                            { name: 'Team', id: '/#team' },
-                            { name: 'Contact', id: '/#contact' }
-                        ]}
+                        navItems={navItems}
                        button={{ text: "Cart", onClick: () => setCartOpen(true) }}
                    />
                </div>
@@ -138,11 +137,7 @@ export default function ShopPage() {
                </div>
                <div id="footer" data-section="footer">
                    <FooterLogoEmphasis
-                        columns={[
-                            { items: [{ label: 'About Us', href: '#about' }, { label: 'Features', href: '#features' }, { label: 'News', href: '/blog' }] },
-                            { items: [{ label: 'Community', href: '#product' }, { label: 'Team', href: '#team' }, { label: 'FAQ', href: '#faq' }] },
-                            { items: [{ label: 'Contact', href: '#contact' }, { label: 'Privacy Policy', href: '#' }, { label: 'Terms of Service', href: '#' }] }
-                        ]}
+                        columns={footerColumns}
                        logoText="Star Wars Fan Club"
                        containerClassName="bg-background-accent text-foreground"
                    />
Author	SHA1	Message	Date
bender	acede89ab0	Update src/app/shop/page.tsx	2026-02-20 13:15:19 +00:00
bender	49e20aea67	Update src/app/shop/[id]/page.tsx	2026-02-20 13:15:18 +00:00
bender	bf9f0e9e9a	Update src/app/page.tsx	2026-02-20 13:15:18 +00:00
bender	1eb805e7d8	Update src/app/layout.tsx	2026-02-20 13:15:17 +00:00
bender	9533f2dd63	Update src/app/blog/page.tsx	2026-02-20 13:15:16 +00:00
bender	37351594f2	Add src/app/about/page.tsx	2026-02-20 13:15:15 +00:00
bender	bd1d195b16	Merge version_2 into main Merge version_2 into main	2026-02-20 13:12:19 +00:00
bender	f1c7620e31	Merge version_2 into main Merge version_2 into main	2026-02-20 13:09:51 +00:00