diff --git a/src/components/SideBarStatus.tsx b/src/components/SideBarStatus.tsx
index 2279e4b..c15b4ed 100644
--- a/src/components/SideBarStatus.tsx
+++ b/src/components/SideBarStatus.tsx
@@ -33,10 +33,12 @@ const useStyles = makeStyles((theme: Theme) =>
     button: {
       '&:hover': {
         backgroundColor: '#2c2c2c',
+        color: 'white',
 
         // https://github.com/mui-org/material-ui/issues/22543
         '@media (hover: none)': {
           backgroundColor: '#2c2c2c',
+          color: 'white',
         },
       },
     },
diff --git a/src/theme.tsx b/src/theme.tsx
index 8cffb1a..ee4b661 100644
--- a/src/theme.tsx
+++ b/src/theme.tsx
@@ -9,6 +9,19 @@ declare module '@material-ui/core/styles/createPalette' {
 
 // Overwriting default components styles
 const componentsOverrides = (theme: Theme) => ({
+  MuiListItem: {
+    button: {
+      '&:hover': {
+        backgroundColor: '#fcf2e8',
+        color: theme.palette.primary.main,
+        // https://github.com/mui-org/material-ui/issues/22543
+        '@media (hover: none)': {
+          backgroundColor: '#fcf2e8',
+          color: theme.palette.primary.main,
+        },
+      },
+    },
+  },
   MuiContainer: {
     root: { padding: theme.spacing(8) },
     maxWidthXs: { padding: theme.spacing(8) },