diff --git a/src/components/menu.ts b/src/components/menu.ts index 17e0e374..40c890c0 100644 --- a/src/components/menu.ts +++ b/src/components/menu.ts @@ -1,6 +1,13 @@ import { HassEntity } from 'home-assistant-js-websocket'; import { HomeAssistant, hasAction, stateIcon } from 'custom-card-helpers'; -import { CSSResultGroup, LitElement, TemplateResult, html, unsafeCSS, PropertyValues } from 'lit'; +import { + CSSResultGroup, + LitElement, + TemplateResult, + html, + unsafeCSS, + PropertyValues, +} from 'lit'; import { customElement, property } from 'lit/decorators.js'; import { classMap } from 'lit/directives/class-map.js'; import { styleMap } from 'lit/directives/style-map.js'; @@ -60,7 +67,7 @@ export class FrigateCardMenu extends LitElement { } // Extract the entities the menu rendering depends on (if any). - const entities: string[] = [] + const entities: string[] = []; for (let i = 0; i < this.buttons.length; i++) { const button = this.buttons[i]; if (button.type == 'custom:frigate-card-menu-state-icon') { @@ -101,17 +108,24 @@ export class FrigateCardMenu extends LitElement { emphasize: emphasize, }; + // TODO: Upon a safe distance from the release of HA 2021.11 these + // attributes can be removed from the . + // - icon (replaced with the embedded ) + // - title (replaced with .label) return html` this._callAction(ev, button)} .actionHandler=${actionHandler({ hasHold: hasHold, hasDoubleClick: hasDoubleClick, })} - >`; + > + + `; } // Render the Frigate menu button. diff --git a/src/scss/button.scss b/src/scss/button.scss index 9c4746a3..164f4824 100644 --- a/src/scss/button.scss +++ b/src/scss/button.scss @@ -7,6 +7,7 @@ ha-icon-button.button { padding: 0px; margin: 3px; --mdc-icon-button-size: 40px; + --ha-icon-display: block; /* Buttons can always be clicked */ pointer-events: auto; }