fix: change the colour of the list item when hover over

striker-ui/components/Anvils/AnvilList.tsx

@@ -1,22 +1,25 @@
 import { makeStyles } from '@material-ui/core/styles';
 import { ClassNameMap } from '@material-ui/styles';
 import { List, Box, Divider, ListItem } from '@material-ui/core';
-import { BLUE, PURPLE_OFF, RED_ON, TEXT } from '../../lib/consts/DEFAULT_THEME';
+import {
+  BLUE,
+  PURPLE_OFF,
+  RED_ON,
+  TEXT,
+  HOVER,
+} from '../../lib/consts/DEFAULT_THEME';
 import Anvil from './Anvil';
 
 const useStyles = makeStyles(() => ({
   root: {
     width: '100%',
-    '&:hover $child': {
-      backgroundColor: '#00ff00',
-    },
   },
   divider: {
     background: TEXT,
   },
   button: {
     '&:hover': {
-      backgroundColor: '#F6F6E8',
+      backgroundColor: HOVER,
     },
     paddingLeft: 0,
   },

striker-ui/components/Servers.tsx

@@ -4,21 +4,18 @@ import { ClassNameMap } from '@material-ui/styles';
 import Panel from './Panel';
 import PeriodicFetch from '../lib/fetchers/periodicFetch';
 import { HeaderText, BodyText } from './Text';
-import { BLUE, GREY, TEXT } from '../lib/consts/DEFAULT_THEME';
+import { BLUE, GREY, TEXT, HOVER } from '../lib/consts/DEFAULT_THEME';
 
 const useStyles = makeStyles(() => ({
   root: {
     width: '100%',
-    '&:hover $child': {
-      backgroundColor: '#00ff00',
-    },
   },
   divider: {
     background: TEXT,
   },
   button: {
     '&:hover': {
-      backgroundColor: '#F6F6E8',
+      backgroundColor: HOVER,
     },
     paddingLeft: 0,
   },

striker-ui/lib/consts/DEFAULT_THEME.ts

@@ -8,3 +8,4 @@ export const PANEL_BORDER = '#000000';
 export const PURPLE_OFF = '#7353BA';
 export const BLUE = '#4785FF';
 export const GREY = '#E5E5E5';
+export const HOVER = '#444';