mirror of
https://github.com/home-assistant/frontend.git
synced 2025-07-18 23:06:40 +00:00
Picture glance: Use icon button instead of icon with button styles. (#5977)
This commit is contained in:
parent
6bb3b84377
commit
0a128db269
@ -17,7 +17,7 @@ import { computeStateDisplay } from "../../../common/entity/compute_state_displa
|
||||
import { computeStateName } from "../../../common/entity/compute_state_name";
|
||||
import { stateIcon } from "../../../common/entity/state_icon";
|
||||
import "../../../components/ha-card";
|
||||
import "../../../components/ha-icon";
|
||||
import "../../../components/ha-icon-button";
|
||||
import { ActionHandlerEvent } from "../../../data/lovelace";
|
||||
import { HomeAssistant } from "../../../types";
|
||||
import { actionHandler } from "../common/directives/action-handler-directive";
|
||||
@ -240,15 +240,16 @@ class HuiPictureGlanceCard extends LitElement implements LovelaceCard {
|
||||
|
||||
return html`
|
||||
<div class="wrapper">
|
||||
<ha-icon
|
||||
<ha-icon-button
|
||||
@action=${this._handleAction}
|
||||
.actionHandler=${actionHandler({
|
||||
hasHold: hasAction(entityConf.hold_action),
|
||||
hasDoubleClick: hasAction(entityConf.double_tap_action),
|
||||
})}
|
||||
tabindex=${ifDefined(
|
||||
hasAction(entityConf.tap_action) ? "0" : undefined
|
||||
!hasAction(entityConf.tap_action) ? "-1" : undefined
|
||||
)}
|
||||
.disabled=${!hasAction(entityConf.tap_action)}
|
||||
.config=${entityConf}
|
||||
class=${classMap({
|
||||
"state-on": !STATES_OFF.has(stateObj.state),
|
||||
@ -261,7 +262,7 @@ class HuiPictureGlanceCard extends LitElement implements LovelaceCard {
|
||||
this.hass!.language
|
||||
)}
|
||||
`}
|
||||
></ha-icon>
|
||||
></ha-icon-button>
|
||||
${this._config!.show_state !== true && entityConf.show_state !== true
|
||||
? html` <div class="state"></div> `
|
||||
: html`
|
||||
@ -326,19 +327,15 @@ class HuiPictureGlanceCard extends LitElement implements LovelaceCard {
|
||||
margin-left: 8px;
|
||||
}
|
||||
|
||||
ha-icon {
|
||||
cursor: pointer;
|
||||
ha-icon-button {
|
||||
--mdc-icon-button-size: 40px;
|
||||
--disabled-text-color: currentColor;
|
||||
color: #a9a9a9;
|
||||
}
|
||||
|
||||
ha-icon.state-on {
|
||||
ha-icon-button.state-on {
|
||||
color: white;
|
||||
}
|
||||
ha-icon:focus {
|
||||
outline: none;
|
||||
background: var(--divider-color);
|
||||
border-radius: 100%;
|
||||
}
|
||||
.state {
|
||||
display: block;
|
||||
font-size: 12px;
|
||||
|
Loading…
x
Reference in New Issue
Block a user