jeans/frontend
jeans/frontend
1
0
Fork 0
mirror of https://github.com/home-assistant/frontend.git synced 2025-07-21 08:16:36 +00:00
Code Issues Packages Projects Releases Wiki Activity

Use mwc-tabs in conditional card editor (#7716)

Browse Source
This commit is contained in:
Thomas Lovén 2020-11-19 23:06:06 +01:00 committed by GitHub
parent 0c197558a1
commit ff9840c8ef
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
1 changed files with 18 additions and 19 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

37
src/panels/lovelace/editor/config-elements/hui-conditional-card-editor.ts
View File

@ -1,5 +1,6 @@
import "@polymer/paper-tabs"; import "@material/mwc-tab-bar/mwc-tab-bar";
import "@polymer/paper-tabs/paper-tab"; import "@material/mwc-tab/mwc-tab";
import type { MDCTabBarActivatedEvent } from "@material/tab-bar";
import { import {
css, css,
CSSResultArray, CSSResultArray,
@ -70,21 +71,21 @@ export class HuiConditionalCardEditor extends LitElement
} }
return html` return html`
<paper-tabs <mwc-tab-bar
.selected=${this._cardTab ? "1" : "0"} .activeIndex=${this._cardTab ? 1 : 0}
@iron-select=${this._selectTab} @MDCTabBar:activated=${this._selectTab}
> >
<paper-tab <mwc-tab
>${this.hass!.localize( .label=${this.hass!.localize(
"ui.panel.lovelace.editor.card.conditional.conditions" "ui.panel.lovelace.editor.card.conditional.conditions"
)}</paper-tab )}
> ></mwc-tab>
<paper-tab <mwc-tab
>${this.hass!.localize( .label=${this.hass!.localize(
"ui.panel.lovelace.editor.card.conditional.card" "ui.panel.lovelace.editor.card.conditional.card"
)}</paper-tab )}
> ></mwc-tab>
</paper-tabs> </mwc-tab-bar>
${this._cardTab ${this._cardTab
? html` ? html`
<div class="card"> <div class="card">
@ -192,8 +193,8 @@ export class HuiConditionalCardEditor extends LitElement
`; `;
} }
private _selectTab(ev: Event): void { private _selectTab(ev: MDCTabBarActivatedEvent): void {
this._cardTab = parseInt((ev.target! as any).selected!, 10) === 1; this._cardTab = ev.detail.index === 1;
} }
private _toggleMode(): void { private _toggleMode(): void {
@ -301,9 +302,7 @@ export class HuiConditionalCardEditor extends LitElement
return [ return [
configElementStyle, configElementStyle,
css` css`
paper-tabs { mwc-tab-bar {
--paper-tabs-selection-bar-color: var(--primary-color);
--paper-tab-ink: var(--primary-color);
border-bottom: 1px solid var(--divider-color); border-bottom: 1px solid var(--divider-color);
} }
.conditions { .conditions {