mirror of
https://github.com/home-assistant/frontend.git
synced 2025-07-23 17:26:42 +00:00
Add a couple of labels (#3310)
* Add a couple of labels * Add some more labels
This commit is contained in:
parent
e804e62e66
commit
3becefaf8b
@ -188,6 +188,7 @@ class HaMediaPlayerCard extends LocalizeMixin(EventsMixin(PolymerElement)) {
|
||||
|
||||
<div class="controls layout horizontal justified">
|
||||
<paper-icon-button
|
||||
aria-label="Turn off"
|
||||
icon="hass:power"
|
||||
on-click="handleTogglePower"
|
||||
invisible$="[[computeHidePowerButton(playerObj)]]"
|
||||
@ -196,12 +197,14 @@ class HaMediaPlayerCard extends LocalizeMixin(EventsMixin(PolymerElement)) {
|
||||
|
||||
<div class="playback-controls">
|
||||
<paper-icon-button
|
||||
aria-label="Previous track"
|
||||
icon="hass:skip-previous"
|
||||
invisible$="[[!playerObj.supportsPreviousTrack]]"
|
||||
disabled="[[playerObj.isOff]]"
|
||||
on-click="handlePrevious"
|
||||
></paper-icon-button>
|
||||
<paper-icon-button
|
||||
aria-label="Play or Pause"
|
||||
class="primary"
|
||||
icon="[[computePlaybackControlIcon(playerObj)]]"
|
||||
invisible$="[[!computePlaybackControlIcon(playerObj)]]"
|
||||
@ -209,6 +212,7 @@ class HaMediaPlayerCard extends LocalizeMixin(EventsMixin(PolymerElement)) {
|
||||
on-click="handlePlaybackControl"
|
||||
></paper-icon-button>
|
||||
<paper-icon-button
|
||||
aria-label="Next track"
|
||||
icon="hass:skip-next"
|
||||
invisible$="[[!playerObj.supportsNextTrack]]"
|
||||
disabled="[[playerObj.isOff]]"
|
||||
@ -217,6 +221,7 @@ class HaMediaPlayerCard extends LocalizeMixin(EventsMixin(PolymerElement)) {
|
||||
</div>
|
||||
|
||||
<paper-icon-button
|
||||
aria-label="More information."
|
||||
icon="hass:dots-vertical"
|
||||
on-click="handleOpenMoreInfo"
|
||||
class="self-center secondary"
|
||||
|
@ -15,6 +15,7 @@ import {
|
||||
import { HomeAssistant } from "../../types";
|
||||
import { HassEntity } from "home-assistant-js-websocket";
|
||||
import { forwardHaptic } from "../../data/haptics";
|
||||
import computeStateName from "../../common/entity/compute_state_name";
|
||||
|
||||
const isOn = (stateObj?: HassEntity) =>
|
||||
stateObj !== undefined && !STATES_OFF.includes(stateObj.state);
|
||||
@ -35,11 +36,13 @@ class HaEntityToggle extends LitElement {
|
||||
if (this.stateObj.attributes.assumed_state) {
|
||||
return html`
|
||||
<paper-icon-button
|
||||
aria-label=${`Turn ${computeStateName(this.stateObj)} off`}
|
||||
icon="hass:flash-off"
|
||||
@click=${this._turnOff}
|
||||
?state-active=${!this._isOn}
|
||||
></paper-icon-button>
|
||||
<paper-icon-button
|
||||
aria-label=${`Turn ${computeStateName(this.stateObj)} on`}
|
||||
icon="hass:flash"
|
||||
@click=${this._turnOn}
|
||||
?state-active=${this._isOn}
|
||||
@ -49,6 +52,9 @@ class HaEntityToggle extends LitElement {
|
||||
|
||||
return html`
|
||||
<paper-toggle-button
|
||||
aria-label=${`Toggle ${computeStateName(this.stateObj)} ${
|
||||
this._isOn ? "off" : "on"
|
||||
}`}
|
||||
.checked=${this._isOn}
|
||||
@change=${this._toggleChanged}
|
||||
></paper-toggle-button>
|
||||
|
@ -55,7 +55,9 @@ class HaCameraStream extends LitElement {
|
||||
.src=${__DEMO__
|
||||
? `/api/camera_proxy_stream/${this.stateObj.entity_id}`
|
||||
: computeMJPEGStreamUrl(this.stateObj)}
|
||||
.alt=${computeStateName(this.stateObj)}
|
||||
.alt=${`Preview of the ${computeStateName(
|
||||
this.stateObj
|
||||
)} camera.`}
|
||||
/>
|
||||
`
|
||||
: html`
|
||||
|
@ -68,6 +68,7 @@ const computePanels = (hass: HomeAssistant) => {
|
||||
|
||||
const renderPanel = (hass, panel) => html`
|
||||
<a
|
||||
aria-role="option"
|
||||
href="${computeUrl(panel.url_path)}"
|
||||
data-panel="${panel.url_path}"
|
||||
tabindex="-1"
|
||||
@ -115,12 +116,17 @@ class HaSidebar extends LitElement {
|
||||
`
|
||||
: html`
|
||||
<div class="logo">
|
||||
<img id="logo" src="/static/icons/favicon-192x192.png" />
|
||||
<img
|
||||
id="logo"
|
||||
src="/static/icons/favicon-192x192.png"
|
||||
alt="Home Assistant logo"
|
||||
/>
|
||||
</div>
|
||||
`}
|
||||
|
||||
<paper-listbox attr-for-selected="data-panel" .selected=${hass.panelUrl}>
|
||||
<a
|
||||
aria-role="option"
|
||||
href="${computeUrl(this._defaultPage)}"
|
||||
data-panel=${this._defaultPage}
|
||||
tabindex="-1"
|
||||
@ -197,6 +203,7 @@ class HaSidebar extends LitElement {
|
||||
${this._externalConfig && this._externalConfig.hasSettingsScreen
|
||||
? html`
|
||||
<a
|
||||
aria-role="option"
|
||||
aria-label="App Configuration"
|
||||
href="#external-app-configuration"
|
||||
tabindex="-1"
|
||||
@ -219,7 +226,13 @@ class HaSidebar extends LitElement {
|
||||
${configPanel ? renderPanel(hass, configPanel) : ""}
|
||||
${hass.user
|
||||
? html`
|
||||
<a href="/profile" data-panel="panel" tabindex="-1">
|
||||
<a
|
||||
href="/profile"
|
||||
data-panel="panel"
|
||||
tabindex="-1"
|
||||
aria-role="option"
|
||||
aria-label=${hass.localize("panel.profile")}
|
||||
>
|
||||
<paper-icon-item class="profile">
|
||||
<ha-user-badge
|
||||
slot="item-icon"
|
||||
@ -233,7 +246,11 @@ class HaSidebar extends LitElement {
|
||||
</a>
|
||||
`
|
||||
: html`
|
||||
<paper-icon-item @click=${this._handleLogOut} class="logout">
|
||||
<paper-icon-item
|
||||
@click=${this._handleLogOut}
|
||||
class="logout"
|
||||
aria-role="option"
|
||||
>
|
||||
<ha-icon slot="item-icon" icon="hass:exit-to-app"></ha-icon>
|
||||
<span class="item-text"
|
||||
>${hass.localize("ui.sidebar.log_out")}</span
|
||||
|
@ -14,6 +14,7 @@ class HaStartVoiceButton extends EventsMixin(PolymerElement) {
|
||||
static get template() {
|
||||
return html`
|
||||
<paper-icon-button
|
||||
aria-label="Start conversation"
|
||||
icon="hass:microphone"
|
||||
hidden$="[[!canListen]]"
|
||||
on-click="handleListenClick"
|
||||
|
@ -64,9 +64,14 @@ class HaPanelDevInfo extends LitElement {
|
||||
<div class="content">
|
||||
<div class="about">
|
||||
<p class="version">
|
||||
<a href="https://www.home-assistant.io" target="_blank"
|
||||
><img src="/static/icons/favicon-192x192.png" height="192"/></a
|
||||
><br />
|
||||
<a href="https://www.home-assistant.io" target="_blank">
|
||||
<img
|
||||
src="/static/icons/favicon-192x192.png"
|
||||
height="192"
|
||||
alt="Home Assistant logo"
|
||||
/>
|
||||
</a>
|
||||
<br />
|
||||
Home Assistant<br />
|
||||
${hass.config.version}
|
||||
</p>
|
||||
|
@ -41,6 +41,7 @@ class HuiEntitiesToggle extends LitElement {
|
||||
|
||||
return html`
|
||||
<paper-toggle-button
|
||||
aria-label="Toggle entities."
|
||||
?checked="${this._toggleEntities!.some((entityId) => {
|
||||
const stateObj = this.hass!.states[entityId];
|
||||
return stateObj && stateObj.state === "on";
|
||||
|
@ -23,6 +23,7 @@ class HuiNotificationsButton extends LitElement {
|
||||
protected render(): TemplateResult | void {
|
||||
return html`
|
||||
<paper-icon-button
|
||||
aria-label="Show Notifications"
|
||||
icon="hass:bell"
|
||||
@click="${this._clicked}"
|
||||
></paper-icon-button>
|
||||
|
@ -144,6 +144,7 @@ class HUIRoot extends LitElement {
|
||||
horizontal-offset="-5"
|
||||
>
|
||||
<paper-icon-button
|
||||
aria-label="Open Lovelace menu"
|
||||
icon="hass:dots-vertical"
|
||||
slot="dropdown-trigger"
|
||||
></paper-icon-button>
|
||||
|
Loading…
x
Reference in New Issue
Block a user