sixseconds-modules 1.6.173 → 1.6.175

package/dist/index.es.js

@@ -17,7 +17,7 @@ import React__default, { useRef, useEffect, useState, useCallback, useMemo, useL
 import axios from "axios";
 import Cookies from "js-cookie";
 import { CacheProvider } from "@emotion/react";
-import { Box, Typography, ThemeProvider, createTheme, unstable_ClassNameGenerator, Dialog, Stack as Stack$1, Button as Button$1, IconButton, Grid, Avatar, Chip, Link, Divider, ClickAwayListener, useMediaQuery, MenuItem, AppBar, Container, Badge, FormLabel, TextField, InputAdornment, styled as styled$1 } from "@mui/material";
+import { Box, Typography, ThemeProvider, createTheme, Dialog, Stack as Stack$1, Button as Button$1, IconButton, Grid, Avatar, Chip, Link, Divider, ClickAwayListener, useMediaQuery, MenuItem, AppBar, Container, Badge, FormLabel, TextField, InputAdornment, styled as styled$1 } from "@mui/material";
 import MenuIcon from "@mui/icons-material/Menu";
 import CloseIcon from "@mui/icons-material/Close";
 import toast from "react-hot-toast";
@@ -13649,7 +13649,6 @@ const isolatedTheme = createTheme({
     fontFamily: "'IBM Plex Sans', sans-serif"
   }
 });
-unstable_ClassNameGenerator.configure((componentName) => `sixseconds-modules-${componentName}`);
 function createEmotionCache() {
   if (typeof document === "undefined") {
     return createCache({ key: "sixseconds", prepend: true });
@@ -14519,31 +14518,37 @@ const AppMenus = ({ menuItems, setInitialState, t: t2, appName, router }) => {
       onClick: () => handleRedirection2(appName, item.link, item.type),
       item: true,
       md: 4,
-      xs: 6,
+      sm: 4,
+      xs: 4,
       sx: { cursor: "pointer", textDecoration: "none" },
       children: /* @__PURE__ */ jsxs(
         Box,
         {
           className: "sixseconds-header-dashboard-boxes",
           sx: {
+            display: "flex",
+            flexDirection: "column",
+            justifyContent: "flex-start",
+            alignItems: "center",
             textAlign: "center",
-            p: 2,
+            p: { xs: 1, md: 2 },
+            height: "100%",
             borderRadius: "12px",
             transition: "all 0.2s",
             "&:hover": {
               background: "#f8f9fa",
-              "& .MuiTypography-root": {
+              "& .sixseconds-header-menu-text": {
                 color: "#0073b1"
               }
             }
           },
           children: [
-            /* @__PURE__ */ jsx(Box, { sx: { mb: 1.5 }, children: /* @__PURE__ */ jsx(
+            /* @__PURE__ */ jsx(Box, { sx: { mb: 1, display: "flex", alignItems: "center", justifyContent: "center" }, children: /* @__PURE__ */ jsx(
               "img",
               {
                 width: 38,
                 height: 38,
-                style: { margin: "0 auto", display: "block" },
+                style: { margin: "0 auto", display: "block", objectFit: "contain" },
                 src: item.icon,
                 alt: item.name
               }
@@ -14551,11 +14556,13 @@ const AppMenus = ({ menuItems, setInitialState, t: t2, appName, router }) => {
             /* @__PURE__ */ jsx(
               Typography,
               {
+                className: "sixseconds-header-menu-text",
                 sx: {
-                  fontSize: "13px",
+                  fontSize: { xs: "12px", md: "13px" },
                   color: "#1a1c1e",
                   fontWeight: 500,
-                  lineHeight: 1.2
+                  lineHeight: 1.2,
+                  wordBreak: "break-word"
                 },
                 children: t2(item.name)
               }