From 16a15629001f8843920625adae641d4f4ee799cc Mon Sep 17 00:00:00 2001
From: JzoNg <jzongcode@gmail.com>
Date: Tue, 19 Mar 2024 17:06:13 +0800
Subject: [PATCH] fix style of tip modal

---
 web/app/components/app-sidebar/app-info.tsx        | 7 +++++--
 web/app/components/app/create-app-dialog/index.tsx | 4 ++--
 2 files changed, 7 insertions(+), 4 deletions(-)

diff --git a/web/app/components/app-sidebar/app-info.tsx b/web/app/components/app-sidebar/app-info.tsx
index 394756039a..ec9e2f2bff 100644
--- a/web/app/components/app-sidebar/app-info.tsx
+++ b/web/app/components/app-sidebar/app-info.tsx
@@ -287,12 +287,15 @@ const AppInfo = ({ expand }: IAppInfoProps) => {
               )}
             >
               <div className={cn(
-                'w-full h-[256px] bg-center bg-no-repeat bg-contain',
+                'w-full h-[256px] bg-center bg-no-repeat bg-contain rounded-xl',
                 showSwitchTip === 'chat' && s.expertPic,
                 showSwitchTip === 'completion' && s.completionPic,
               )}/>
               <div className='px-4 pb-2'>
-                <div className='text-gray-700 text-md leading-6 font-semibold'>{t('app.newApp.advanced')}</div>
+                <div className='flex items-center gap-1 text-gray-700 text-md leading-6 font-semibold'>
+                  {t('app.newApp.advanced')}
+                  <span className='px-1 rounded-[5px] bg-white border border-black/8 text-gray-500 text-[10px] leading-[18px] font-medium'>BETA</span>
+                </div>
                 <div className='text-orange-500 text-xs leading-[18px] font-medium'>{t('app.newApp.advancedFor')}</div>
                 <div className='mt-1 text-gray-500 text-sm leading-5'>{t('app.newApp.advancedDescription')}</div>
               </div>
diff --git a/web/app/components/app/create-app-dialog/index.tsx b/web/app/components/app/create-app-dialog/index.tsx
index 2cc4b0b919..83ee455996 100644
--- a/web/app/components/app/create-app-dialog/index.tsx
+++ b/web/app/components/app/create-app-dialog/index.tsx
@@ -44,7 +44,7 @@ const CreateAppDialog = ({ show, onSuccess, onClose }: CreateAppDialogProps) =>
       >
         {showInstruction === 'BASIC' && (
           <>
-            <div className={cn('w-full h-[256px] bg-center bg-no-repeat bg-contain', s.basicPic)}/>
+            <div className={cn('w-full h-[256px] bg-center bg-no-repeat bg-contain rounded-xl', s.basicPic)}/>
             <div className='px-4 pb-2'>
               <div className='text-gray-700 text-md leading-6 font-semibold'>{t('app.newApp.basic')}</div>
               <div className='text-orange-500 text-xs leading-[18px] font-medium'>{t('app.newApp.basicFor')}</div>
@@ -54,7 +54,7 @@ const CreateAppDialog = ({ show, onSuccess, onClose }: CreateAppDialogProps) =>
         )}
         {showInstruction === 'ADVANCED' && (
           <>
-            <div className={cn('w-full h-[256px] bg-center bg-no-repeat bg-contain', s.advancedPic)}/>
+            <div className={cn('w-full h-[256px] bg-center bg-no-repeat bg-contain rounded-xl', s.advancedPic)}/>
             <div className='px-4 pb-2'>
               <div className='flex items-center gap-1 text-gray-700 text-md leading-6 font-semibold'>
                 {t('app.newApp.advanced')}