From 772da88e9b64c68256c52d95f93d0f38488780c0 Mon Sep 17 00:00:00 2001
From: Takeshi Kimata <117462761+kimatata@users.noreply.github.com>
Date: Sat, 4 May 2024 13:39:19 +0900
Subject: [PATCH] Adjust Appearance

---
 .../app/[locale]/projects/ProjectsPage.tsx    | 58 +++++++++----------
 .../[folderId]/cases/TestCaseTable.tsx        | 19 ++++--
 2 files changed, 41 insertions(+), 36 deletions(-)

diff --git a/frontend/src/app/[locale]/projects/ProjectsPage.tsx b/frontend/src/app/[locale]/projects/ProjectsPage.tsx
index b2cc51c..d8dd657 100644
--- a/frontend/src/app/[locale]/projects/ProjectsPage.tsx
+++ b/frontend/src/app/[locale]/projects/ProjectsPage.tsx
@@ -81,38 +81,36 @@ export default function ProjectsPage({ messages, locale }: Props) {
   };
 
   return (
-    <div className="flex justify-center">
-      <div className="container mx-auto max-w-3xl pt-16 px-6 flex-grow">
-        <div className="w-full p-3 flex items-center justify-between">
-          <h3 className="font-bold">{messages.project}</h3>
-          <div>
-            <Button
-              startContent={<Plus size={16} />}
-              size="sm"
-              color="primary"
-              onClick={openDialogForCreate}
-            >
-              {messages.newProject}
-            </Button>
-          </div>
+    <div className="container mx-auto max-w-3xl pt-16 px-6 flex-grow">
+      <div className="w-full p-3 flex items-center justify-between">
+        <h3 className="font-bold">{messages.project}</h3>
+        <div>
+          <Button
+            startContent={<Plus size={16} />}
+            size="sm"
+            color="primary"
+            onClick={openDialogForCreate}
+          >
+            {messages.newProject}
+          </Button>
         </div>
-
-        <ProjectsTable
-          projects={projects}
-          onEditProject={onEditClick}
-          onDeleteProject={onDeleteClick}
-          messages={messages}
-          locale={locale}
-        />
-
-        <ProjectDialog
-          isOpen={isProjectDialogOpen}
-          editingProject={editingProject}
-          onCancel={closeDialog}
-          onSubmit={onSubmit}
-          messages={messages}
-        />
       </div>
+
+      <ProjectsTable
+        projects={projects}
+        onEditProject={onEditClick}
+        onDeleteProject={onDeleteClick}
+        messages={messages}
+        locale={locale}
+      />
+
+      <ProjectDialog
+        isOpen={isProjectDialogOpen}
+        editingProject={editingProject}
+        onCancel={closeDialog}
+        onSubmit={onSubmit}
+        messages={messages}
+      />
     </div>
   );
 }
diff --git a/frontend/src/app/[locale]/projects/[projectId]/folders/[folderId]/cases/TestCaseTable.tsx b/frontend/src/app/[locale]/projects/[projectId]/folders/[folderId]/cases/TestCaseTable.tsx
index ec0bab1..679e615 100644
--- a/frontend/src/app/[locale]/projects/[projectId]/folders/[folderId]/cases/TestCaseTable.tsx
+++ b/frontend/src/app/[locale]/projects/[projectId]/folders/[folderId]/cases/TestCaseTable.tsx
@@ -74,6 +74,7 @@ export default function TestCaseTable({
       return sortDescriptor.direction === "descending" ? -cmp : cmp;
     });
   }, [sortDescriptor, cases]);
+
   const renderCell = useCallback((testCase: Case, columnKey: Key) => {
     const cellValue = testCase[columnKey as keyof Case];
 
@@ -82,13 +83,19 @@ export default function TestCaseTable({
         return <span>{cellValue}</span>;
       case "title":
         return (
-          <Link
-            href={`/projects/${projectId}/folders/${testCase.folderId}/cases/${testCase.id}`}
-            locale={locale}
-            className={NextUiLinkClasses}
+          <Button
+            size="sm"
+            variant="light"
+            className="data-[hover=true]:bg-transparent"
           >
-            {cellValue}
-          </Link>
+            <Link
+              href={`/projects/${projectId}/folders/${testCase.folderId}/cases/${testCase.id}`}
+              locale={locale}
+              className={NextUiLinkClasses}
+            >
+              {cellValue}
+            </Link>
+          </Button>
         );
       case "priority":
         return (