From 8117ca5c2cc8c352222a71c67fe52cafb199d3c6 Mon Sep 17 00:00:00 2001
From: bicochan <chanii8@naver.com>
Date: Mon, 31 Mar 2025 15:10:38 +0900
Subject: [PATCH] =?UTF-8?q?design:=20=ED=85=8C=EC=9D=B4=EB=B8=94=20?=
 =?UTF-8?q?=EC=8A=A4=ED=83=80=EC=9D=BC=20=EC=88=98=EC=A0=95?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 apps/cs/src/app/styles/components.css         |  2 +-
 .../components/src/ui/data-table/index.tsx    |  2 +-
 .../components/src/ui/page-title/index.tsx    |  2 +-
 .../common/components/src/ui/table/index.tsx  |  2 +-
 .../common/components/src/ui/table/table.css  | 38 ++++++++++++-------
 5 files changed, 29 insertions(+), 17 deletions(-)

diff --git a/apps/cs/src/app/styles/components.css b/apps/cs/src/app/styles/components.css
index 17cd78834..5b9742c0f 100644
--- a/apps/cs/src/app/styles/components.css
+++ b/apps/cs/src/app/styles/components.css
@@ -120,8 +120,8 @@
 /* 블랙 테마 */
 [data-theme="black"] {
   .card-border {
-    border-color: #3f4042;
     background-color: rgba(255, 255, 255, 0.065);
+    border-color: #38383a;
   }
   .card-header {
     border-bottom-color: #3f4042;
diff --git a/packages/common/components/src/ui/data-table/index.tsx b/packages/common/components/src/ui/data-table/index.tsx
index c2c8c3591..d635e8554 100644
--- a/packages/common/components/src/ui/data-table/index.tsx
+++ b/packages/common/components/src/ui/data-table/index.tsx
@@ -55,7 +55,7 @@ function DataTable<T>({
           <TableRow
             key={row.id}
             onClick={() => onRowClick?.(row.original)}
-            className={onRowClick ? "cursor-pointer hover:bg-muted" : ""}
+            className={onRowClick ? "cursor-pointer hover:bg-accent" : ""}
           >
             {row.getVisibleCells().map((cell) => {
               const { meta } = cell.column.columnDef;
diff --git a/packages/common/components/src/ui/page-title/index.tsx b/packages/common/components/src/ui/page-title/index.tsx
index 69796a428..6ea4a577e 100644
--- a/packages/common/components/src/ui/page-title/index.tsx
+++ b/packages/common/components/src/ui/page-title/index.tsx
@@ -10,7 +10,7 @@ const PageTitle = ({
   return (
     <div className="flex w-full items-center justify-between px-[1.8rem] pt-[2rem]">
       <h2 className="text-[2.4rem] font-semibold text-title">{title}</h2>
-      {menuPaths.length && (
+      {menuPaths.length > 0 && (
         <div className="flex items-center gap-3">
           <i className="diveicon di-home-fill text-foreground" />
           {menuPaths?.map((path, i) => (
diff --git a/packages/common/components/src/ui/table/index.tsx b/packages/common/components/src/ui/table/index.tsx
index 46c8db39c..ba50e9d75 100644
--- a/packages/common/components/src/ui/table/index.tsx
+++ b/packages/common/components/src/ui/table/index.tsx
@@ -9,7 +9,7 @@ interface TableProps extends React.HTMLAttributes<HTMLTableElement> {
 }
 
 const Table = React.forwardRef<HTMLTableElement, TableProps>(
-  ({ className, variant, ...props }, ref) => (
+  ({ className, variant = "default", ...props }, ref) => (
     <div className="relative w-full">
       <table
         ref={ref}
diff --git a/packages/common/components/src/ui/table/table.css b/packages/common/components/src/ui/table/table.css
index 08233787a..9a7dea99f 100644
--- a/packages/common/components/src/ui/table/table.css
+++ b/packages/common/components/src/ui/table/table.css
@@ -1,38 +1,50 @@
 @tailwind components;
 
 @layer components {
+  .table-ui tr {
+    @apply border-0 hover:bg-accent;
+  }
   .table-ui th {
-    @apply bg-[#5987bf] px-4 py-[1.2rem] text-[1.3rem] font-medium leading-[1.2] text-[#fff];
+    @apply px-4 py-[1.2rem] text-[1.3rem] font-medium leading-[1.2];
   }
   .table-ui td {
-    @apply border-b border-b-border px-2 py-[1.2rem] text-[1.3rem] font-normal leading-[1.2] text-label;
+    @apply px-2 py-[1.2rem] text-[1.3rem] font-normal leading-[1.2];
   }
 
+  .table-ui.default th {
+    @apply bg-[#5987bf] text-[#fff];
+  }
+  .table-ui.default td {
+    @apply border-b border-b-border text-label;
+  }
   .table-ui.secondary th {
     @apply border border-border bg-[#eaf3fb] text-[#647784];
   }
-
   .table-ui.secondary td {
     @apply border border-border;
   }
-
-  .table-ui.line th {
-    @apply border-0 border-b-2 border-t border-b-[#d4e0ea] border-t-[#d4e0ea] bg-[#fff] text-[#555];
+  .table-ui.line tr {
+    @apply border-b border-t border-[#d4e0ea] bg-transparent;
   }
-
-  .table-ui.line td {
-    @apply border-b border-b-border;
+  .table-ui.line th {
+    @apply border-b-2 border-[#d4e0ea] text-[#555];
   }
 
   [data-theme="black"] {
-    .table-ui th {
-      @apply bg-[#5e7b9c] text-[#fff];
+    .table-ui.default tr {
+      @apply bg-[#545556];
+    }
+    .table-ui.default th {
+      @apply bg-[#62686d];
+    }
+    .table-ui.secondary tr {
+      @apply bg-[#565b5f];
     }
     .table-ui.secondary th {
-      @apply bg-[#1a1c1d];
+      @apply bg-[#5e7b9c] text-[#fff];
     }
     .table-ui.line th {
-      @apply bg-[#0a0a0a];
+      @apply text-[#fff];
     }
   }
 }