mirror of
https://github.com/home-assistant/frontend.git
synced 2025-07-22 16:56:35 +00:00
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:
parent
ccf670465b
commit
0d869d53e3
@ -128,7 +128,9 @@ export class HaMoreInfoToggle extends LitElement {
|
|||||||
static get styles(): CSSResultGroup {
|
static get styles(): CSSResultGroup {
|
||||||
return css`
|
return css`
|
||||||
ha-control-switch {
|
ha-control-switch {
|
||||||
height: 320px;
|
height: 45vh;
|
||||||
|
max-height: 320px;
|
||||||
|
min-height: 200px;
|
||||||
--control-switch-thickness: 100px;
|
--control-switch-thickness: 100px;
|
||||||
--control-switch-border-radius: 24px;
|
--control-switch-border-radius: 24px;
|
||||||
--control-switch-padding: 6px;
|
--control-switch-padding: 6px;
|
||||||
@ -138,7 +140,9 @@ export class HaMoreInfoToggle extends LitElement {
|
|||||||
display: flex;
|
display: flex;
|
||||||
flex-direction: column;
|
flex-direction: column;
|
||||||
width: 100px;
|
width: 100px;
|
||||||
height: 320px;
|
height: 45vh;
|
||||||
|
max-height: 320px;
|
||||||
|
min-height: 200px;
|
||||||
padding: 6px;
|
padding: 6px;
|
||||||
box-sizing: border-box;
|
box-sizing: border-box;
|
||||||
}
|
}
|
||||||
|
@ -84,7 +84,9 @@ export class HaMoreInfoLightBrightness extends LitElement {
|
|||||||
static get styles(): CSSResultGroup {
|
static get styles(): CSSResultGroup {
|
||||||
return css`
|
return css`
|
||||||
ha-control-slider {
|
ha-control-slider {
|
||||||
height: 320px;
|
height: 45vh;
|
||||||
|
max-height: 320px;
|
||||||
|
min-height: 200px;
|
||||||
--control-slider-thickness: 100px;
|
--control-slider-thickness: 100px;
|
||||||
--control-slider-border-radius: 24px;
|
--control-slider-border-radius: 24px;
|
||||||
--control-slider-color: var(--primary-color);
|
--control-slider-color: var(--primary-color);
|
||||||
|
@ -535,8 +535,12 @@ class MoreInfoViewLightColorPicker extends LitElement {
|
|||||||
}
|
}
|
||||||
|
|
||||||
ha-control-slider {
|
ha-control-slider {
|
||||||
height: 320px;
|
height: 45vh;
|
||||||
|
max-height: 320px;
|
||||||
|
min-height: 200px;
|
||||||
margin: 20px 0;
|
margin: 20px 0;
|
||||||
|
--control-slider-thickness: 100px;
|
||||||
|
--control-slider-border-radius: 24px;
|
||||||
}
|
}
|
||||||
|
|
||||||
ha-labeled-slider {
|
ha-labeled-slider {
|
||||||
@ -554,8 +558,6 @@ class MoreInfoViewLightColorPicker extends LitElement {
|
|||||||
}
|
}
|
||||||
|
|
||||||
.color-temp {
|
.color-temp {
|
||||||
--control-slider-thickness: 100px;
|
|
||||||
--control-slider-border-radius: 24px;
|
|
||||||
--control-slider-background: -webkit-linear-gradient(
|
--control-slider-background: -webkit-linear-gradient(
|
||||||
top,
|
top,
|
||||||
rgb(166, 209, 255) 0%,
|
rgb(166, 209, 255) 0%,
|
||||||
|
Loading…
x
Reference in New Issue
Block a user