div영역 공통화 (Main, SearchDiv, ContentDiv, Listdiv..)

packages/common/business_components/src/ui/index.ts

@@ -14,4 +14,4 @@ export * from "./title";
 export * from "./search_form_left";
 export * from "./search_form_right";
 export * from "./table_div";
-export * from "./tab";
+export * from "./list_div";

packages/common/business_components/src/ui/list_div/index.tsx

@@ -0,0 +1,11 @@
+import React from 'react'
+
+function ListDiv(props: {children: React.ReactNode}) {
+  return (
+    <div className="card card-border">
+      {props.children}
+    </div>
+  )
+}
+
+export default ListDiv

packages/common/business_components/src/ui/main_content_div/index.tsx

@@ -1,6 +1,6 @@
 import React from 'react'
 
-export default function MainContentDiv(props: {children: React.ReactNode}) {
+export default function MainDiv(props: {children: React.ReactNode}) {
   return (
     <div className="min-h-screen bg-gray-50 p-8">
         {props.children}
@@ -8,4 +8,4 @@ export default function MainContentDiv(props: {children: React.ReactNode}) {
   )
 }
 
-export { MainContentDiv };
+export { MainDiv };

packages/common/business_components/src/ui/search_form/index.tsx

@@ -1,6 +1,6 @@
 function SearchDiv ({children}:{ children: React.ReactNode; }) {
    return (
-      <div className="flex bg-white rounded-lg shadow-sm mb-6 p-6">
+      <div className="flex card card-border !mt-6">
         {children}   
       </div>
     )

packages/common/business_components/src/ui/table/index.tsx

@@ -21,10 +21,10 @@ export function UiTable({ tableData, headlist, pageSize, total, children, headNa
 
   return (
     <>
-      {headName ? <div className="font-bold m-3">
+      {headName ? <div className="card-header">
           {headName}
         </div> : <></>}
-      <Table className="w-full">
+      <Table>
         <TableHeader>
           {children ? <>{children}</> : <TableRow>
             {headlist?.map((head) => (

packages/common/business_components/src/ui/table_div/index.tsx

@@ -2,7 +2,7 @@
 
 function ContentsDiv(props: {children: React.ReactNode}) {
   return (
-    <div className="bg-white rounded-lg shadow-sm mb-6 p-6">
+    <div className="card card-border !mt-6">
         {props.children}
     </div>
   )