mirror of
https://github.com/rowyio/rowy.git
synced 2025-12-29 00:16:39 +01:00
49 lines
1.2 KiB
TypeScript
49 lines
1.2 KiB
TypeScript
import { styled } from "@mui/material";
|
|
import { colord } from "colord";
|
|
|
|
export const StyledTable = styled("div")(({ theme }) => ({
|
|
"--cell-background-color":
|
|
theme.palette.mode === "light"
|
|
? theme.palette.background.paper
|
|
: colord(theme.palette.background.paper)
|
|
.mix("#fff", 0.04)
|
|
.alpha(1)
|
|
.toHslString(),
|
|
"--row-hover-background-color": colord(theme.palette.background.paper)
|
|
.mix(theme.palette.action.hover, theme.palette.action.hoverOpacity)
|
|
.alpha(1)
|
|
.toHslString(),
|
|
|
|
...(theme.typography.caption as any),
|
|
lineHeight: "inherit !important",
|
|
|
|
"& [role='columnheader'], & [role='gridcell']": {
|
|
"&[aria-selected='true']": {
|
|
outline: `2px solid ${theme.palette.primary.main}`,
|
|
outlineOffset: "-2px",
|
|
},
|
|
"&:focus": {
|
|
outlineWidth: "3px",
|
|
outlineOffset: "-3px",
|
|
},
|
|
},
|
|
|
|
"& [data-frozen='left']": {
|
|
position: "sticky",
|
|
left: 0,
|
|
zIndex: 2,
|
|
|
|
"&[data-frozen-last='true']": {
|
|
boxShadow: theme.shadows[2]
|
|
.replace(/, 0 (\d+px)/g, ", $1 0")
|
|
.split("),")
|
|
.slice(1)
|
|
.join("),"),
|
|
clipPath: "inset(0 -4px 0 0)",
|
|
},
|
|
},
|
|
}));
|
|
StyledTable.displayName = "StyledTable";
|
|
|
|
export default StyledTable;
|