From ed9d3c25608f993e7621d5cd5a0d063cf128af2e Mon Sep 17 00:00:00 2001
From: Camron Staley <55006027+CamronStaley@users.noreply.github.com>
Date: Wed, 30 Oct 2024 11:43:43 -0500
Subject: [PATCH] Lightmode for Query Performance Toast (#5004)

* lightmode

* fix button text color
---
 app/packages/app/src/components/QueryPerformanceToast.tsx     | 4 ++--
 .../components/src/components/ThemeProvider/index.tsx         | 4 ++--
 2 files changed, 4 insertions(+), 4 deletions(-)

diff --git a/app/packages/app/src/components/QueryPerformanceToast.tsx b/app/packages/app/src/components/QueryPerformanceToast.tsx
index 50923c7314..089756e2da 100644
--- a/app/packages/app/src/components/QueryPerformanceToast.tsx
+++ b/app/packages/app/src/components/QueryPerformanceToast.tsx
@@ -21,7 +21,7 @@ const hideQueryPerformanceToast = atom({
 });
 
 const QueryPerformanceToast = () => {
-  const [shown, setShown] = useState(true);
+  const [shown, setShown] = useState(false);
   const [disabled, setDisabled] = useRecoilState(hideQueryPerformanceToast);
   const element = document.getElementById("queryPerformance");
   const theme = useTheme();
@@ -54,7 +54,7 @@ const QueryPerformanceToast = () => {
               open(QP_MODE, "_blank")?.focus();
               setOpen(false);
             }}
-            sx={{ marginLeft: "auto", backgroundColor: theme.primary.main, color: theme.text.primary, boxShadow: 0 }} // Right align the button
+            sx={{ marginLeft: "auto", backgroundColor: theme.primary.main, color: "#FFFFFF", boxShadow: 0 }} // Right align the button
           >
             View Documentation
           </Button>
diff --git a/app/packages/components/src/components/ThemeProvider/index.tsx b/app/packages/components/src/components/ThemeProvider/index.tsx
index 12eec9c116..c127702cb2 100644
--- a/app/packages/components/src/components/ThemeProvider/index.tsx
+++ b/app/packages/components/src/components/ThemeProvider/index.tsx
@@ -93,8 +93,8 @@ let theme = extendMuiTheme({
         custom: {
           shadow: "hsl(200, 0%, 90%)",
           shadowDark: "hsl(200, 0%, 70%)",
-          lightning: "#f5b700",
-          toastBackgroundColor: "#333",
+          lightning: "hsl(25, 100%, 51%)",
+          toastBackgroundColor: "#FFFFFF",
         },
         voxel: {
           500: "#FF6D04",