fix(striker-ui): align colouring in buttons

striker-ui/components/ContainedButton.tsx

@@ -1,17 +1,17 @@
 import { Button as MUIButton, SxProps, Theme } from '@mui/material';
 import { FC, useMemo } from 'react';
 
-import { BLACK, GREY, TEXT } from '../lib/consts/DEFAULT_THEME';
+import { BLACK, GREY } from '../lib/consts/DEFAULT_THEME';
 
 const ContainedButton: FC<ContainedButtonProps> = ({ sx, ...restProps }) => {
   const combinedSx = useMemo<SxProps<Theme>>(
     () => ({
-      backgroundColor: TEXT,
+      backgroundColor: GREY,
       color: BLACK,
       textTransform: 'none',
 
       '&:hover': {
-        backgroundColor: GREY,
+        backgroundColor: `${GREY}F0`,
       },
 
       ...sx,
@@ -19,15 +19,7 @@ const ContainedButton: FC<ContainedButtonProps> = ({ sx, ...restProps }) => {
     [sx],
   );
 
-  return (
-    <MUIButton
-      {...{
-        variant: 'contained',
-        ...restProps,
-        sx: combinedSx,
-      }}
-    />
-  );
+  return <MUIButton variant="contained" {...restProps} sx={combinedSx} />;
 };
 
 export default ContainedButton;

striker-ui/components/IconButton/IconButton.tsx

@@ -17,7 +17,6 @@ import {
   BORDER_RADIUS,
   DISABLED,
   GREY,
-  TEXT,
 } from '../../lib/consts/DEFAULT_THEME';
 
 type IconButtonProps = IconButtonOptionalProps & MUIIconButtonProps;
@@ -28,7 +27,7 @@ const ContainedIconButton = styled(MUIIconButton)({
   color: BLACK,
 
   '&:hover': {
-    backgroundColor: TEXT,
+    backgroundColor: `${GREY}F0`,
   },
 
   [`&.${muiInputClasses.disabled}`]: {