mirror of
https://github.com/home-assistant/frontend.git
synced 2026-02-15 07:25:54 +00:00
Change state card button/input_button to control button (#29367)
Co-authored-by: Wendelin <12148533+wendevlin@users.noreply.github.com>
This commit is contained in:
@@ -1,10 +1,10 @@
|
||||
import type { HassEntity } from "home-assistant-js-websocket";
|
||||
import type { CSSResultGroup } from "lit";
|
||||
import { html, LitElement } from "lit";
|
||||
import { css, html, LitElement } from "lit";
|
||||
import { customElement, property } from "lit/decorators";
|
||||
import "../components/entity/ha-entity-toggle";
|
||||
import "../components/entity/state-info";
|
||||
import "../components/ha-button";
|
||||
import "../components/ha-control-button";
|
||||
import { UNAVAILABLE } from "../data/entity/entity";
|
||||
import { haStyle } from "../resources/styles";
|
||||
import type { HomeAssistant } from "../types";
|
||||
@@ -26,14 +26,12 @@ class StateCardButton extends LitElement {
|
||||
.stateObj=${stateObj}
|
||||
.inDialog=${this.inDialog}
|
||||
></state-info>
|
||||
<ha-button
|
||||
appearance="plain"
|
||||
size="small"
|
||||
@click=${this._pressButton}
|
||||
<ha-control-button
|
||||
.disabled=${stateObj.state === UNAVAILABLE}
|
||||
@click=${this._pressButton}
|
||||
>
|
||||
${this.hass.localize("ui.card.button.press")}
|
||||
</ha-button>
|
||||
</ha-control-button>
|
||||
</div>
|
||||
`;
|
||||
}
|
||||
@@ -46,7 +44,18 @@ class StateCardButton extends LitElement {
|
||||
}
|
||||
|
||||
static get styles(): CSSResultGroup {
|
||||
return haStyle;
|
||||
return [
|
||||
haStyle,
|
||||
css`
|
||||
ha-control-button {
|
||||
width: auto;
|
||||
min-width: 40px;
|
||||
--control-button-padding: 0 var(--ha-space-4);
|
||||
--control-button-focus-color: var(--primary-text-color);
|
||||
--control-button-icon-color: var(--feature-color);
|
||||
}
|
||||
`,
|
||||
];
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
@@ -1,10 +1,10 @@
|
||||
import type { HassEntity } from "home-assistant-js-websocket";
|
||||
import type { CSSResultGroup } from "lit";
|
||||
import { html, LitElement } from "lit";
|
||||
import { css, html, LitElement } from "lit";
|
||||
import { customElement, property } from "lit/decorators";
|
||||
import "../components/entity/ha-entity-toggle";
|
||||
import "../components/entity/state-info";
|
||||
import "../components/ha-button";
|
||||
import "../components/ha-control-button";
|
||||
import { UNAVAILABLE } from "../data/entity/entity";
|
||||
import { haStyle } from "../resources/styles";
|
||||
import type { HomeAssistant } from "../types";
|
||||
@@ -26,13 +26,12 @@ class StateCardInputButton extends LitElement {
|
||||
.stateObj=${stateObj}
|
||||
.inDialog=${this.inDialog}
|
||||
></state-info>
|
||||
<ha-button
|
||||
appearance="plain"
|
||||
@click=${this._pressButton}
|
||||
<ha-control-button
|
||||
.disabled=${stateObj.state === UNAVAILABLE}
|
||||
@click=${this._pressButton}
|
||||
>
|
||||
${this.hass.localize("ui.card.button.press")}
|
||||
</ha-button>
|
||||
</ha-control-button>
|
||||
</div>
|
||||
`;
|
||||
}
|
||||
@@ -45,7 +44,18 @@ class StateCardInputButton extends LitElement {
|
||||
}
|
||||
|
||||
static get styles(): CSSResultGroup {
|
||||
return haStyle;
|
||||
return [
|
||||
haStyle,
|
||||
css`
|
||||
ha-control-button {
|
||||
width: auto;
|
||||
min-width: 40px;
|
||||
--control-button-padding: 0 var(--ha-space-4);
|
||||
--control-button-focus-color: var(--primary-text-color);
|
||||
--control-button-icon-color: var(--feature-color);
|
||||
}
|
||||
`,
|
||||
];
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
Reference in New Issue
Block a user