feat: old page ui style optiminize

app/components/exporter.module.scss

@@ -2,6 +2,9 @@
   &-body {
     margin-top: 20px;
   }
+  div:not(.no-dark) > svg {
+    filter: invert(0.5);
+  }
 }
 
 .export-content {

app/components/mask.module.scss

@@ -4,6 +4,10 @@
   display: flex;
   flex-direction: column;
 
+  div:not(.no-dark) > svg {
+    filter: invert(0.5);
+  }
+
   .mask-page-body {
     padding: 20px;
     overflow-y: auto;

app/components/mask.tsx

@@ -465,8 +465,6 @@ export function MaskPage(props: { className?: string }) {
     });
   };
 
-  const isMobileScreen = useMobileScreen();
-
   return (
     <>
       <div

app/components/new-chat.module.scss

@@ -8,6 +8,10 @@
   justify-content: center;
   flex-direction: column;
 
+  div:not(.no-dark) > svg {
+    filter: invert(0.5);
+  }
+
   .mask-header {
     display: flex;
     justify-content: space-between;

app/containers/index.tsx

@@ -117,7 +117,7 @@ export default function Home() {
                   <NewChat
                     className={`
               md:w-[100%] px-1
-              ${config.theme === "dark" ? "" : "bg-gray-50"}
+              ${config.theme === "dark" ? "bg-[var(--white)]" : "bg-gray-50"}
               ${config.isMobileScreen ? "pb-chat-panel-mobile" : ""}
               `}
                   />
@@ -129,7 +129,7 @@ export default function Home() {
                   <MaskPage
                     className={`
                 md:w-[100%]
-                ${config.theme === "dark" ? "" : "bg-gray-50"}
+                ${config.theme === "dark" ? "bg-[var(--white)]" : "bg-gray-50"}
                 ${config.isMobileScreen ? "pb-chat-panel-mobile" : ""}
               `}
                   />

app/styles/globals.scss

@@ -38,10 +38,6 @@
   --border-in-light: 1px solid rgba(255, 255, 255, 0.192);
 
   --theme-color: var(--gray);
-
-  div:not(.no-dark) > svg {
-    filter: invert(0.5);
-  }
 }
 
 .light {