kwikid-components-react
Version:
KwikID's Component Library in React
260 lines (259 loc) • 7.26 kB
JavaScript
;
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.default = void 0;
var _styles = require("@material-ui/core/styles");
const tableTheme = (0, _styles.createTheme)({
typography: {
h6: {
fontFamily: "Manrope, Open Sans, sans-serif",
marginBottom: "0.5rem",
fontWeight: 600,
lineHeight: 1.5,
color: "#32325d",
textAlign: "left",
fontSize: "0.9375rem"
},
body2: {
fontFamily: "Manrope, Open Sans, sans-serif"
},
subtitle1: {
fontFamily: "Manrope, Open Sans, sans-serif"
}
},
overrides: {
MuiAppBar: {
root: {
"& .MuiTypography-root": {
color: "white"
}
}
},
MUIDataTable: {
root: {
height: "100%",
fontFamily: "Manrope, Open Sans, sans-serif !important",
border: "0.0625rem solid #e0e0e0" // Light border for the table
},
responsiveScroll: {
maxHeight: "100% !important"
},
liveAnnounce: {
display: "none !important"
}
},
MUIDataTableBodyCell: {
root: {
fontSize: "0.875rem",
// Readable font size
// borderRight: "0.0625rem solid #e0e0e0", // Light border for cells
padding: "0rem",
// Reduced padding for compactness
lineHeight: "1.25rem",
// Slightly reduced line height
minWidth: "4rem",
// Minimum width to ensure cells don't collapse too much
whiteSpace: "nowrap",
// Prevent wrapping by default
overflow: "hidden",
// Hide overflowing content
textOverflow: "ellipsis",
// Add ellipsis for overflowing content
"&:first-child": {
borderLeft: "0.0625rem solid #e0e0e0"
}
}
},
MUIDataTableFilter: {
gridListTile: {
margin: "0rem !important",
padding: "0.5rem 0.75rem !important"
}
},
MUIDataTableHeadCell: {
root: {
fontSize: "0.875rem",
// Readable font size
// borderRight: "0.0625rem solid #e0e0e0", // Light border for cells
padding: "0rem",
// Reduced padding for compactness
lineHeight: "1.25rem",
// Slightly reduced line height
minWidth: "4rem",
// Minimum width to ensure cells don't collapse too much
whiteSpace: "nowrap",
// Prevent wrapping by default
overflow: "hidden",
// Hide overflowing content
textOverflow: "ellipsis",
// Add ellipsis for overflowing content
"&:first-child": {
borderLeft: "0.0625rem solid #e0e0e0"
},
// Ensures the adjacent sibling with the .datatables-noprint class doesn't have a left border
"& + .datatables-noprint": {
borderLeft: "none !important"
}
},
fixedHeader: {
padding: "0rem"
// borderRight: "0.0625rem solid #e0e0e0 !important"
},
sortAction: {
alignItems: "center"
},
toolButton: {
fontFamily: "Manrope, Open Sans, sans-serif",
fontWeight: "bold !important",
padding: "0.5rem !important",
margin: "-0.5rem !important"
}
},
MUIDataTableSelectCell: {
fixedHeaderCommon: {
zIndex: 98,
padding: "0.5rem",
// Reduced padding,
// borderRight: "0.0625rem solid #e0e0e0", // Thicker border for fixed cells
"&:first-child": {
borderLeft: "0.0625rem solid #e0e0e0"
}
},
checkboxRoot: {
margin: "auto",
padding: "0rem"
},
fixedLeft: {
padding: "0.5rem",
background: "white !important",
// borderRight: "0.0625rem solid #e0e0e0 !important",
borderCollapse: "separate",
outline: "0.5px solid rgba(224, 224, 224, 1)"
},
paddingCheckbox: {
width: "48px",
padding: "1rem !important",
background: "white !important",
// borderRight: "0.0625rem solid #e0e0e0 !important",
borderCollapse: "separate",
boxShadow: "0px 0px 10px #e0e0e0 !important",
outline: "0.5px solid #e0e0e0 !important"
}
},
MUIDataTableToolbar: {
actions: {
display: "flex",
alignItems: "center",
flexDirection: "row",
justifyContent: "flex-end"
}
},
MUIDataTableToolbarSelect: {
root: {
display: "flex",
zIndex: "100000 !important",
position: "relative",
padding: "0.5rem",
// Reduced padding for compactness
flexDirection: "row",
justifyContent: "space-between",
alignItems: "center",
flex: "none"
}
},
MuiInputBase: {
root: {
fontFamily: "Manrope, Open Sans, sans-serif"
}
},
MuiList: {
root: {
zIndex: "99999999999999999 !important"
}
},
MuiPaper: {
root: {
display: "flex",
flexDirection: "column",
alignItems: "stretch",
justifyContent: "flex-start",
overflow: "auto",
border: "none",
// No additional border
boxShadow: "rgba(99, 99, 99, 0.2) 0px 2px 8px 0px" // Shadow for elevation
},
elevation4: {
width: "100%",
boxShadow: "none",
flex: 1,
height: "100%"
},
rounded: {
borderRadius: "0.35rem" // Square corners for a cleaner look
}
},
MuiPopover: {
root: {
zIndex: "100000 !important",
maxWidth: "calc(100vw - 1rem)",
width: "auto",
margin: "0 !important",
"@media (max-width:600px)": {
width: "calc(100% - 1rem)"
}
}
},
MuiTab: {
root: {
fontFamily: "Manrope, Open Sans, sans-serif"
}
},
MuiTableCell: {
head: {
fontSize: "0.875rem !important",
// Readable font size for headers
color: "#333",
fontWeight: 600,
lineHeight: "1.25rem",
// Adjusted line height
borderBottom: "0.0625rem solid #e0e0e0",
// Thicker border for header cells
backgroundColor: "#f5f5f5" // Light grey background for headers
},
root: {
fontFamily: "Manrope, Open Sans, sans-serif",
padding: "1rem !important" // important else get's overwritten by MuiDataTableBodyCell.root
// borderRight: "0.0625rem solid #e0e0e0" // Light border for cells
},
footer: {
borderBottom: "none"
}
},
MuiTableFooter: {
root: {
borderTop: "0.0625rem solid #e0e0e0"
}
},
MuiTableHead: {
root: {
"& th": {
backgroundColor: "#f5f5f5",
verticalAlign: "middle",
color: "#333",
padding: "1rem !important",
fontSize: "0.875rem",
textTransform: "none",
letterSpacing: "0",
// borderRight: "0.0625rem solid #e0e0e0", // Border to match header cells
borderTop: "0.0625rem solid #e0e0e0",
// Border to match header cells
"&:first-child": {
borderLeft: "0.0625rem solid #e0e0e0"
}
}
}
}
}
});
var _default = exports.default = tableTheme;