From 0ec5d53e5b770f9854f3fce2c4a02bd3a78adc16 Mon Sep 17 00:00:00 2001
From: yessenia <yessenia.contact@gmail.com>
Date: Sat, 11 Oct 2025 20:37:37 +0800
Subject: [PATCH] fix(trigger): log style

---
 web/app/components/base/modal/modal.tsx         | 14 +++++++++-----
 .../subscription-list/delete-confirm.tsx        |  1 +
 .../subscription-list/log-viewer.tsx            | 17 ++++++++++++++---
 3 files changed, 24 insertions(+), 8 deletions(-)

diff --git a/web/app/components/base/modal/modal.tsx b/web/app/components/base/modal/modal.tsx
index cbcbe31c6f..e8edc48fba 100644
--- a/web/app/components/base/modal/modal.tsx
+++ b/web/app/components/base/modal/modal.tsx
@@ -55,13 +55,13 @@ const Modal = ({
       >
         <div
           className={cn(
-            'max-h-[80%] overflow-y-auto rounded-2xl border-[0.5px] border-components-panel-border bg-components-panel-bg shadow-xs',
+            'flex max-h-[80%] flex-col rounded-2xl border-[0.5px] border-components-panel-border bg-components-panel-bg shadow-xs',
             size === 'sm' && 'w-[480px]',
             size === 'md' && 'w-[640px]',
           )}
           onClick={e => e.stopPropagation()}
         >
-          <div className='title-2xl-semi-bold relative p-6 pb-3 pr-14 text-text-primary'>
+          <div className='title-2xl-semi-bold relative shrink-0 p-6 pb-3 pr-14 text-text-primary'>
             {title}
             {
               subTitle && (
@@ -79,10 +79,10 @@ const Modal = ({
           </div>
           {
             children && (
-              <div className='px-6 py-3'>{children}</div>
+              <div className='min-h-0 flex-1 overflow-y-auto px-6 py-3'>{children}</div>
             )
           }
-          <div className='flex justify-between p-6 pt-5'>
+          <div className='flex shrink-0 justify-between p-6 pt-5'>
             <div>
               {footerSlot}
             </div>
@@ -117,7 +117,11 @@ const Modal = ({
               </Button>
             </div>
           </div>
-          {bottomSlot}
+          {bottomSlot && (
+            <div className='shrink-0'>
+              {bottomSlot}
+            </div>
+          )}
         </div>
       </PortalToFollowElemContent>
     </PortalToFollowElem>
diff --git a/web/app/components/plugins/plugin-detail-panel/subscription-list/delete-confirm.tsx b/web/app/components/plugins/plugin-detail-panel/subscription-list/delete-confirm.tsx
index 54f282a90a..ced7dd7994 100644
--- a/web/app/components/plugins/plugin-detail-panel/subscription-list/delete-confirm.tsx
+++ b/web/app/components/plugins/plugin-detail-panel/subscription-list/delete-confirm.tsx
@@ -69,5 +69,6 @@ export const DeleteConfirm = (props: Props) => {
     isLoading={isDeleting}
     onConfirm={onConfirm}
     onCancel={() => onClose(false)}
+    maskClosable={false}
   />
 }
diff --git a/web/app/components/plugins/plugin-detail-panel/subscription-list/log-viewer.tsx b/web/app/components/plugins/plugin-detail-panel/subscription-list/log-viewer.tsx
index 278b70a2ec..7c7cad69c1 100644
--- a/web/app/components/plugins/plugin-detail-panel/subscription-list/log-viewer.tsx
+++ b/web/app/components/plugins/plugin-detail-panel/subscription-list/log-viewer.tsx
@@ -117,15 +117,26 @@ const LogViewer = ({ logs, className }: Props) => {
           <div
             key={logId}
             className={cn(
-              'relative rounded-lg border bg-components-panel-on-panel-item-bg shadow-sm hover:bg-components-panel-on-panel-item-bg-hover',
+              'relative overflow-hidden rounded-lg border bg-components-panel-on-panel-item-bg shadow-sm hover:bg-components-panel-on-panel-item-bg-hover',
               isError && 'border-state-destructive-border',
               !isError && isExpanded && 'border-components-panel-border',
               !isError && !isExpanded && 'border-components-panel-border-subtle',
             )}
           >
             {isError && (
-              <div className='absolute -left-1 -top-4 h-16 w-16 opacity-10'>
-                <div className='h-full w-full rounded-full bg-text-destructive' />
+              <div className='pointer-events-none absolute left-0 top-0 h-7 w-[179px]'>
+                <svg xmlns="http://www.w3.org/2000/svg" width="179" height="28" viewBox="0 0 179 28" fill="none" className='h-full w-full'>
+                  <g filter="url(#filter0_f_error_glow)">
+                    <circle cx="27" cy="14" r="32" fill="#F04438" fillOpacity="0.25"/>
+                  </g>
+                  <defs>
+                    <filter id="filter0_f_error_glow" x="-125" y="-138" width="304" height="304" filterUnits="userSpaceOnUse" colorInterpolationFilters="sRGB">
+                      <feFlood floodOpacity="0" result="BackgroundImageFix"/>
+                      <feBlend mode="normal" in="SourceGraphic" in2="BackgroundImageFix" result="shape"/>
+                      <feGaussianBlur stdDeviation="60" result="effect1_foregroundBlur"/>
+                    </filter>
+                  </defs>
+                </svg>
               </div>
             )}