basic StaticHeader working

Author: monicasmith463

frontend/src/app/(study-assistant)/layout.tsx

@@ -0,0 +1,28 @@
+"use client";
+
+import StaticHeader from "@/layout/StaticHeader";
+import Backdrop from "@/layout/Backdrop";
+import React from "react";
+
+export default function AdminLayout({
+  children,
+}: {
+  children: React.ReactNode;
+}) {
+
+  return (
+    <div className="min-h-screen xl:flex">
+      {/* Sidebar and Backdrop */}
+      <Backdrop />
+      {/* Main Content Area */}
+      <div
+        className={`flex-1 transition-all  duration-300 ease-in-out`}
+      >
+        {/* Header */}
+        <StaticHeader />
+        {/* Page Content */}
+        <div className="p-4 mx-auto md:p-6">{children}</div>
+      </div>
+    </div>
+  );
+}

frontend/src/app/(study-assistant)/page.tsx

@@ -0,0 +1,14 @@
+// src/app/landing/page.tsx
+import React from "react";
+
+export default function LandingPage() {
+  return (
+    <div className="text-center space-y-6">
+      <h2 className="text-3xl font-bold">Welcome to Study Assistant</h2>
+      <p>Upload documents, generate exams, and start practicing!</p>
+      <button className="px-6 py-3 bg-blue-600 text-white rounded-lg hover:bg-blue-700 transition">
+        Upload Docs & Generate Exam
+      </button>
+    </div>
+  );
+}

frontend/src/layout/StaticHeader.tsx

@@ -0,0 +1,54 @@
+"use client";
+
+import { ThemeToggleButton } from "@/components/common/ThemeToggleButton";
+import Image from "next/image";
+import Link from "next/link";
+import React from "react";
+
+const StaticHeader: React.FC = () => {
+  return (
+    <header className="sticky top-0 z-50 w-full border-b border-gray-200 bg-white/80 backdrop-blur-md dark:border-gray-800 dark:bg-gray-900/80">
+<div className="flex items-center justify-between px-4 py-3 sm:px-6 lg:px-8">
+          {/* Logo */}
+        <Link href="/" className="flex items-center gap-2">
+          <Image
+            width={32}
+            height={32}
+            src="/images/logo/logo.svg"
+            alt="Logo"
+            className="dark:hidden"
+          />
+          <Image
+            width={32}
+            height={32}
+            src="/images/logo/logo-dark.svg"
+            alt="Logo Dark"
+            className="hidden dark:block"
+          />
+          <span className="text-lg font-semibold text-gray-900 dark:text-white">
+            Study Assistant
+          </span>
+        </Link>
+
+        {/* Right Side Actions */}
+        <div className="flex items-center gap-3">
+          <Link
+            href="/login"
+            className="rounded-md border border-gray-300 px-3 py-1.5 text-sm font-medium text-gray-700 hover:bg-gray-100 dark:border-gray-700 dark:text-gray-200 dark:hover:bg-gray-800"
+          >
+            Log in
+          </Link>
+          <Link
+            href="/signup"
+            className="rounded-md bg-indigo-600 px-3 py-1.5 text-sm font-medium text-white hover:bg-indigo-700 dark:bg-indigo-500 dark:hover:bg-indigo-600"
+          >
+            Get Started
+          </Link>
+          <ThemeToggleButton />
+        </div>
+      </div>
+    </header>
+  );
+};
+
+export default StaticHeader;