diff --git a/src/qqq/components/widgets/tables/cells/DataTableBodyCell.tsx b/src/qqq/components/widgets/tables/cells/DataTableBodyCell.tsx
index abc8773..46c2ad1 100644
--- a/src/qqq/components/widgets/tables/cells/DataTableBodyCell.tsx
+++ b/src/qqq/components/widgets/tables/cells/DataTableBodyCell.tsx
@@ -22,6 +22,7 @@
import Box from "@mui/material/Box";
import {Theme} from "@mui/material/styles";
import {ReactNode} from "react";
+import colors from "qqq/assets/theme/base/colors";
// Declaring prop types for DataTableBodyCell
interface Props
@@ -40,14 +41,26 @@ function DataTableBodyCell({noBorder, align, children}: Props): JSX.Element
py={1.5}
px={3}
sx={({palette: {light}, typography: {size}, borders: {borderWidth}}: Theme) => ({
- fontSize: size.sm,
- borderBottom: noBorder ? "none" : `${borderWidth[1]} solid ${light.main}`,
+ borderBottom: noBorder ? "none" : `${borderWidth[1]} solid ${colors.grayLines.main}`,
+ fontSize: "0.875rem",
+ "@media (min-width: 1440px)": {
+ fontSize: "1rem"
+ },
+ "@media (max-width: 1440px)": {
+ fontSize: "0.875rem"
+ },
+ "&:nth-child(1)": {
+ paddingLeft: "1rem"
+ },
+ "&:last-child": {
+ paddingRight: "1rem"
+ }
})}
>
{children}
diff --git a/src/qqq/components/widgets/tables/cells/DataTableHeadCell.tsx b/src/qqq/components/widgets/tables/cells/DataTableHeadCell.tsx
index b0fade0..20583f0 100644
--- a/src/qqq/components/widgets/tables/cells/DataTableHeadCell.tsx
+++ b/src/qqq/components/widgets/tables/cells/DataTableHeadCell.tsx
@@ -23,6 +23,7 @@ import Box from "@mui/material/Box";
import Icon from "@mui/material/Icon";
import {Theme} from "@mui/material/styles";
import {ReactNode} from "react";
+import colors from "qqq/assets/theme/base/colors";
import {useMaterialUIController} from "qqq/context";
// Declaring props types for DataTableHeadCell
@@ -46,18 +47,28 @@ function DataTableHeadCell({width, children, sorted, align, ...rest}: Props): JS
py={1.5}
px={3}
sx={({palette: {light}, borders: {borderWidth}}: Theme) => ({
- borderBottom: `${borderWidth[1]} solid ${light.main}`,
+ borderBottom: `${borderWidth[1]} solid ${colors.grayLines.main}`,
+ "&:nth-child(1)": {
+ paddingLeft: "1rem"
+ },
+ "&:last-child": {
+ paddingRight: "1rem"
+ },
})}
>
({
position: "relative",
- opacity: "0.7",
+ color: colors.grey[700],
textAlign: align,
- fontSize: size.xxs,
- fontWeight: fontWeightBold,
- textTransform: "uppercase",
+ "@media (min-width: 1440px)": {
+ fontSize: "1rem"
+ },
+ "@media (max-width: 1440px)": {
+ fontSize: "0.875rem"
+ },
+ fontWeight: 600,
cursor: sorted && "pointer",
userSelect: sorted && "none",
})}
diff --git a/src/qqq/components/widgets/tables/cells/DefaultCell.tsx b/src/qqq/components/widgets/tables/cells/DefaultCell.tsx
index 7370699..e5355e0 100644
--- a/src/qqq/components/widgets/tables/cells/DefaultCell.tsx
+++ b/src/qqq/components/widgets/tables/cells/DefaultCell.tsx
@@ -14,12 +14,24 @@ Coded by www.creative-tim.com
*/
import {ReactNode} from "react";
+import colors from "qqq/assets/theme/base/colors";
import MDTypography from "qqq/components/legacy/MDTypography";
function DefaultCell({children}: { children: ReactNode }): JSX.Element
{
return (
-
+
{children}
);