Rebrand from OCD to LAD with full structural changes

- Update all OCD/Olathe/1975 references to LAD/Louisiana/1908
- Add Updates, Minutes, and Deaf Focus pages to nav, footer, and filesystem
- Rename package names from ocd-website-* to lad-website-*
- Reduce nav font size to accommodate 9 nav items
- Update metadata, OpenGraph, and Twitter card for lad1908.org

backend/package.json

@@ -1,5 +1,5 @@
 {
-  "name": "ocd-website-backend",
+  "name": "lad-website-backend",
   "version": "0.1.0",
   "private": true,
   "type": "module",

frontend/package.json

@@ -1,5 +1,5 @@
 {
-  "name": "ocd-website-frontend",
+  "name": "lad-website-frontend",
   "version": "0.1.0",
   "private": true,
   "type": "module",

frontend/src/app/about/page.tsx

@@ -3,8 +3,8 @@ import Link from 'next/link';
 import type { Metadata } from 'next';
 
 export const metadata: Metadata = {
-  title: 'About Us | Olathe Club of the Deaf',
+  title: 'About Us | Louisiana Association of the Deaf',
-  description: 'Learn about the history, mission, and vision of the Olathe Club of the Deaf, serving the deaf community since 1975.',
+  description: 'Learn about the history, mission, and vision of the Louisiana Association of the Deaf, serving the deaf community since 1908.',
 };
 
 export default function AboutPage() {
@@ -14,9 +14,9 @@ export default function AboutPage() {
       <section className="py-16 bg-color-bg-secondary">
         <div className="container mx-auto px-4">
           <div className="max-w-3xl mx-auto text-center">
-            <h1 className="hero-title text-4xl md:text-5xl font-bold mb-6">About Olathe Club of the Deaf</h1>
+            <h1 className="hero-title text-4xl md:text-5xl font-bold mb-6">About Louisiana Association of the Deaf</h1>
             <p className="hero-subtitle text-xl">
-              Connecting and empowering the deaf community in Olathe since 1975.
+              Connecting and empowering the deaf community in Louisiana since 1908.
             </p>
           </div>
         </div>
@@ -57,13 +57,13 @@ export default function AboutPage() {
             <h2 className="section-heading text-3xl font-bold mb-8 text-center">Our History</h2>
             <div className="card video-container-gold p-8 space-y-6">
               <p className="section-text text-lg">
-                The Olathe Club of the Deaf (OCD) was established in 1975 by a group of deaf community members who recognized the need for a dedicated organization to serve the growing deaf population in Olathe.
+                The Louisiana Association of the Deaf (LAD) was established in 1908 by a group of deaf community members who recognized the need for a dedicated organization to serve the growing deaf population in Louisiana.
               </p>
               <p className="section-text text-lg">
-                Starting with just a handful of members, OCD quickly grew into a vibrant community hub, hosting regular social events, educational workshops, and advocacy initiatives.
+                Starting with just a handful of members, LAD quickly grew into a vibrant community hub, hosting regular social events, educational workshops, and advocacy initiatives.
               </p>
               <p className="section-text text-lg">
-                Throughout the decades, OCD has continued to evolve and expand its services while staying true to its core mission of fostering community and providing support for deaf and hard-of-hearing individuals in Olathe and surrounding areas.
+                Throughout the decades, LAD has continued to evolve and expand its services while staying true to its core mission of fostering community and providing support for deaf and hard-of-hearing individuals in Louisiana and surrounding areas.
               </p>
               <div className="text-center mt-8">
                 <Link href="/about/history" className="btn-primary inline-block">
@@ -136,7 +136,7 @@ export default function AboutPage() {
         <div className="container mx-auto px-4 text-center">
           <h2 className="cta-title text-3xl font-bold mb-4">Get Involved</h2>
           <p className="cta-description text-xl max-w-3xl mx-auto mb-8">
-            Join us in our mission to support and empower the deaf community in Olathe.
+            Join us in our mission to support and empower the deaf community in Louisiana.
           </p>
           <div className="flex flex-col sm:flex-row justify-center gap-4">
             <Link 

frontend/src/app/deaf-focus/page.tsx

@@ -0,0 +1,72 @@
+import React from 'react';
+import type { Metadata } from 'next';
+
+export const metadata: Metadata = {
+  title: 'Deaf Focus | Louisiana Association of the Deaf',
+  description: 'Resources, articles, and videos focused on deaf culture, advocacy, and community from the Louisiana Association of the Deaf.',
+};
+
+export default function DeafFocusPage() {
+  return (
+    <div className="bg-color-bg">
+      {/* Hero section */}
+      <section className="py-16 bg-color-bg-secondary">
+        <div className="container mx-auto px-4">
+          <div className="max-w-3xl mx-auto text-center">
+            <h1 className="hero-title text-4xl md:text-5xl font-bold mb-6">Deaf Focus</h1>
+            <p className="hero-subtitle text-xl">
+              Resources, articles, and videos celebrating deaf culture and advancing advocacy in Louisiana.
+            </p>
+          </div>
+        </div>
+      </section>
+
+      {/* Content sections */}
+      <section className="py-16 bg-color-bg">
+        <div className="container mx-auto px-4">
+          <div className="max-w-4xl mx-auto">
+            <div className="grid grid-cols-1 md:grid-cols-2 gap-8 mb-16">
+              <div className="card event-card-gold-border p-8">
+                <h2 className="section-heading event-card-title-gold text-2xl font-bold mb-4">Featured Videos</h2>
+                <p className="section-text text-lg mb-6">
+                  ASL-accessible video content covering topics relevant to the Louisiana deaf community.
+                </p>
+                <div className="video-container video-container-gold rounded-lg aspect-video flex items-center justify-center">
+                  <p className="video-placeholder-text">Videos coming soon</p>
+                </div>
+              </div>
+              <div className="card event-card-gold-border p-8">
+                <h2 className="section-heading event-card-title-gold text-2xl font-bold mb-4">Articles &amp; Resources</h2>
+                <p className="section-text text-lg">
+                  In-depth articles on deaf culture, education, legislation, and community news from across Louisiana and the nation.
+                </p>
+                <div className="mt-6 space-y-4">
+                  <div className="card p-4">
+                    <p className="card-date text-sm mb-1">Coming soon</p>
+                    <p className="section-text">Articles will be published here once the admin panel is configured.</p>
+                  </div>
+                </div>
+              </div>
+            </div>
+          </div>
+        </div>
+      </section>
+
+      {/* CTA */}
+      <section className="py-16 cta-section">
+        <div className="container mx-auto px-4 text-center">
+          <h2 className="cta-title text-3xl font-bold mb-4">Stay Informed</h2>
+          <p className="cta-description text-xl max-w-3xl mx-auto mb-8">
+            Subscribe to LAD updates and never miss important news for the Louisiana deaf community.
+          </p>
+          <a
+            href="/contact"
+            className="cta-button-primary px-6 py-3 rounded-lg font-medium text-lg inline-block"
+          >
+            Contact Us
+          </a>
+        </div>
+      </section>
+    </div>
+  );
+}

frontend/src/app/layout.tsx

@@ -14,22 +14,22 @@ const inter = Inter({
 });
 
 export const metadata: Metadata = {
-  title: 'Olathe Club of the Deaf',
+  title: 'Louisiana Association of the Deaf',
-  description: 'Community hub for the deaf community in Olathe',
+  description: 'The statewide organization serving the deaf and hard-of-hearing community in Louisiana since 1908.',
-  metadataBase: new URL('https://olathedeafclub.com'),
+  metadataBase: new URL('https://lad1908.org'),
-  keywords: ['deaf', 'olathe', 'club', 'community', 'ASL', 'events'],
+  keywords: ['deaf', 'louisiana', 'LAD', 'association', 'ASL', 'events', 'advocacy'],
-  authors: [{ name: 'Olathe Club of the Deaf' }],
+  authors: [{ name: 'Louisiana Association of the Deaf' }],
   openGraph: {
-    title: 'Olathe Club of the Deaf',
+    title: 'Louisiana Association of the Deaf',
-    description: 'Community hub for the deaf community in Olathe',
+    description: 'The statewide organization serving the deaf and hard-of-hearing community in Louisiana since 1908.',
-    url: 'https://olathedeafclub.com',
+    url: 'https://lad1908.org',
-    siteName: 'Olathe Club of the Deaf',
+    siteName: 'Louisiana Association of the Deaf',
     images: [
       {
         url: '/images/og-image.jpg',
         width: 1200,
         height: 630,
-        alt: 'Olathe Club of the Deaf'
+        alt: 'Louisiana Association of the Deaf'
       }
     ],
     locale: 'en_US',
@@ -37,8 +37,8 @@ export const metadata: Metadata = {
   },
   twitter: {
     card: 'summary_large_image',
-    title: 'Olathe Club of the Deaf',
+    title: 'Louisiana Association of the Deaf',
-    description: 'Community hub for the deaf community in Olathe',
+    description: 'The statewide organization serving the deaf and hard-of-hearing community in Louisiana since 1908.',
     images: ['/images/og-image.jpg'],
   },
 };
@@ -55,7 +55,7 @@ export default function RootLayout({
           attribute="class"
           defaultTheme="dark"
           enableSystem={true}
-          storageKey="ocd-theme"
+          storageKey="lad-theme"
           themes={['light', 'dark', 'high-contrast-light', 'high-contrast-dark', 'system']}
         >
           {/* Skip to content link for accessibility */}

frontend/src/app/minutes/page.tsx

@@ -0,0 +1,43 @@
+import React from 'react';
+import type { Metadata } from 'next';
+
+export const metadata: Metadata = {
+  title: 'Meeting Minutes | Louisiana Association of the Deaf',
+  description: 'Official meeting minutes of the Louisiana Association of the Deaf.',
+};
+
+export default function MinutesPage() {
+  return (
+    <div className="bg-color-bg">
+      {/* Hero section */}
+      <section className="py-16 bg-color-bg-secondary">
+        <div className="container mx-auto px-4">
+          <div className="max-w-3xl mx-auto text-center">
+            <h1 className="hero-title text-4xl md:text-5xl font-bold mb-6">Meeting Minutes</h1>
+            <p className="hero-subtitle text-xl">
+              Official records of LAD board and general membership meetings.
+            </p>
+          </div>
+        </div>
+      </section>
+
+      {/* Minutes listing */}
+      <section className="py-16 bg-color-bg">
+        <div className="container mx-auto px-4">
+          <div className="max-w-4xl mx-auto">
+            <p className="section-text text-lg text-center mb-12">
+              Meeting minutes are uploaded by LAD administrators and available for download below.
+            </p>
+
+            {/* Placeholder — replace with dynamic documents from backend */}
+            <div className="card event-card-gold-border p-8 text-center">
+              <p className="section-text text-lg">
+                No minutes have been published yet. Documents uploaded via the admin panel will appear here.
+              </p>
+            </div>
+          </div>
+        </div>
+      </section>
+    </div>
+  );
+}

frontend/src/app/page.tsx

@@ -57,11 +57,11 @@ export default function Home() {
     <>
       {/* Hero Section */}
       <Hero
-        title="Olathe Club of the Deaf"
+        title="Louisiana Association of the Deaf"
-        subtitle="A community organization serving the deaf and hard-of-hearing community in Olathe since 1975."
+        subtitle="The statewide organization serving the deaf and hard-of-hearing community in Louisiana since 1908."
         primaryButtonText="Upcoming Events"
         primaryButtonLink="/events"
-        secondaryButtonText="Join OCD"
+        secondaryButtonText="Join LAD"
         secondaryButtonLink="/membership"
       />
       
@@ -103,17 +103,17 @@ export default function Home() {
       {/* About section with video */}
       <section className="py-16 bg-color-bg-secondary">
         <div className="container mx-auto px-4">
-          <h2 className="section-heading text-3xl font-bold mb-8 text-center">About OCD</h2>
+          <h2 className="section-heading text-3xl font-bold mb-8 text-center">About LAD</h2>
           <div className="grid grid-cols-1 lg:grid-cols-2 gap-12 items-center">
             <div>
               <p className="section-text text-lg mb-6">
-                Olathe Club of the Deaf (OCD) is a non-profit organization dedicated to serving the deaf and hard-of-hearing community in Olathe and surrounding areas.
+                The Louisiana Association of the Deaf (LAD) is a non-profit statewide organization dedicated to serving the deaf and hard-of-hearing community across Louisiana.
               </p>
               <p className="section-text text-lg mb-6">
-                Our mission is to promote social, educational, and recreational opportunities for deaf individuals and their families while fostering a sense of community and belonging.
+                Our mission is to advocate for the rights, education, and well-being of deaf and hard-of-hearing individuals throughout Louisiana while fostering a strong sense of community.
               </p>
               <p className="section-text text-lg mb-6">
-                Founded in 1975, we have a rich history of advocacy and community service, working to bridge the gap between the deaf and hearing communities.
+                Founded in 1908, LAD has over a century of advocacy and community service, working to advance opportunities and equal access for the deaf community.
               </p>
               <Link href="/about" className="btn-primary inline-block">
                 Learn More About Us
@@ -135,21 +135,21 @@ export default function Home() {
           <h2 className="section-heading text-3xl font-bold mb-8 text-center">Membership Benefits</h2>
           <div className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-8">
             <div className="card event-card-gold-border p-6">
-              <h3 className="benefit-card-title event-card-title-gold text-xl font-semibold mb-4">Community Events</h3>
+              <h3 className="benefit-card-title event-card-title-gold text-xl font-semibold mb-4">Statewide Events</h3>
               <p className="benefit-card-description">
-                Access to all OCD community events, socials, and gatherings throughout the year.
+                Access to all LAD community events, conventions, and gatherings throughout Louisiana.
               </p>
             </div>
             <div className="card event-card-gold-border p-6">
               <h3 className="benefit-card-title event-card-title-gold text-xl font-semibold mb-4">Voting Rights</h3>
               <p className="benefit-card-description">
-                Have your say in club decisions and vote in board elections.
+                Have your say in organizational decisions and vote in board elections.
               </p>
             </div>
             <div className="card event-card-gold-border p-6">
-              <h3 className="benefit-card-title event-card-title-gold text-xl font-semibold mb-4">Support Network</h3>
+              <h3 className="benefit-card-title event-card-title-gold text-xl font-semibold mb-4">Advocacy Support</h3>
               <p className="benefit-card-description">
-                Connect with a supportive network of deaf and hard-of-hearing individuals.
+                Benefit from LAD's statewide advocacy work advancing the rights of deaf Louisianans.
               </p>
             </div>
           </div>
@@ -169,7 +169,7 @@ export default function Home() {
         <div className="container mx-auto px-4 text-center">
           <h2 className="cta-title text-3xl font-bold mb-4">Join Our Community</h2>
           <p className="cta-description text-xl max-w-3xl mx-auto mb-8">
-            Become a member today and connect with the deaf community in Olathe.
+            Become a member today and connect with the deaf community across Louisiana.
           </p>
           <div className="flex flex-col sm:flex-row justify-center gap-4">
             <Link 

frontend/src/app/updates/page.tsx

@@ -0,0 +1,43 @@
+import React from 'react';
+import type { Metadata } from 'next';
+
+export const metadata: Metadata = {
+  title: 'Updates | Louisiana Association of the Deaf',
+  description: 'Latest news and announcements from the Louisiana Association of the Deaf.',
+};
+
+export default function UpdatesPage() {
+  return (
+    <div className="bg-color-bg">
+      {/* Hero section */}
+      <section className="py-16 bg-color-bg-secondary">
+        <div className="container mx-auto px-4">
+          <div className="max-w-3xl mx-auto text-center">
+            <h1 className="hero-title text-4xl md:text-5xl font-bold mb-6">Updates</h1>
+            <p className="hero-subtitle text-xl">
+              Latest news and announcements from LAD.
+            </p>
+          </div>
+        </div>
+      </section>
+
+      {/* Updates feed */}
+      <section className="py-16 bg-color-bg">
+        <div className="container mx-auto px-4">
+          <div className="max-w-4xl mx-auto space-y-8">
+            {/* Placeholder posts — replace with dynamic data from backend */}
+            <article className="card event-card-gold-border p-8">
+              <p className="card-date text-sm mb-2">Coming soon</p>
+              <h2 className="card-title event-card-title-gold text-2xl font-semibold mb-4">
+                News and announcements will appear here
+              </h2>
+              <p className="section-text text-lg">
+                Check back for the latest updates from the Louisiana Association of the Deaf. Once the admin panel is configured, posts will be published and displayed here.
+              </p>
+            </article>
+          </div>
+        </div>
+      </section>
+    </div>
+  );
+}

frontend/src/components/organisms/Footer.tsx

@@ -34,10 +34,10 @@ const Footer = () => {
           {/* Column 1: Logo and About */}
           <div className="space-y-4">
             <h2 className="footer-title text-lg font-bold">
-              Olathe Club of the Deaf
+              Louisiana Association of the Deaf
             </h2>
             <p className="footer-text">
-              Serving the deaf community in Olathe since 1975.
+              Serving the deaf community in Louisiana since 1908.
             </p>
             <div className="flex space-x-4">
               <a 
@@ -76,45 +76,29 @@ const Footer = () => {
               Navigation
             </h3>
             <nav className="flex flex-col space-y-2">
-              <Link href="/" className="footer-link">
+              <Link href="/" className="footer-link">Home</Link>
-                Home
+              <Link href="/about" className="footer-link">About</Link>
-              </Link>
+              <Link href="/updates" className="footer-link">Updates</Link>
-              <Link href="/about" className="footer-link">
+              <Link href="/events" className="footer-link">Events</Link>
-                About
+              <Link href="/minutes" className="footer-link">Minutes</Link>
-              </Link>
+              <Link href="/deaf-focus" className="footer-link">Deaf Focus</Link>
-              <Link href="/events" className="footer-link">
+              <Link href="/membership" className="footer-link">Membership</Link>
-                Events
+              <Link href="/contact" className="footer-link">Contact</Link>
-              </Link>
+              <Link href="/donate" className="footer-link">Donate</Link>
-              <Link href="/membership" className="footer-link">
-                Membership
-              </Link>
-              <Link href="/contact" className="footer-link">
-                Contact
-              </Link>
-              <Link href="/donate" className="footer-link">
-                Donate
-              </Link>
             </nav>
           </div>
           
           {/* Column 3: About Links */}
           <div>
             <h3 className="footer-heading text-sm font-semibold uppercase tracking-wider mb-4">
-              About OCD
+              About LAD
             </h3>
             <nav className="flex flex-col space-y-2">
-              <Link href="/about/history" className="footer-link">
+              <Link href="/about/history" className="footer-link">History</Link>
-                History
+              <Link href="/about/board" className="footer-link">Board Members</Link>
-              </Link>
+              <Link href="/about/bylaws" className="footer-link">Bylaws</Link>
-              <Link href="/about/board" className="footer-link">
+              <Link href="/minutes" className="footer-link">Meeting Minutes</Link>
-                Board Members
+              <Link href="/deaf-focus" className="footer-link">Deaf Focus</Link>
-              </Link>
-              <Link href="/about/bylaws" className="footer-link">
-                Bylaws
-              </Link>
-              <Link href="/about/minutes" className="footer-link">
-                Meeting Minutes
-              </Link>
             </nav>
           </div>
           
@@ -163,7 +147,7 @@ const Footer = () => {
         {/* Bottom Section with Copyright */}
         <div className="footer-copyright mt-12 pt-8">
           <p className="footer-text text-sm text-center">
-            &copy; {currentYear} Olathe Club of the Deaf. All rights reserved.
+            &copy; {currentYear} Louisiana Association of the Deaf. All rights reserved.
           </p>
           <div className="mt-4 flex flex-col sm:flex-row justify-center space-y-2 sm:space-y-0 sm:space-x-6 text-sm">
             <Link href="/privacy" className="footer-link">

frontend/src/components/organisms/Navigation.tsx

@@ -43,7 +43,7 @@ const NavLink = ({ href, children, isMobile = false, onClick }: NavLinkProps) =>
   const pathname = usePathname();
   const isActive = pathname === href;
   
-  const baseStyles = "transition-colors duration-200 px-3 py-2 rounded-md text-lg font-medium";
+  const baseStyles = "transition-colors duration-200 px-2 py-2 rounded-md text-base font-medium";
   const mobileStyles = isMobile ? "block w-full text-left" : "";
   // Create a visually distinct style for active links using CSS variables
   const activeStyles = isActive 
@@ -109,16 +109,19 @@ const Navigation = () => {
           {/* Logo and site name */}
           <div className="flex-shrink-0">
             <Link href="/" className="flex items-center" onClick={closeMenu}>
-              <span className="nav-logo text-xl font-bold">Olathe Club of the Deaf</span>
+              <span className="nav-logo text-xl font-bold">Louisiana Association of the Deaf</span>
             </Link>
           </div>
           
           {/* Desktop navigation */}
           <div className="hidden md:block">
-            <div className="ml-10 flex items-center space-x-4">
+            <div className="ml-6 flex items-center space-x-1">
               <NavLink href="/">Home</NavLink>
               <NavLink href="/about">About</NavLink>
+              <NavLink href="/updates">Updates</NavLink>
               <NavLink href="/events">Events</NavLink>
+              <NavLink href="/minutes">Minutes</NavLink>
+              <NavLink href="/deaf-focus">Deaf Focus</NavLink>
               <NavLink href="/membership">Membership</NavLink>
               <NavLink href="/contact">Contact</NavLink>
               <NavLink href="/donate">Donate</NavLink>
@@ -150,7 +153,10 @@ const Navigation = () => {
         <div className="nav-mobile-menu px-2 pt-2 pb-3 space-y-1">
           <NavLink href="/" isMobile onClick={closeMenu}>Home</NavLink>
           <NavLink href="/about" isMobile onClick={closeMenu}>About</NavLink>
+          <NavLink href="/updates" isMobile onClick={closeMenu}>Updates</NavLink>
           <NavLink href="/events" isMobile onClick={closeMenu}>Events</NavLink>
+          <NavLink href="/minutes" isMobile onClick={closeMenu}>Minutes</NavLink>
+          <NavLink href="/deaf-focus" isMobile onClick={closeMenu}>Deaf Focus</NavLink>
           <NavLink href="/membership" isMobile onClick={closeMenu}>Membership</NavLink>
           <NavLink href="/contact" isMobile onClick={closeMenu}>Contact</NavLink>
           <NavLink href="/donate" isMobile onClick={closeMenu}>Donate</NavLink>