jeans/frontend
jeans/frontend
1
0
Fork 0
mirror of https://github.com/home-assistant/frontend.git synced 2025-07-23 17:26:42 +00:00
Code Issues Packages Projects Releases Wiki Activity

Fix areas devices picker (#7652)

Browse Source
This commit is contained in:
Bram Kragten 2020-11-11 14:59:26 +01:00 committed by GitHub
parent bae29c6d62
commit 67814505b3
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
1 changed files with 33 additions and 31 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

44
src/components/device/ha-area-devices-picker.ts
View File

@ -1,5 +1,5 @@
import "@material/mwc-icon-button/mwc-icon-button";
import "@material/mwc-button/mwc-button"; import "@material/mwc-button/mwc-button";
import "../ha-icon-button";
import "@polymer/paper-input/paper-input"; import "@polymer/paper-input/paper-input";
import "@polymer/paper-item/paper-item"; import "@polymer/paper-item/paper-item";
import "@polymer/paper-item/paper-item-body"; import "@polymer/paper-item/paper-item-body";
@ -38,6 +38,8 @@ import { SubscribeMixin } from "../../mixins/subscribe-mixin";
import { PolymerChangedEvent } from "../../polymer-types"; import { PolymerChangedEvent } from "../../polymer-types";
import { HomeAssistant } from "../../types"; import { HomeAssistant } from "../../types";
import "./ha-devices-picker"; import "./ha-devices-picker";
import "../ha-svg-icon";
import { mdiClose, mdiMenuDown, mdiMenuUp } from "@mdi/js";
interface DevicesByArea { interface DevicesByArea {
[areaId: string]: AreaDevices; [areaId: string]: AreaDevices;
@ -62,7 +64,7 @@ const rowRenderer = (
margin: -10px 0; margin: -10px 0;
padding: 0; padding: 0;
} }
ha-icon-button { mwc-icon-button {
float: right; float: right;
} }
.devices { .devices {
@ -324,36 +326,34 @@ export class HaAreaDevicesPicker extends SubscribeMixin(LitElement) {
autocorrect="off" autocorrect="off"
spellcheck="false" spellcheck="false"
> >
<div class="suffix" slot="suffix">
${this.value ${this.value
? html` ? html`<mwc-icon-button
<ha-icon-button class="clear-button"
aria-label=${this.hass.localize( .label=${this.hass.localize(
"ui.components.device-picker.clear" "ui.components.device-picker.clear"
)} )}
slot="suffix"
class="clear-button"
icon="hass:close"
@click=${this._clearValue} @click=${this._clearValue}
no-ripple no-ripple
> >
Clear <ha-svg-icon .path=${mdiClose}></ha-svg-icon>
</ha-icon-button> </mwc-icon-button> `
`
: ""} : ""}
${areas.length > 0 ${areas.length > 0
? html` ? html`
<ha-icon-button <mwc-icon-button
aria-label=${this.hass.localize( .label=${this.hass.localize(
"ui.components.device-picker.show_devices" "ui.components.device-picker.show_devices"
)} )}
slot="suffix"
class="toggle-button" class="toggle-button"
.icon=${this._opened ? "hass:menu-up" : "hass:menu-down"}
> >
Toggle <ha-svg-icon
</ha-icon-button> .path=${this._opened ? mdiMenuUp : mdiMenuDown}
></ha-svg-icon>
</mwc-icon-button>
` `
: ""} : ""}
</div>
</paper-input> </paper-input>
</vaadin-combo-box-light> </vaadin-combo-box-light>
<mwc-button @click=${this._switchPicker} <mwc-button @click=${this._switchPicker}
@ -409,10 +409,12 @@ export class HaAreaDevicesPicker extends SubscribeMixin(LitElement) {
static get styles(): CSSResult { static get styles(): CSSResult {
return css` return css`
paper-input > ha-icon-button { .suffix {
width: 24px; display: flex;
height: 24px; }
padding: 2px; mwc-icon-button {
--mdc-icon-button-size: 24px;
padding: 0px 2px;
color: var(--secondary-text-color); color: var(--secondary-text-color);
} }
[hidden] { [hidden] {