mirror of
https://github.com/home-assistant/frontend.git
synced 2025-11-05 00:49:53 +00:00
Make data table and checkbox themeable (#3712)
Added rgb vars, not sure we want to go that way, but otherwise we will get a lot of styles...
This commit is contained in:
committed by
Paulus Schoutsen
parent
a2c2f6a1e2
commit
4bb65b8ae1
@@ -1,7 +1,8 @@
|
||||
import { Constructor, customElement } from "lit-element";
|
||||
import { Constructor, customElement, CSSResult, css } from "lit-element";
|
||||
import "@material/mwc-checkbox";
|
||||
// tslint:disable-next-line
|
||||
import { Checkbox } from "@material/mwc-checkbox";
|
||||
import { style } from "@material/mwc-checkbox/mwc-checkbox-css";
|
||||
// tslint:disable-next-line
|
||||
const MwcCheckbox = customElements.get("mwc-checkbox") as Constructor<Checkbox>;
|
||||
|
||||
@@ -11,6 +12,18 @@ export class HaCheckbox extends MwcCheckbox {
|
||||
super.firstUpdated();
|
||||
this.style.setProperty("--mdc-theme-secondary", "var(--primary-color)");
|
||||
}
|
||||
|
||||
protected static get styles(): CSSResult[] {
|
||||
return [
|
||||
style,
|
||||
css`
|
||||
.mdc-checkbox__native-control:enabled:not(:checked):not(:indeterminate)
|
||||
~ .mdc-checkbox__background {
|
||||
border-color: rgba(var(--rgb-primary-text-color), 0.54);
|
||||
}
|
||||
`,
|
||||
];
|
||||
}
|
||||
}
|
||||
|
||||
declare global {
|
||||
|
||||
Reference in New Issue
Block a user