diff --git a/app/components/contribute.tsx b/app/components/contribute.tsx index 6fb6b32..919c61d 100644 --- a/app/components/contribute.tsx +++ b/app/components/contribute.tsx @@ -12,7 +12,7 @@ export default function ContributionsSection() {

Browse and Tackle Issues

- Check out the available issues on our GitHub repository. Pick one to work on, or raise your own if you spot something new! + Check out the available issues on our GitHub repository. Pick one to work on, or raise your own if you spot something new!

+ + {/* How to Contribute Steps */} +
+

+ How to Contribute +

+
    +
  1. + + 1 + + + Fork & Clone — Fork the repository on GitHub and clone it to your local machine. + +
    2. +
  2. + + 2 + + + Pick an Issue — Browse open issues or open a new one to discuss your idea before starting. + +
    3. +
  3. + + 3 + + + Create a Branch — Make a dedicated branch for your change (e.g. feat/topic-name). + +
    4. +
  4. + + 4 + + + Open a Pull Request — Push your branch and submit a PR against main. A maintainer will review it shortly. + +
    5. +
+ + Browse Issues on GitHub → + +
); } diff --git a/app/components/footer.tsx b/app/components/footer.tsx index 7684cb0..98ee561 100644 --- a/app/components/footer.tsx +++ b/app/components/footer.tsx @@ -38,6 +38,8 @@ export default function Footer() {
  • Subjects
  • Contribute
  • Sponsor
    • +
  • Quiz
    • +
  • Bookmarks
    • diff --git a/app/components/navbar.tsx b/app/components/navbar.tsx index 988aeb5..e4d4164 100644 --- a/app/components/navbar.tsx +++ b/app/components/navbar.tsx @@ -1,7 +1,8 @@ "use client"; import Link from "next/link"; import { Road_Rage } from "next/font/google"; -import { useState } from "react"; +import { useState, useEffect, useRef } from "react"; +import { usePathname } from "next/navigation"; const roadRage = Road_Rage({ variable: "--font-road-rage", @@ -11,12 +12,32 @@ const roadRage = Road_Rage({ export default function Navbar() { const [menuOpen, setMenuOpen] = useState(false); + const navRef = useRef(null); + const pathname = usePathname(); + + useEffect(() => { + function handleClickOutside(event: MouseEvent) { + if (navRef.current && !navRef.current.contains(event.target as Node)) { + setMenuOpen(false); + } + } + if (menuOpen) { + document.addEventListener("mousedown", handleClickOutside); + } + return () => document.removeEventListener("mousedown", handleClickOutside); + }, [menuOpen]); + + const linkClass = (href: string) => { + const isActive = !href.includes("#") && pathname === href; + return `hover:text-[#d2b48c] transition-colors duration-200 cursor-pointer${ + isActive ? " text-[#d2b48c] underline underline-offset-4" : "" + }`; + }; return ( -