From f8b67d8b1d7163df88d0d018319072ca2ee4cc23 Mon Sep 17 00:00:00 2001
From: yezi <yehaowei20060411@qq.com>
Date: Thu, 25 Jan 2024 22:55:50 +0800
Subject: [PATCH] =?UTF-8?q?feat:=20=E9=A6=96=E9=A1=B5=E5=B7=A5=E5=85=B7?=
 =?UTF-8?q?=E5=8D=A1=E7=89=87=E4=BC=98=E5=8C=96?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 frontend/src/components/ToolCard.tsx | 17 ++++++++---------
 1 file changed, 8 insertions(+), 9 deletions(-)

diff --git a/frontend/src/components/ToolCard.tsx b/frontend/src/components/ToolCard.tsx
index ae18c85..e990800 100644
--- a/frontend/src/components/ToolCard.tsx
+++ b/frontend/src/components/ToolCard.tsx
@@ -1,5 +1,5 @@
-import { Badge, Column, Icon, LargeText, Row, Text } from "@sscreator/ui";
-import { AiOutlineRight } from "react-icons/ai";
+import { Badge, Card, Column, Icon, LargeText, Row, Text } from "@sscreator/ui";
+import { MdKeyboardArrowRight } from "react-icons/md";
 import { useLocation } from "wouter-preact";
 
 interface Props {
@@ -21,14 +21,13 @@ export default function ToolCard({
   return (
     <button
       type="button"
+      className={unavaliable ? "cursor-not-allowed" : undefined}
       onClick={!unavaliable ? () => setLocation(path) : undefined}
     >
-      <Row className="justify-between" itemsCenter>
-        <Column className="items-start" gap="gap-2">
+      <Card className="flex items-center justify-between gap-2" withPadding>
+        <Column gap="gap-2">
           <Row gap="gap-2">
-            <LargeText className="text-left" bold>
-              {toolName}
-            </LargeText>
+            <LargeText bold>{toolName}</LargeText>
             {downgraded && <Badge colorScheme="warning">降级</Badge>}
             {unavaliable && <Badge colorScheme="danger">不可用</Badge>}
           </Row>
@@ -36,8 +35,8 @@ export default function ToolCard({
             {description}
           </Text>
         </Column>
-        {!unavaliable && <Icon icon={<AiOutlineRight size={24} />} />}
-      </Row>
+        {!unavaliable && <Icon icon={<MdKeyboardArrowRight size={36} />} />}
+      </Card>
     </button>
   );
 }