Hallo zusammen,
ich möchte die Höhe einer Karte im Dashboard anpassen bzw. verkleindern.
Es handelt sich um eine: type: custom:stack-in-card mode: vertical Karte.
Ich habe schon verschiedene Dinge probiert, leider ohne erfolg.
Hier ein Bild der Karte:
Ich möchte den Platz unten verkleinern, da ich HA meist nur am Handy nutze und Platz sparen möchte.
Hier der komplette code:
type: custom:stack-in-card
mode: vertical
keep:
outer_padding: false
cards:
- type: horizontal-stack
cards:
- type: vertical-stack
cards:
- type: custom:mushroom-template-card
card_mod:
style:
mushroom-shape-icon$: |
@keyframes ping {
0% { box-shadow: 0 0 1px 1px rgba(var(--rgb-{{ config.icon_color }}), 0.7); }
100% { box-shadow: 0 0 5px 15px transparent; }
}
.: |
mushroom-shape-icon {
--icon-size: 76px;
display: flex;
margin: -21px -5px 0px -21px !important;
}
ha-card {
clip-path: inset(0 0 0 0 round var(--ha-card-border-radius, 12px));
width: 180px;
}
primary: Wohnzimmer
secondary: ''
icon: mdi:sofa
layout: horizontal
entity: light.alle_lichter_eg_wohnzimmer
icon_color: |-
{% if is_state('light.alle_lichter_eg_wohnzimmer','on')%}
amber
{%endif%}
tap_action:
action: navigate
navigation_path: /dashboard-smartphone/wohnzimmer
hold_action:
action: toggle
double_tap_action:
action: none
fill_container: true
- type: vertical-stack
cards:
- type: custom:button-card
state:
- value: 'on'
icon: mdi:thermometer
show_icon: false
entity: sensor.eg_wohnzimmer_hg_int0000005_temperatur
styles:
card:
- right: '-55px'
- width: 37px
- height: 40px
name:
- color: white
- font-size: 12px
- opacity: '0.7'
name: |
[[[
if (states['sensor.eg_wohnzimmer_hg_int0000005_temperatur'].state == 'unknown')
return '-'
return `${states['sensor.eg_wohnzimmer_hg_int0000005_temperatur'].state}°`
]]]
- type: custom:button-card
state:
- value: 'on'
icon: mdi:water-percent
show_icon: false
entity: sensor.eg_wohnzimmer_hg_int0000005_luftfeuchtigkeit
styles:
card:
- width: 37px
- height: 40px
- top: '-25px'
- right: '-57px'
name:
- color: white
- font-size: 12px
- opacity: '0.7'
name: |
[[[
if (states['sensor.eg_wohnzimmer_hg_int0000005_luftfeuchtigkeit'].state == 'unknown')
return '-'
return `${states['sensor.eg_wohnzimmer_hg_int0000005_luftfeuchtigkeit'].state}%`
]]]
- type: horizontal-stack
cards:
- type: custom:button-card
tap_action:
action: none
state:
- operator: default
color: grey
icon: mdi:lightbulb-group-off-outline
- value: 'on'
color: orange
icon: mdi:lightbulb-group-outline
entity: light.alle_lichter_eg_wohnzimmer
styles:
icon:
- width: 19px
grid:
- position: relative
custom_fields:
notification:
- position: absolute
- left: 60%
- top: 3%
- height: 20px
- width: 20px
- font-size: 10px
- line-height: 20px
- font-weight: bold
card:
- width: 37px
- height: 40px
- top: '-25px'
custom_fields:
notification: |
[[[
if (states['sensor.number_lights_on_eg_wohnzimmer'].state == '0')
return ' '
return `${states['sensor.number_lights_on_eg_wohnzimmer'].state}`
]]]
name: ' '
- type: custom:button-card
tap_action:
action: none
state:
- operator: default
color: grey
icon: mdi:power-plug-off-outline
- value: 'on'
color: orange
icon: mdi:power-plug-outline
entity: switch.alle_skd_eg_wohnzimmer
styles:
icon:
- width: 19px
grid:
- position: relative
custom_fields:
notification:
- position: absolute
- left: 60%
- top: 3%
- height: 20px
- width: 20px
- font-size: 10px
- line-height: 20px
- font-weight: bold
card:
- width: 37px
- height: 40px
- top: '-25px'
custom_fields:
notification: |
[[[
if (states['sensor.number_skd_on_eg_wohnzimmer'].state == '0')
return ' '
return `${states['sensor.number_skd_on_eg_wohnzimmer'].state}`
]]]
name: ' '
- type: custom:button-card
tap_action:
action: none
state:
- operator: default
color: grey
icon: mdi:motion-sensor-off
- value: 'on'
color: green
icon: mdi:motion-sensor
entity: light.empty
styles:
icon:
- width: 19px
grid:
- position: relative
custom_fields:
notification:
- position: absolute
- left: 60%
- top: 3%
- height: 20px
- width: 20px
- font-size: 10px
- line-height: 20px
- font-weight: bold
card:
- width: 37px
- height: 40px
- top: '-25px'
custom_fields:
notification: |
[[[
if (states['sensor.number_lights_on_eg_wohnzimmer'].state >= '0')
return ' '
return `${states['sensor.number_lights_on_eg_wohnzimmer'].state}`
]]]
name: ' '
- type: custom:button-card
tap_action:
action: none
state:
- operator: default
color: grey
icon: mdi:door-closed
- value: 'on'
color: orange
icon: mdi:door-open
entity: binary_sensor.alle_turen_eg_wohnzimmer
styles:
icon:
- width: 19px
grid:
- position: relative
custom_fields:
notification:
- position: absolute
- left: 60%
- top: 3%
- height: 20px
- width: 20px
- font-size: 10px
- line-height: 20px
- font-weight: bold
card:
- width: 37px
- height: 40px
- top: '-25px'
custom_fields:
notification: |
[[[
if (states['sensor.number_doors_open_eg_wohnzimmer'].state == '0')
return ' '
return `${states['sensor.number_doors_open_eg_wohnzimmer'].state}`
]]]
name: ' '
- type: custom:button-card
tap_action:
action: none
state:
- operator: default
color: grey
icon: mdi:window-closed-variant
- value: 'on'
color: orange
icon: mdi:window-open-variant
entity: binary_sensor.alle_fenster_eg_wohnzimmer
styles:
icon:
- width: 19px
grid:
- position: relative
custom_fields:
notification:
- position: absolute
- left: 60%
- top: 3%
- height: 20px
- width: 20px
- font-size: 10px
- line-height: 20px
- font-weight: bold
card:
- width: 37px
- height: 40px
- top: '-25px'
custom_fields:
notification: |
[[[
if (states['sensor.number_windows_open_eg_wohnzimmer'].state == '0')
return ' '
return `${states['sensor.number_windows_open_eg_wohnzimmer'].state}`
]]]
name: ' '
