From ce3cd7ae03636e6a91622eff1b0a9d613fda368d Mon Sep 17 00:00:00 2001
From: Takeshi Kimata <117462761+kimatata@users.noreply.github.com>
Date: Sat, 17 Feb 2024 09:49:11 +0900
Subject: [PATCH] light and dark theme

---
 frontend/app/layout.tsx                |  2 +-
 frontend/app/page.tsx                  | 12 +-----------
 frontend/app/projects/project-card.tsx |  2 +-
 frontend/components/navbar.tsx         | 10 +++-------
 4 files changed, 6 insertions(+), 20 deletions(-)

diff --git a/frontend/app/layout.tsx b/frontend/app/layout.tsx
index c885b3c..d2ef180 100644
--- a/frontend/app/layout.tsx
+++ b/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}
diff --git a/frontend/app/page.tsx b/frontend/app/page.tsx
index 8130a06..bce66a7 100644
--- a/frontend/app/page.tsx
+++ b/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>
   );
diff --git a/frontend/app/projects/project-card.tsx b/frontend/app/projects/project-card.tsx
index 6208545..ca6800f 100644
--- a/frontend/app/projects/project-card.tsx
+++ b/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"
diff --git a/frontend/components/navbar.tsx b/frontend/components/navbar.tsx
index 51a0ffe..7dab529 100644
--- a/frontend/components/navbar.tsx
+++ b/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(
-                  linkStyles({ color: "foreground" }),
-                  "data-[active=true]:text-primary data-[active=true]:font-medium"
-                )}
-                color="foreground"
+                className="data-[active=true]:text-primary data-[active=true]:font-medium"
                 href={item.href}
               >
                 {item.label}