@coveord/plasma-mantine
Version:
A Plasma flavoured Mantine theme
41 lines (35 loc) • 1.14 kB
CSS
/*
`readonly` state on checkboxes is not something that exists in Mantine.
So we are allowing ourselves some custom style to achieve the desired effect
*/
.input {
@mixin light {
/* targets the default checkbox without overiding mantine's base rules */
&:not([data-indeterminate], :checked, [readonly], :disabled, [data-error='true']) {
border-color: var(--coveo-color-input-border);
}
/* mantine doesn't have a concept of readonly checkbox */
&[readonly] {
border-color: var(--mantine-color-default-border);
background-color: var(--coveo-color-bg-readonly);
color: var(--coveo-color-text-readonly);
& + .icon {
color: var(--coveo-color-text-readonly);
}
}
&:disabled {
border-color: var(--mantine-color-default-border);
}
}
}
.labelWrapper {
@mixin light {
&[data-disabled] {
.label,
.description {
color: var(--mantine-color-disabled-color);
}
}
}
--label-offset-start: 8px;
}