diff --git a/src/app/grade-2/page.tsx b/src/app/grade-2/page.tsx
index f5e81ea..e34cb5d 100644
--- a/src/app/grade-2/page.tsx
+++ b/src/app/grade-2/page.tsx
@@ -3,10 +3,11 @@ import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
 import NavbarLayoutFloatingOverlay from '@/components/navbar/NavbarLayoutFloatingOverlay/NavbarLayoutFloatingOverlay';
 
 export default function Grade2Page() {
+  const navItems = [{name: "Home", id: "/"}, {name: "Grade 1", id: "/grade-1"}, {name: "Grade 2", id: "/grade-2"}, {name: "Grade 3", id: "/grade-3"}, {name: "Grade 4", id: "/grade-4"}, {name: "Grade 9", id: "/grade-9"}, {name: "Grade 10", id: "/grade-10"}, {name: "Grade 11", id: "/grade-11"}, {name: "Grade 12", id: "/grade-12"}];
   return (
     <ThemeProvider defaultButtonVariant="text-stagger" defaultTextAnimation="entrance-slide" borderRadius="rounded" contentWidth="medium" sizing="medium" background="circleGradient" cardStyle="glass-elevated" primaryButtonStyle="gradient" secondaryButtonStyle="glass" headingFontWeight="normal">
       <div id="nav" data-section="nav">
-        <NavbarLayoutFloatingOverlay navItems={[{name: "Home", id: "/"}]} brandName="Tuition Pro" />
+        <NavbarLayoutFloatingOverlay navItems={navItems} brandName="Tuition Pro" />
       </div>
       <div className="pt-32 p-8 max-w-4xl mx-auto">
         <h1 className="text-4xl font-bold mb-6">Grade 2 Curriculum</h1>