Change the shadow of the cards on hover

src/assets/theme/components/index.ts

@@ -20,3 +20,4 @@ export { MuiContainer } from './muiContainer';
 export { MuiIcon } from './muiIcon';
 export { MuiSvgIcon } from './muiSvgIcon';
 export { MuiLink } from './muiLink';
+export { MuiCard } from './muiCard';

src/assets/theme/components/muiCard.ts

@@ -0,0 +1,27 @@
+/**
+ * Copyright 2022 Bonitasoft S.A.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+import { Components, Theme } from '@mui/material';
+
+export const MuiCard: Components<Theme>['MuiCard'] = {
+  styleOverrides: {
+    root: {
+      ':hover': {
+        boxShadow: '0 12px 16px rgba(0, 0, 0, 0.2)',
+      },
+    },
+  },
+};

src/assets/theme/index.ts

@@ -46,6 +46,7 @@ import {
   MuiIcon,
   MuiSvgIcon,
   MuiLink,
+  MuiCard,
 } from './components';
 
 const generatedTheme = createTheme({
@@ -65,6 +66,7 @@ const generatedTheme = createTheme({
     MuiSvgIcon,
     MuiLink,
     MuiContainer,
+    MuiCard,
   },
 });