init commit

Author: 0paziz

src/app/components/Footer.jsx

@@ -6,14 +6,14 @@ export default function Footer() {
 
 <>
 
-<div className="text-center py-2">
+<footer className="w-full bg-gray-100 text-center px-4 py-4">
+  <div className="max-w-screen-lg mx-auto">
+    <span className="block text-sm text-gray-500">
+      © 2025 Abdiaziz. All Rights Reserved. Built with <span role="img" aria-label="heart">❤️</span>
+    </span>
+  </div>
+</footer>
 
-  <span className="block text-sm text-center text-gray-500 py-2 ">
-    © 2025 Abdiaziz. All Rights Reserved. Built with{" ❤️"}
-  </span>
-
-  
-</div>
 
 
 </>

src/app/components/Navbar.jsx

@@ -1,15 +1,36 @@
 'use client'
-
-import React from 'react'
+import { useState } from "react";
 
 export default function Navbar() {
+  const [isOpen, setIsOpen] = useState(false);
+
   return (
-    <nav className="flex items-center justify-between px-24 py-4 shadow bg-blue-950">
-      <h1 className="text-xl font- text-white text-center">JS Projects</h1>
-      <div className='flex items-center gap-5'>
-        <a href='#home' className='text-white hover:text-blue-500'> Home </a>
-        <a href='#projects' className='text-white hover:text-blue-500'>Projects</a>
+    <nav className="bg-blue-950 px-6 md:px-24 py-4 shadow">
+      <div className="flex items-center justify-between">
+        <h1 className="text-xl font-bold text-white">JS Projects</h1>
+
+        {/* Hamburger button */}
+        <button
+          className="text-white md:hidden"
+          onClick={() => setIsOpen(!isOpen)}
+        >
+          ☰
+        </button>
+
+        {/* Desktop Links */}
+        <div className="hidden md:flex items-center gap-5">
+          <a href="#home" className="text-white hover:text-blue-500">Home</a>
+          <a href="#projects" className="text-white hover:text-blue-500">Projects</a>
+        </div>
       </div>
+
+      {/* Mobile Links */}
+      {isOpen && (
+        <div className="flex flex-col mt-3 gap-2 md:hidden">
+          <a href="#home" className="text-white hover:text-blue-500">Home</a>
+          <a href="#projects" className="text-white hover:text-blue-500">Projects</a>
+        </div>
+      )}
     </nav>
-  )
+  );
 }

src/app/components/Psection.jsx

@@ -73,7 +73,7 @@ export default function Home() {
     {
       title: 'Quiz App',
       description: 'Simple quiz app in vanilla JS.',
-      image: '/images/quiz.png',
+      image: './images/quiz.png',
       liveLink: 'https://0paziz.github.io/QuizApp/',
       githubLink: 'https://github.com/0paziz/QuizApp',
       category: 'Vanilla JS',

src/app/globals.css

@@ -25,5 +25,5 @@ html {
 
 
 .bgurl{
-      background-image: url('/images/bg.svg');
+      background-image: url('./images/bg.svg');
 }