Django-Rwanda · Ndevu12 · Jan 31, 2026 · Jan 31, 2026
diff --git a/app/layout.tsx b/app/layout.tsx
@@ -2,8 +2,8 @@ import type React from "react";
 import type { Metadata } from "next";
 import { Geist, Geist_Mono } from "next/font/google";
 import { Analytics } from "@vercel/analytics/next";
-import { Header } from "@/src/components/header";
-import { Footer } from "@/src/components/footer";
+import { Header } from "@/src/components/layout/header";
+import { Footer } from "@/src/components/layout/footer";
 import "./globals.css";
 
 const geistSans = Geist({
@@ -47,9 +47,10 @@ export default function RootLayout({
 }>) {
   return (
     <html lang="en" className={`${geistSans.variable} ${geistMono.variable}`}>
-      <body className="min-h-screen w-full overflow-x-hidden bg-background font-sans antialiased">
-        {/* Global grid pattern */}
-        <div className="pointer-events-none fixed inset-0 z-0 bg-[linear-gradient(to_right,var(--primary)_1px,transparent_1px),linear-gradient(to_bottom,var(--primary)_1px,transparent_1px)] bg-[size:4rem_4rem] opacity-[0.05]" />
+      <body
+        suppressHydrationWarning
+        className="min-h-screen w-full overflow-x-hidden bg-background font-sans antialiased"
+      >
         <div className="relative z-10 flex min-h-screen flex-col">
           <Header />
           <main className="flex-1">{children}</main>

diff --git a/app/page.tsx b/app/page.tsx
@@ -1,10 +1,10 @@
-import { Hero } from "@/src/components/hero";
-import { CommunitySection } from "@/src/components/community-section";
-import { WorkshopsSection } from "@/src/components/workshops-section";
-import { EventsSection } from "@/src/components/events-section";
-import { OpenSourceSection } from "@/src/components/open-source-section";
-import { TeamSection } from "@/src/components/team-section";
-import { ResourcesSection } from "@/src/components/resources-section";
+import { Hero } from "@/src/components/home-sections/hero";
+import { CommunitySection } from "@/src/components/home-sections/community-section";
+import { WorkshopsSection } from "@/src/components/home-sections/workshops-section";
+import { EventsSection } from "@/src/components/home-sections/events-section";
+import { OpenSourceSection } from "@/src/components/home-sections/open-source-section";
+import { TeamSection } from "@/src/components/home-sections/team-section";
+import { ResourcesSection } from "@/src/components/home-sections/resources-section";
 
 export default function Home() {
   return (

diff --git a/public/Django-Rwanda-official-logo.png b/public/Django-Rwanda-official-logo.png
diff --git a/src/components/community-section.tsx → ...nents/home-sections/community-section.tsx b/src/components/community-section.tsx → ...nents/home-sections/community-section.tsx
diff --git a/src/components/events-section.tsx → ...mponents/home-sections/events-section.tsx b/src/components/events-section.tsx → ...mponents/home-sections/events-section.tsx
diff --git a/src/components/hero.tsx → src/components/home-sections/hero.tsx b/src/components/hero.tsx → src/components/home-sections/hero.tsx
diff --git a/src/components/open-source-section.tsx → ...nts/home-sections/open-source-section.tsx b/src/components/open-source-section.tsx → ...nts/home-sections/open-source-section.tsx
diff --git a/src/components/resources-section.tsx → ...nents/home-sections/resources-section.tsx b/src/components/resources-section.tsx → ...nents/home-sections/resources-section.tsx
diff --git a/src/components/team-section.tsx → ...components/home-sections/team-section.tsx b/src/components/team-section.tsx → ...components/home-sections/team-section.tsx
diff --git a/src/components/theme-provider.tsx → ...mponents/home-sections/theme-provider.tsx b/src/components/theme-provider.tsx → ...mponents/home-sections/theme-provider.tsx
diff --git a/src/components/workshops-section.tsx → ...nents/home-sections/workshops-section.tsx b/src/components/workshops-section.tsx → ...nents/home-sections/workshops-section.tsx
diff --git a/src/components/footer.tsx → src/components/layout/footer.tsx b/src/components/footer.tsx → src/components/layout/footer.tsx
@@ -1,6 +1,7 @@
 import { Button } from "@/src/components/ui/button";
 import Link from "next/link";
 import { Mail, Github, Twitter } from "lucide-react";
+import { Logo } from "@/src/components/logo";
 
 export function Footer() {
   return (
@@ -9,12 +10,7 @@ export function Footer() {
         <div className="grid gap-8 md:grid-cols-4">
           {/* Brand */}
           <div className="space-y-4">
-            <Link href="/" className="flex items-center gap-2">
-              <div className="flex h-10 w-10 items-center justify-center rounded-lg bg-gradient-to-br from-primary to-primary-light text-primary-foreground font-bold">
-                D
-              </div>
-              <span className="font-bold text-foreground">Django Rwanda</span>
-            </Link>
+            <Logo size="md" />
             <p className="text-sm text-foreground/60">
               Empowering African developers through Django, open source, and
               community-driven innovation.
@@ -144,7 +140,7 @@ export function Footer() {
         <div className="mt-12 border-t border-border/30 pt-8">
           <div className="flex flex-col justify-between gap-4 sm:flex-row sm:items-center">
             <p className="text-sm text-foreground/60">
-              &copy; 2025 Django Rwanda Community. All rights reserved.
+              &copy; 2026 Django Rwanda Community. All rights reserved.
             </p>
             <div className="flex gap-6">
               <Link

diff --git a/src/components/header.tsx → src/components/layout/header.tsx b/src/components/header.tsx → src/components/layout/header.tsx
@@ -5,6 +5,7 @@ import { useState } from "react";
 import { navigationItems } from "@/src/lib/constants";
 import { Menu, X } from "lucide-react";
 import { Button } from "@/src/components/ui/button";
+import { Logo } from "@/src/components/logo";
 
 export function Header() {
   const [isMenuOpen, setIsMenuOpen] = useState(false);
@@ -14,14 +15,7 @@ export function Header() {
       <div className="mx-auto max-w-7xl px-4 sm:px-6 lg:px-8">
         <div className="flex h-16 items-center justify-between">
           {/* Logo */}
-          <Link href="/" className="flex items-center gap-2">
-            <div className="flex h-10 w-10 items-center justify-center rounded-lg bg-gradient-to-br from-primary to-primary-light text-primary-foreground font-bold">
-              D
-            </div>
-            <span className="hidden font-bold text-foreground sm:inline-block">
-              Django Rwanda
-            </span>
-          </Link>
+          <Logo size="lg" showText />
 
           {/* Desktop Navigation */}
           <nav className="hidden items-center gap-8 md:flex">

diff --git a/src/components/logo.tsx b/src/components/logo.tsx
@@ -0,0 +1,52 @@
+import Image from "next/image";
+import Link from "next/link";
+
+interface LogoProps {
+  href?: string;
+  size?: "sm" | "md" | "lg";
+  showText?: boolean;
+  className?: string;
+}
+
+export function Logo({
+  href = "/",
+  size = "md",
+  showText = false,
+  className = "",
+}: LogoProps) {
+  const sizeMap = {
+    sm: { width: 100, height: 46, containerHeight: "h-8" },
+    md: { width: 120, height: 55, containerHeight: "h-10" },
+    lg: { width: 150, height: 69, containerHeight: "h-12" },
+  };
+
+  const logoSize = sizeMap[size];
+
+  const logoImage = (
+    <Image
+      src="/Django-Rwanda-official-logo.png"
+      alt="Django Rwanda Logo"
+      width={logoSize.width}
+      height={logoSize.height}
+      className={`${logoSize.containerHeight} w-auto rounded-lg ${className}`}
+      priority
+    />
+  );
+
+  if (!showText) {
+    return (
+      <Link href={href} className="flex items-center">
+        {logoImage}
+      </Link>
+    );
+  }
+
+  return (
+    <Link href={href} className="flex items-center gap-2">
+      {logoImage}
+      <span className="hidden font-bold text-foreground sm:inline-block">
+        Django Rwanda
+      </span>
+    </Link>
+  );
+}
diff --git a/src/lib/constants.ts b/src/lib/constants.ts
@@ -84,7 +84,7 @@ export const events = [
   },
   {
     id: 2,
-    title: "Django Bootcamp - Q1 2025",
+    title: "Django Bootcamp - Q1 2026",
     date: "January 15 - March 15",
     time: "Flexible",
     location: "Online + In-person",
@@ -178,13 +178,6 @@ export const teamMembers = [
     image: "/placeholder-user.svg",
     bio: "Championing open source contributions and technical excellence.",
   },
-  {
-    id: 4,
-    name: "Josiane",
-    role: "Content & Media Lead",
-    image: "/placeholder-user.svg",
-    bio: "Creating engaging content and managing community communications.",
-  },
   {
     id: 5,
     name: "Naphtal",