From a7ce1e5789876ff427eb45a0623cda112ffe07ee Mon Sep 17 00:00:00 2001
From: znn <jubinkumarsoni@gmail.com>
Date: Tue, 29 Jul 2025 07:07:40 +0530
Subject: [PATCH] dark mode for overlay (#23078)

---
 .../app/configuration/base/warning-mask/index.tsx         | 8 ++++----
 .../app/configuration/base/warning-mask/style.module.css  | 1 -
 2 files changed, 4 insertions(+), 5 deletions(-)

diff --git a/web/app/components/app/configuration/base/warning-mask/index.tsx b/web/app/components/app/configuration/base/warning-mask/index.tsx
index fbe58bee1..8bd7ea12a 100644
--- a/web/app/components/app/configuration/base/warning-mask/index.tsx
+++ b/web/app/components/app/configuration/base/warning-mask/index.tsx
@@ -22,14 +22,14 @@ const WarningMask: FC<IWarningMaskProps> = ({
   footer,
 }) => {
   return (
-    <div className={`${s.mask} absolute inset-0 z-10 pt-16`}
+    <div className={`${s.mask} absolute inset-0 z-10 pt-16 bg-components-panel-bg-blur`}
     >
       <div className='mx-auto px-10'>
-        <div className={`${s.icon} flex h-11 w-11 items-center justify-center rounded-xl bg-white`}>{warningIcon}</div>
-        <div className='mt-4 text-[24px] font-semibold leading-normal text-gray-800'>
+        <div className={`${s.icon} flex h-11 w-11 items-center justify-center rounded-xl bg-components-panel-bg`}>{warningIcon}</div>
+        <div className='mt-4 text-[24px] font-semibold leading-normal text-text-primary'>
           {title}
         </div>
-        <div className='mt-3 text-base text-gray-500'>
+        <div className='mt-3 text-base text-text-secondary'>
           {description}
         </div>
         <div className='mt-6'>
diff --git a/web/app/components/app/configuration/base/warning-mask/style.module.css b/web/app/components/app/configuration/base/warning-mask/style.module.css
index 87f226fd9..a2c394de2 100644
--- a/web/app/components/app/configuration/base/warning-mask/style.module.css
+++ b/web/app/components/app/configuration/base/warning-mask/style.module.css
@@ -1,5 +1,4 @@
 .mask {
-  background-color: rgba(239, 244, 255, 0.9);
   backdrop-filter: blur(2px);
 }