light and dark theme

frontend/app/layout.tsx

@@ -38,7 +38,7 @@ export default function RootLayout({
         )}
       >
         <Providers themeProps={{ attribute: "class", defaultTheme: "dark" }}>
-          <div className="relative flex flex-col h-screen bg-slate-100">
+          <div className="relative flex flex-col h-screen light:bg-gray-50 dark:bg-gray-900">
             <Navbar />
             <main className="container mx-auto max-w-7xl pt-16 px-6 flex-grow">
               {children}

frontend/app/page.tsx

@@ -1,7 +1,5 @@
 import { Link, button as buttonStyles } from "@nextui-org/react";
-import { siteConfig } from "@/config/site";
 import { title, subtitle } from "@/components/primitives";
-import { GithubIcon } from "@/components/icons";
 
 export default function Home() {
   return (
@@ -10,7 +8,7 @@ export default function Home() {
         <h1 className={title({ color: "pink" })}>Open Source&nbsp;</h1>
         <h1 className={title()}>Test Case Management Tool&nbsp;</h1>
         <br />
-        <h2 className={subtitle({ class: "mt-4" })}>
+        <h2 className={subtitle({ class: "text-inherit mt-4" })}>
           Integrate and manage all your software testing.
         </h2>
       </div>
@@ -26,14 +24,6 @@ export default function Home() {
         >
           Create first test project
         </Link>
-        <Link
-          isExternal
-          className={buttonStyles({ variant: "bordered", radius: "full" })}
-          href={siteConfig.links.github}
-        >
-          <GithubIcon size={20} />
-          GitHub
-        </Link>
       </div>
     </section>
   );

frontend/app/projects/project-card.tsx

@@ -11,7 +11,7 @@ import NextLink from "next/link";
 export function ProjectCard({ projectName, projectDetail }) {
   return (
     <NextLink href={`/projects/${1}`}>
-      <Card className="w-[250px] h-36 hover:bg-slate-200">
+      <Card className="w-[250px] h-36 bg-white hover:bg-gray-100 dark:bg-gray-700 dark:hover:bg-gray-800">
         <CardHeader className="flex gap-3 h-16">
           <Image
             alt="nextui logo"

frontend/components/navbar.tsx

@@ -9,7 +9,7 @@ import {
   Kbd,
   Link,
   Input,
-  link as linkStyles
+  link as linkStyles,
 } from "@nextui-org/react";
 
 import { siteConfig } from "@/config/site";
@@ -44,7 +44,7 @@ export const Navbar = () => {
   );
 
   return (
-    <NextUINavbar maxWidth="xl" position="sticky">
+    <NextUINavbar maxWidth="xl" position="sticky" className="bg-inherit">
       <NavbarContent className="basis-1/5 sm:basis-full" justify="start">
         <NavbarBrand as="li" className="gap-3 max-w-fit">
           <NextLink className="flex justify-start items-center gap-1" href="/">
@@ -61,11 +61,7 @@ export const Navbar = () => {
           {siteConfig.navItems.map((item) => (
             <NavbarItem key={item.href}>
               <NextLink
-                className={clsx(
+                className="data-[active=true]:text-primary data-[active=true]:font-medium"
-                  linkStyles({ color: "foreground" }),
-                  "data-[active=true]:text-primary data-[active=true]:font-medium"
-                )}
-                color="foreground"
                 href={item.href}
               >
                 {item.label}