light mode

Author: abhitrueprogrammer

src/components/CatalogueContent.tsx

@@ -319,17 +319,17 @@ const CatalogueContent = () => {
 
         <div className="flex items-center gap-2 p-7">
           <div>
-            <p className="text-s font-semibold text-white/80">
+            <p className="text-s font-semibold text-gray-700 dark:text-white/80">
               {subject?.split("[")[1]?.replace("]", "")}
             </p>
-            <h2 className="text-2xl font-extrabold text-white md:text-3xl">
+            <h2 className="text-2xl font-extrabold text-gray-700 dark:text-white md:text-3xl">
               {subject?.split(" [")[0]}
             </h2>
           </div>
           <div className="mt-7">
             <button onClick={handlePinToggle}>
               <Pin
-                className={`h-7 w-7 ${pinned ? "fill-[#A78BFA]" : ""} stroke-white`}
+                className={`h-7 w-7 ${pinned ? "fill-[#A78BFA]" : ""} stroke-gray-700 dark:stroke-white`}
               />
             </button>
           </div>

src/components/Navbar.tsx

@@ -58,14 +58,14 @@ function Navbar() {
 
           <div className="mt-3 hidden md:flex">
             <Link href="/pinned">
-              <div className="ml-2 flex items-center gap-2 rounded-full border border-[#3A3745] px-4 py-2 text-sm font-semibold text-white transition hover:bg-[#1A1823]">
+              <div className="ml-2 flex items-center gap-2 rounded-full border bg-[#e8e9ff] dark:bg-black border-[#3A3745] px-4 py-2 text-sm font-semibold dark:text-white transition hover:bg-slate-50 text-gray-700 dark:hover:bg-[#1A1823]">
                 <Pin className="h-4 w-4" />
                 Pinned Subjects
               </div>
             </Link>
             <div className="ml-2 hidden md:flex">
               <Link href="/request">
-                <div className="ml-2 flex items-center gap-2 rounded-full border border-[#3A3745] px-4 py-2 text-sm font-semibold text-white transition hover:bg-[#1A1823]">
+                <div className="ml-2 flex items-center gap-2 rounded-full border bg-[#e8e9ff] dark:bg-black border-[#3A3745] px-4 py-2 text-sm font-semibold dark:text-white transition hover:bg-slate-50 text-gray-700 dark:hover:bg-[#1A1823]">
                   <ArrowUpRight className="h-4 w-4" />
                   Paper Request
                 </div>
@@ -86,7 +86,7 @@ function Navbar() {
           </div>
 
           <Link href={pathname === "/upload" ? "/" : "/upload"}>
-            <div className="flex items-center gap-2 rounded-full border border-[#3A3745] px-4 py-2 text-sm font-semibold text-white transition hover:bg-[#1A1823]">
+            <div className="flex items-center gap-2 rounded-full border bg-[#e8e9ff] dark:bg-black border-[#3A3745] px-4 py-2 text-sm font-semibold dark:text-white transition hover:bg-slate-50 text-gray-700 dark:hover:bg-[#1A1823]">
               <ArrowDownLeftIcon className="h-4 w-4 rotate-90" />
               <span>
                 {pathname === "/upload" ? "Search Papers" : "Upload Papers"}

src/components/Searchbar/searchbar-child.tsx

@@ -145,7 +145,7 @@ function SearchBarChild({
                   </div>
                   <span
                     id="subject"
-                    className="items-center text-sm tracking-wide text-white sm:text-base"
+                    className="items-center text-sm tracking-wide text-black dark:text-white sm:text-base"
                   >
                     {suggestion}
                   </span>