Adapt more info control height for small screen (#15647)

* Adapt more info control height for small screen

* Fix light picker sliders
This commit is contained in:
Paul Bottein 2023-03-01 12:15:12 +01:00 committed by GitHub
parent ccf670465b
commit 0d869d53e3
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
3 changed files with 14 additions and 6 deletions

View File

@ -128,7 +128,9 @@ export class HaMoreInfoToggle extends LitElement {
static get styles(): CSSResultGroup {
return css`
ha-control-switch {
height: 320px;
height: 45vh;
max-height: 320px;
min-height: 200px;
--control-switch-thickness: 100px;
--control-switch-border-radius: 24px;
--control-switch-padding: 6px;
@ -138,7 +140,9 @@ export class HaMoreInfoToggle extends LitElement {
display: flex;
flex-direction: column;
width: 100px;
height: 320px;
height: 45vh;
max-height: 320px;
min-height: 200px;
padding: 6px;
box-sizing: border-box;
}

View File

@ -84,7 +84,9 @@ export class HaMoreInfoLightBrightness extends LitElement {
static get styles(): CSSResultGroup {
return css`
ha-control-slider {
height: 320px;
height: 45vh;
max-height: 320px;
min-height: 200px;
--control-slider-thickness: 100px;
--control-slider-border-radius: 24px;
--control-slider-color: var(--primary-color);

View File

@ -535,8 +535,12 @@ class MoreInfoViewLightColorPicker extends LitElement {
}
ha-control-slider {
height: 320px;
height: 45vh;
max-height: 320px;
min-height: 200px;
margin: 20px 0;
--control-slider-thickness: 100px;
--control-slider-border-radius: 24px;
}
ha-labeled-slider {
@ -554,8 +558,6 @@ class MoreInfoViewLightColorPicker extends LitElement {
}
.color-temp {
--control-slider-thickness: 100px;
--control-slider-border-radius: 24px;
--control-slider-background: -webkit-linear-gradient(
top,
rgb(166, 209, 255) 0%,