Use ha-slider in ha-form-integer (#11471)

This commit is contained in:
Thomas Lovén 2022-01-28 17:17:29 +01:00 committed by GitHub
parent 389a100b46
commit 69ff8dd0c4
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 7 additions and 6 deletions

View File

@ -1,6 +1,5 @@
import "@material/mwc-textfield"; import "@material/mwc-textfield";
import type { TextField } from "@material/mwc-textfield"; import type { TextField } from "@material/mwc-textfield";
import "@material/mwc-slider";
import type { Slider } from "@material/mwc-slider"; import type { Slider } from "@material/mwc-slider";
import { import {
css, css,
@ -14,6 +13,7 @@ import { customElement, property, query } from "lit/decorators";
import { fireEvent } from "../../common/dom/fire_event"; import { fireEvent } from "../../common/dom/fire_event";
import { HaCheckbox } from "../ha-checkbox"; import { HaCheckbox } from "../ha-checkbox";
import { HaFormElement, HaFormIntegerData, HaFormIntegerSchema } from "./types"; import { HaFormElement, HaFormIntegerData, HaFormIntegerSchema } from "./types";
import "../ha-slider";
@customElement("ha-form-integer") @customElement("ha-form-integer")
export class HaFormInteger extends LitElement implements HaFormElement { export class HaFormInteger extends LitElement implements HaFormElement {
@ -54,15 +54,16 @@ export class HaFormInteger extends LitElement implements HaFormElement {
></ha-checkbox> ></ha-checkbox>
` `
: ""} : ""}
<mwc-slider <ha-slider
discrete pin
ignore-bar-touch
.value=${this._value} .value=${this._value}
.min=${this.schema.valueMin} .min=${this.schema.valueMin}
.max=${this.schema.valueMax} .max=${this.schema.valueMax}
.disabled=${this.disabled || .disabled=${this.disabled ||
(this.data === undefined && this.schema.optional)} (this.data === undefined && this.schema.optional)}
@change=${this._valueChanged} @change=${this._valueChanged}
></mwc-slider> ></ha-slider>
</div> </div>
</div> </div>
`; `;
@ -168,7 +169,7 @@ export class HaFormInteger extends LitElement implements HaFormElement {
.flex { .flex {
display: flex; display: flex;
} }
mwc-slider { ha-slider {
flex: 1; flex: 1;
} }
mwc-textfield { mwc-textfield {

View File

@ -104,7 +104,7 @@ export class HaForm extends LitElement implements HaFormElement {
return css` return css`
.root { .root {
margin-bottom: -24px; margin-bottom: -24px;
overflow: auto; overflow: clip visible;
} }
.root > * { .root > * {
display: block; display: block;