@coveord/plasma-mantine
Version:
A Plasma flavoured Mantine theme
65 lines (52 loc) • 1.69 kB
CSS
.headerRow {
&[data-selectable='false'] input[type='checkbox'] {
background-color: var(--mantine-color-gray-light);
border-color: var(--mantine-color-default-border);
pointer-events: none;
cursor: not-allowed;
& + svg {
color: var(--mantine-color-dimmed);
}
}
}
.row {
overflow-wrap: anywhere;
& td:first-of-type {
padding-left: 40px;
}
@mixin hover {
background-color: var(--mantine-color-gray-light-hover);
}
&[data-selectable='false'] input[type='checkbox'] {
background-color: var(--mantine-color-gray-light);
border-color: var(--mantine-color-default-border);
pointer-events: none;
cursor: not-allowed;
&:checked + svg {
color: var(--mantine-color-dimmed);
}
}
&[data-selected='true'] {
&[data-multi-selection='false'] {
background-color: var(--mantine-color-gray-light-hover);
}
&[data-multi-selection='true'] {
background-color: transparent;
}
}
&[data-collapsible-cell='true'] {
text-align: right;
padding: calc(var(--mantine-spacing-xs) / 2) var(--mantine-spacing-sm) ;
}
}
.cell {
vertical-align: middle;
/* We must use height instead of minHeight here, otherwise it doesn’t apply */
height: 56px;
padding: var(--mantine-spacing-xs) var(--mantine-spacing-sm);
border-bottom: rem(1) solid var(--mantine-color-default-border);
}
.collapsibleWrapper {
border-bottom: rem(1) solid var(--mantine-color-default-border);
background-color: var(--mantine-color-gray-light);
}