sogo/UI/WebServerResources/scss/components/checkbox/checkbox-theme.scss

74 lines
1.3 KiB
SCSS

md-checkbox.md-THEME_NAME-theme {
.md-ripple {
color: '{{accent-600}}';
}
&.md-checked .md-ripple {
color: '{{background-600}}';
}
.md-icon {
border-color: '{{foreground-2}}';
}
&.md-checked .md-icon {
background-color: '{{accent-color-0.87}}';
}
&.md-checked .md-icon:after {
border-color: '{{background-200}}';
}
&:not([disabled]) {
&.md-primary {
.md-ripple {
color: '{{primary-600}}';
}
&.md-checked .md-ripple {
color: '{{background-600}}';
}
.md-icon {
border-color: '{{foreground-2}}';
}
&.md-checked .md-icon {
background-color: '{{primary-color-0.87}}';
}
&.md-checked .md-icon:after {
border-color: '{{background-200}}';
}
}
&.md-warn {
.md-ripple {
color: '{{warn-600}}';
}
&.md-checked .md-ripple {
color: '{{background-600}}';
}
.md-icon {
border-color: '{{foreground-2}}';
}
&.md-checked .md-icon {
background-color: '{{warn-color-0.87}}';
}
&.md-checked .md-icon:after {
border-color: '{{background-200}}';
}
}
}
&[disabled] {
.md-icon {
border-color: '{{foreground-3}}';
}
&.md-checked .md-icon {
background-color: '{{foreground-3}}';
}
}
}