From 15ddb5fe8c294ed5211435b83dcc8c20063cffca Mon Sep 17 00:00:00 2001
From: sijinhui <sijinhui@qq.com>
Date: Wed, 15 May 2024 17:21:01 +0800
Subject: [PATCH] =?UTF-8?q?=E4=BC=98=E5=8C=96=E6=A8=A1=E5=9E=8B=E9=80=89?=
 =?UTF-8?q?=E6=8B=A9ui?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 app/components/ui-lib.module.scss |  1 +
 app/components/ui-lib.tsx         | 12 ++++++++++--
 2 files changed, 11 insertions(+), 2 deletions(-)

diff --git a/app/components/ui-lib.module.scss b/app/components/ui-lib.module.scss
index 69c686420..8e5a39723 100644
--- a/app/components/ui-lib.module.scss
+++ b/app/components/ui-lib.module.scss
@@ -329,4 +329,5 @@
 
 .cus-modal-container {
   max-width: none !important;
+  width: 80vw !important;
 }
diff --git a/app/components/ui-lib.tsx b/app/components/ui-lib.tsx
index 9ed711e29..02c4fe513 100644
--- a/app/components/ui-lib.tsx
+++ b/app/components/ui-lib.tsx
@@ -114,6 +114,7 @@ interface ModalProps {
   defaultMax?: boolean;
   footer?: React.ReactNode;
   onClose?: () => void;
+  maskClosable?: boolean;
   is_cus?: boolean;
 }
 export function Modal(props: ModalProps) {
@@ -534,6 +535,7 @@ export function ModalSelector<T extends CheckGroupValueType>(props: {
         onClose={() => props.onClose?.()}
         footer={null}
         is_cus={true}
+        maskClosable={true}
       >
         <AntList grid={{ gutter: 16 }}>
           <CheckCard.Group
@@ -541,8 +543,13 @@ export function ModalSelector<T extends CheckGroupValueType>(props: {
             defaultValue={props.defaultSelectedValue}
           >
             <Row
-              gutter={[16, 16]}
-              style={{ marginLeft: "-8px", marginRight: "-8px" }}
+              gutter={[16, 8]}
+              style={{
+                marginLeft: "-8px",
+                marginRight: "-8px",
+                display: "flex",
+                justifyContent: "center",
+              }}
             >
               {props.items.map((item, i) => {
                 const selected = props.defaultSelectedValue === item.value;
@@ -557,6 +564,7 @@ export function ModalSelector<T extends CheckGroupValueType>(props: {
                         props.onClose?.();
                       }}
                       avatar={getCheckCardAvatar(item.value?.toString() ?? "")}
+                      style={{ marginBottom: "8px", width: "250px" }}
                     />
                   </Col>
                 );