From c04b9b0adb186ea10cf420236091c53577efcfae Mon Sep 17 00:00:00 2001
From: Carter <carter@adaptiveagriculture.ca>
Date: Mon, 18 Nov 2024 13:39:39 -0600
Subject: [PATCH] fixed some theming stuff, buttons highlight correctly now

---
 src/app/{AuthHTTPWrapper.tsx => App.tsx} |  4 ++--
 src/app/Header.tsx                       |  5 -----
 src/app/main.tsx                         |  4 ++--
 src/theme/theme.ts                       | 26 +++++++++++++++++++++++-
 4 files changed, 29 insertions(+), 10 deletions(-)
 rename src/app/{AuthHTTPWrapper.tsx => App.tsx} (96%)

diff --git a/src/app/AuthHTTPWrapper.tsx b/src/app/App.tsx
similarity index 96%
rename from src/app/AuthHTTPWrapper.tsx
rename to src/app/App.tsx
index c26112e..cc174a8 100644
--- a/src/app/AuthHTTPWrapper.tsx
+++ b/src/app/App.tsx
@@ -9,7 +9,7 @@ import { Theme, ThemeProvider } from '@mui/material'
 import { CreateTheme } from '../theme/theme'
 import { getThemeType, setThemeType } from '../theme/themeType'
 
-function AuthHTTPWrapper() {
+function App() {
   const [token, setToken] = useState<string | undefined>(undefined)
   const [palette, setPalette] = useState<Theme>(CreateTheme(getThemeType()));
 
@@ -56,4 +56,4 @@ function AuthHTTPWrapper() {
   )
 }
 
-export default AuthHTTPWrapper
+export default App
diff --git a/src/app/Header.tsx b/src/app/Header.tsx
index 91e1104..f381033 100644
--- a/src/app/Header.tsx
+++ b/src/app/Header.tsx
@@ -82,14 +82,9 @@ interface Props {
 export default function Header(props: Props) {
 
     const { sideIsOpen, openSide, toggleTheme } = props;
-    // const { mode, setMode } = useColorScheme();
-
     const themeType = useThemeType();
     const classes = useStyles() 
 
-    console.log(getSignatureColour())
-    console.log(getSignatureAccentColour())
-
     return (
         <AppBar position="fixed" className={classes.appBar}>
             <Toolbar disableGutters className={classes.toolbar}>
diff --git a/src/app/main.tsx b/src/app/main.tsx
index 623521e..bef5202 100644
--- a/src/app/main.tsx
+++ b/src/app/main.tsx
@@ -1,10 +1,10 @@
 import { StrictMode } from 'react'
 import { createRoot } from 'react-dom/client'
 import './index.css'
-import AuthHTTPWrapper from './AuthHTTPWrapper.tsx'
+import App from './App.tsx'
 
 createRoot(document.getElementById('root')!).render(
   <StrictMode>
-    <AuthHTTPWrapper />
+    <App />
   </StrictMode>,
 )
diff --git a/src/theme/theme.ts b/src/theme/theme.ts
index 8112c13..0e353c6 100644
--- a/src/theme/theme.ts
+++ b/src/theme/theme.ts
@@ -27,11 +27,12 @@ function options(themeType: "light" | "dark"): ThemeOptions {
   
   const signature = getSignatureColour();
   const accent = getSignatureAccentColour();
+  const bg = generateBackgroundShades(Colours.grey[800], themeType)
   return {
     palette: {
       primary: Colours[getPrimaryColour() as keyof typeof Colours],
       secondary: Colours[getSecondaryColour() as keyof typeof Colours],
-      background: generateBackgroundShades(Colours.grey[800], themeType),
+      background: bg,
       mode: themeType,
       bxt: {
         primaryBlue: "#005bb0",
@@ -175,6 +176,29 @@ function options(themeType: "light" | "dark"): ThemeOptions {
           checked: {},
           track: {}
         }
+      },
+      MuiButton: {
+        styleOverrides: {
+          root: {
+            '& .MuiTouchRipple-root': {
+              color: accent, // Customize ripple color here
+              // color: "white"
+            },
+            '&:hover': {
+              backgroundColor: "rgba(125, 125, 125, 0.2)"
+            },
+          },
+        },
+      },
+      MuiListItemButton: {
+        styleOverrides: {
+          root: {
+            '& .MuiTouchRipple-root': {
+              color: accent, // Customize ripple color here
+              // color: "white"
+            },
+          },
+        },
       }
     }
   } as ThemeOptions;