From fd2ffd2ef09ff50b8c338389084b65fcf63d1a77 Mon Sep 17 00:00:00 2001
From: Jason Chuang <jchuang@2fi-solutions.com.hk>
Date: Fri, 28 Nov 2025 10:48:59 +0800
Subject: [PATCH] grey login

---
 src/assets/style/styles.css |  4 ++++
 src/index.js                | 21 ++++++++++++++++++++-
 2 files changed, 24 insertions(+), 1 deletion(-)

diff --git a/src/assets/style/styles.css b/src/assets/style/styles.css
index 0226765..196ca43 100644
--- a/src/assets/style/styles.css
+++ b/src/assets/style/styles.css
@@ -11,6 +11,10 @@ body,
   font-family: "Noto Sans HK", "Noto Sans SC";
 }
 
+.page-grey {
+  filter: grayscale(100%);
+}
+
 /* Chrome, Safari, Edge, Opera */
 input::-webkit-outer-spin-button,
 input::-webkit-inner-spin-button {
diff --git a/src/index.js b/src/index.js
index abf9204..e1e4fa3 100644
--- a/src/index.js
+++ b/src/index.js
@@ -21,6 +21,23 @@ import { AutoLogoutProvider } from "components/AutoLogoutProvider";
 import { RefreshTokenProvider } from "components/RefreshTokenProvider";
 import { SysSettingProvider } from "components/SysSettingProvider";
 
+import { useLocation } from 'react-router-dom';
+import { useEffect } from 'react';
+
+function GreyWrapper({ children }) {
+  const location = useLocation();
+
+  useEffect(() => {
+    if (location.pathname === "/login") {
+      document.body.classList.add("page-grey");
+    } else {
+      document.body.classList.remove("page-grey");
+    }
+  }, [location.pathname]);
+
+  return children;
+}
+
 // ==============================|| MAIN - REACT DOM RENDER  ||============================== //
 
 const container = document.getElementById('root');
@@ -36,7 +53,9 @@ root.render(
           <BrowserRouter basename="/">
             <RefreshTokenProvider>
               <AutoLogoutProvider>
-                <App />
+                <GreyWrapper>
+                  <App />
+                </GreyWrapper>
               </AutoLogoutProvider>
             </RefreshTokenProvider>
           </BrowserRouter>