Das Dashboard sieht sehr gut aus. Da ich gerade auch an ein Dashboard für meine Lenovo Tablett arbeite, wäre ich an deinen Code sehr interessiert. Könntest du mir (evtl. per PN) deine Startseite und ein oder zwei Unterseiten schicken?
VG
Martin
gefällt mir auch sehr gut,… würde mich auch dafür interresieren
danke
Hier ist der komplette Code. Dann muss ich nicht auf jede PN antworten.
Da ich alles über Pop-ups gelöst habe, sind sämtliche Unterseiten (Heizung, Licht, Steckdosen, Kameras etc.) schon vollständig in dieser einen Datei enthalten.
Wichtig – Das musst du danach direkt anpassen:
- Dein Benutzername (Ganz oben): In den Zeilen 3–5 steht bei
users:noch ein Platzhalter. Tausche das unbedingt gegen deinen eigenen Home-Assistant-Benutzernamen aus. Sonst greift der Kiosk-Modus falsch und blendet dir die Menüs aus.
Benötigte HACS-Erweiterungen (Frontend):
Damit das Dashboard fehlerfrei geladen wird, musst du folgende Komponenten über HACS installiert haben:
Für das Layout & Design:
-
layout-card (für das
grid-layout, das alles in Spalten anordnet) -
bubble-card (für das Pop-up-System und die Steuerung)
-
mushroom (für die Template-Karten der Hauptübersicht)
-
button-card (wichtig für die Müllabfuhr-Logik und den Sonnenstand)
-
card-mod (für die erweiterten CSS-Farbanpassungen)
-
swipe-nav & kiosk-mode (für die saubere Tablet-Ansicht)
Für die Spezial-Karten:
-
power-flow-card-plus (für die Solarbank- & Energie-Anzeige)
-
advanced-camera-card (für den Kamera-Stream)
-
weather-chart-card (für das Wetter-Diagramm)
-
flower-card (für die Pflanzen-Ansichten)
-
template-entity-row (für die Zeilen in den Pop-ups)
-
font-clock-card & calendar-card-pro (für Uhrzeit & Kalender)
Viel Erfolg beim Anpassen!
kiosk_mode:
user_settings:
- users:
- dein_benutzername
hide_header: true
hide_sidebar: true
hide_overflow: true
hide_edit_dashboard: true
swipe_nav:
animate: fade
transition_duration: 175
swipe_amount: 15
wrap: true
prevent_default: true
views:
- type: custom:grid-layout
path: grid
title: Home
layout:
grid-template-columns: 1fr repeat(16, 56px) 1fr
grid-auto-rows: 5px
grid-column-gap: 8px
grid-row-gap: 1px
justify-content: center
margin: 0px 0px 0px -12px
layout_type: grid
cards:
- type: custom:mushroom-template-card
vertical: true
view_layout:
grid-column: 2 / span 2
grid-row: 66 / span 20
grid_options:
columns: 4
rows: 10
icon: >-
{% if is_state('input_boolean.klingel_ruhemodus', 'on') %}
mdi:bell-off {% else %} mdi:bell {% endif %}
icon_color: >-
{% if is_state('input_boolean.klingel_ruhemodus', 'on') %} red {% else
%} green {% endif %}
primary: >-
{% if is_state('input_boolean.klingel_ruhemodus', 'on') %} Klingel aus
{% else %} Klingel an {% endif %}
secondary: ""
entity: input_boolean.klingel_ruhemodus
tap_action:
action: toggle
- type: custom:mushroom-template-card
primary: Heizung
icon: mdi:heating-coil
tap_action:
action: navigate
navigation_path: "#Heizung"
color: |-
{% if is_state('switch.heizung_shellyplus1', 'on') %}
orange
{% else %}
grey
{% endif %}
icon_color: |-
{% if is_state('switch.heizung_shellyplus1', 'on') %}
orange
{% else %}
grey
{% endif %}
features_position: bottom
view_layout:
grid-column: 6 / span 4
grid-row: 66 / span 20
grid_options:
columns: 4
rows: 20
vertical: true
icon_tap_action:
action: navigate
navigation_path: "#Heizung"
- type: custom:mushroom-template-card
primary: Garten
icon: mdi:camera
tap_action:
action: navigate
navigation_path: "#gartenkamera"
color: >-
{% if
is_state('automation.reolink_zu_echo_show_pro_push_video_ton_schalter',
'on') %}
orange
{% else %}
grey
{% endif %}
features_position: bottom
view_layout:
grid-column: 10 / span 4
grid-row: 66 / span 20
grid_options:
columns: 4
rows: 20
vertical: true
entity: camera.garten_standardauflosung
icon_tap_action:
action: navigate
navigation_path: /test-2/kamera-garten
- type: custom:mushroom-template-card
primary: Haus
icon: mdi:camera-account
tap_action:
action: navigate
navigation_path: "#HausKamera"
color: |-
{% if is_state('alarm_control_panel.blink_kameras','armed_away') %}
green
{% else %}
grey
{% endif %}
features_position: bottom
view_layout:
grid-column: 14 / span 4
grid-row: 66 / span 20
grid_options:
columns: 4
rows: 20
vertical: true
entity: alarm_control_panel.blink_kameras
icon_tap_action:
action: perform-action
perform_action: script.blink_toggle
target:
entity_id: alarm_control_panel.blink_kameras
- type: custom:mushroom-template-card
primary: Lampen
icon: mdi:lamp
tap_action:
action: navigate
navigation_path: "#Lampen"
color: |-
{% if is_state('light.lampen', 'on') %}
orange
{% else %}
grey
{% endif %}
features_position: bottom
vertical: true
view_layout:
grid-column: 2 / span 2
grid-row: 86 / span 20
grid_options:
columns: 4
rows: 10
- type: custom:mushroom-template-card
primary: Steckdosen
icon: mdi:flash
tap_action:
action: navigate
navigation_path: "#Steckdosen"
features_position: bottom
vertical: true
view_layout:
grid-column: 4 / span 2
grid-row: 86 / span 20
grid_options:
columns: 4
rows: 10
icon_color: |-
{% if is_state('switch.computer_steckdose', 'off') or
is_state('switch.steckdose_hauswasserwerk', 'off') or
is_state('switch.steckdose_mediacenter', 'off') %}
orange
{% else %}
green
{% endif %}
- type: custom:mushroom-template-card
primary: Batterien
icon: mdi:battery
tap_action:
action: navigate
navigation_path: "#Batterien"
color: "{{ states('sensor.zustand_batterie_farbe') }}"
icon_color: "{{ states('sensor.zustand_batterie_farbe') }}"
features_position: bottom
view_layout:
grid-column: 6 / span 2
grid-row: 86 / span 20
grid_options:
columns: 4
rows: 10
vertical: true
- type: custom:mushroom-template-card
primary: Smoke
icon: mdi:smoke-detector-variant
tap_action:
action: navigate
navigation_path: "#Rauchmelder"
color: |-
{% if is_state('binary_sensor.rauchmelder_rauch', 'on') %}
red
{% else %}
grey
{% endif %}
features_position: bottom
vertical: true
grid_options:
columns: 4
rows: 10
view_layout:
grid-column: 8 / span 2
grid-row: 86 / span 20
- type: tile
view_layout:
grid-column: 10 / span 2
grid-row: 86 / span 20
grid_options:
columns: 4
rows: 10
entity: switch.anwesenheitssimulation
name: AWS
icon: mdi:home-lightbulb-outline
vertical: true
hide_state: true
tap_action:
action: toggle
features_position: bottom
- type: custom:button-card
view_layout:
grid-column: 14 / span 4
grid-row: 86 / span 20
grid_options:
columns: 4
rows: 20
entity: sensor.abfall_liste
show_name: false
show_icon: false
styles:
grid:
- grid-template-areas: "\"t1\" \"t2\""
- grid-template-rows: 1fr 1fr
- row-gap: 8px
card:
- background: rgba(0, 0, 0, 0.05)
- border: 1px solid rgba(255, 255, 255, 0.05)
- border-radius: 12px
- padding: 8px
- height: 100%
- box-sizing: border-box
- box-shadow: none
custom_fields:
t1:
card:
type: custom:button-card
entity: sensor.abfall_liste
name: |
[[[
if (!entity || !entity.attributes || !entity.attributes.termine) return 'Lade...';
const t = entity.attributes.termine;
return (t && t[0]) ? t[0].summary : 'Kein Termin';
]]]
label: |
[[[
if (!entity || !entity.attributes || !entity.attributes.termine) return '';
const t = entity.attributes.termine;
if (t && t[0]) {
const d = new Date(t[0].start);
return d.toLocaleDateString('de-DE', {weekday: 'short', day: '2-digit', month: '2-digit'});
}
return '';
]]]
show_name: true
show_label: true
show_icon: true
styles:
card:
- background: none
- border-radius: 8px
- padding: 6px 10px
- height: 41px
- box-shadow: none
grid:
- grid-template-areas: "\"i n l\""
- grid-template-columns: 20px 1fr 50px
name:
- justify-self: start
- font-size: 11px
- font-weight: 600
- color: white
- margin-left: 3px
- white-space: nowrap
- letter-spacing: "-0.2px"
label:
- justify-self: end
- font-size: 10px
- color: "#aaaaaa"
icon:
- width: 20px
- color: |
[[[
if (!entity || !entity.attributes || !entity.attributes.termine) return 'white';
const t = entity.attributes.termine;
if (t && t[0]) {
const m = t[0].summary.toLowerCase();
if (m.includes('rest')) return '#4caf50';
if (m.includes('papier')) return '#2196f3';
if (m.includes('bio')) return '#795548';
return '#ffeb3b';
}
return 'white';
]]]
t2:
card:
type: custom:button-card
entity: sensor.abfall_liste
name: |
[[[
if (!entity || !entity.attributes || !entity.attributes.termine) return '';
const t = entity.attributes.termine;
return (t && t[1]) ? t[1].summary : '';
]]]
label: |
[[[
if (!entity || !entity.attributes || !entity.attributes.termine) return '';
const t = entity.attributes.termine;
if (t && t[1]) {
const d = new Date(t[1].start);
return d.toLocaleDateString('de-DE', {weekday: 'short', day: '2-digit', month: '2-digit'});
}
return '';
]]]
show_name: true
show_label: true
show_icon: true
styles:
card:
- background: none
- border-radius: 8px
- padding: 6px 10px
- height: 41px
- box-shadow: none
grid:
- grid-template-areas: "\"i n l\""
- grid-template-columns: 20px 1fr 50px
name:
- justify-self: start
- font-size: 11px
- font-weight: 600
- color: white
- margin-left: 3px
- white-space: nowrap
- letter-spacing: "-0.2px"
label:
- justify-self: end
- font-size: 10px
- color: "#aaaaaa"
icon:
- width: 20px
- color: |
[[[
if (!entity || !entity.attributes || !entity.attributes.termine) return 'white';
const t = entity.attributes.termine;
if (t && t[1]) {
const m = t[1].summary.toLowerCase();
if (m.includes('rest')) return '#4caf50';
if (m.includes('papier')) return '#2196f3';
if (m.includes('bio')) return '#795548';
return '#ffeb3b';
}
return 'white';
]]]
- type: custom:mushroom-template-card
primary: Pflanzen
secondary: ""
icon: mdi:water
entity: input_boolean.bewasserungs_automatik
tap_action:
action: navigate
navigation_path: "#PflanzenNeu"
icon_tap_action:
action: toggle
icon_color: >-
{% if is_state('switch.steckdose_gartenpumpe_1', 'on') or
is_state('switch.steckdose_gartenpumpe_2', 'on') %}
blue
{% elif is_state('input_boolean.bewasserungs_automatik', 'on') %}
green
{% else %}
grey
{% endif %}
badge_icon: >-
{% if is_state('switch.steckdose_gartenpumpe_1', 'on') or
is_state('switch.steckdose_gartenpumpe_2', 'on') %}
mdi:sprinkler-variant
{% endif %}
badge_color: green
vertical: true
grid_options:
columns: 4
rows: 10
view_layout:
grid-column: 12 / span 2
grid-row: 86 / span 20
- type: custom:bubble-card
view_layout:
grid-column: 18 / span 2
grid-row: 196 / span 20
card_type: pop-up
hash: "#Lampen"
button_type: name
show_header: false
name: Lampen
icon: mdi:lamp
sub_button:
main: []
bottom: []
cards:
- type: entities
title: Alle Lampen
show_header_toggle: true
state_color: true
entities:
- type: custom:template-entity-row
entity: light.kuchenlicht
name: Küchen Licht
icon: mdi:lightbulb
toggle: true
active: "{{ is_state('light.kuchenlicht', 'on') }}"
color: >-
{{ 'orange' if is_state('light.kuchenlicht', 'on') else 'grey'
}}
secondary: |
{% if is_state('light.kuchenlicht', 'on') %}
Helligkeit: {{ (state_attr('light.kuchenlicht', 'brightness') / 2.55) | round(0) }} %
{% endif %}
- type: custom:template-entity-row
entity: light.licht_kuche
name: Küchen Stehlampe
icon: mdi:floor-lamp
toggle: true
active: "{{ is_state('light.licht_kuche', 'on') }}"
color: >-
{{ 'orange' if is_state('light.licht_kuche', 'on') else 'grey'
}}
secondary: |
{% if is_state('light.licht_kuche', 'on') %}
Helligkeit: {{ (state_attr('light.licht_kuche', 'brightness') / 2.55) | round(0) }} %
{% endif %}
- type: custom:template-entity-row
entity: light.kuchenzeile_treiber
name: Küchenzeile
icon: mdi:led-strip-variant
toggle: true
active: "{{ is_state('light.kuchenzeile_treiber', 'on') }}"
color: >-
{{ 'orange' if is_state('light.kuchenzeile_treiber', 'on')
else 'grey' }}
secondary: |
{% if is_state('light.kuchenzeile_treiber', 'on') %}
Helligkeit: {{ (state_attr('light.kuchenzeile_treiber', 'brightness') / 2.55) | round(0) }} %
{% endif %}
- type: custom:template-entity-row
entity: light.steckdose_licht_wintergarten
name: Wintergarten Licht
icon: mdi:sprout
toggle: true
active: "{{ is_state('light.steckdose_licht_wintergarten', 'on') }}"
color: >-
{{ 'orange' if is_state('light.steckdose_licht_wintergarten',
'on') else 'grey' }}
secondary: |
{% if is_state('light.steckdose_licht_wintergarten', 'on') %}
An
{% endif %}
- type: custom:template-entity-row
entity: light.wohnzimmer
name: Wohnzimmer
icon: mdi:sofa
toggle: true
active: "{{ is_state('input_boolean.wohnzimmer_licht_helfer', 'on') }}"
color: >-
{{ 'orange' if
is_state('input_boolean.wohnzimmer_licht_helfer', 'on') else
'grey' }}
secondary: >
{% if is_state('input_boolean.wohnzimmer_licht_helfer', 'on')
%}
{% set helligkeit = state_attr('light.wohnzimmer', 'brightness') %}
{% if helligkeit %}
Helligkeit: {{ (helligkeit / 2.55) | round(0) }} %
{% else %}
An (20%)
{% endif %}
{% endif %}
- type: custom:template-entity-row
entity: light.wohnzimmer_2
name: Wohnzimmer Deckenlampe
icon: mdi:sofa
toggle: true
active: "{{ is_state('light.wohnzimmer_2', 'on') }}"
color: >-
{{ 'orange' if is_state('light.wohnzimmer_2', 'on') else
'grey' }}
secondary: |
{% if is_state('light.wohnzimmer_2', 'on') %}
Helligkeit: {{ (state_attr('light.wohnzimmer_2', 'brightness') / 2.55) | round(0) }} %
{% endif %}
- type: custom:template-entity-row
entity: light.steckdose_flurlicht
name: Flur Licht
icon: mdi:door-open
toggle: true
active: "{{ is_state('light.steckdose_flurlicht', 'on') }}"
color: >-
{{ 'orange' if is_state('light.steckdose_flurlicht', 'on')
else 'grey' }}
- type: custom:template-entity-row
entity: light.schlafzimmer
name: Schlafzimmer
icon: mdi:bed
toggle: true
active: "{{ is_state('light.schlafzimmer', 'on') }}"
color: >-
{{ 'orange' if is_state('light.schlafzimmer', 'on') else
'grey' }}
secondary: |
{% if is_state('light.schlafzimmer', 'on') %}
Helligkeit: {{ (state_attr('light.schlafzimmer', 'brightness') / 2.55) | round(0) }} %
{% endif %}
- type: custom:template-entity-row
entity: light.garten_laube_vorne
name: Garten Laube
icon: mdi:flower-tulip-outline
toggle: true
active: "{{ is_state('light.garten_laube_vorne', 'on') }}"
color: >-
{{ 'orange' if is_state('light.garten_laube_vorne', 'on') else
'grey' }}
secondary: |
{% if is_state('light.garten_laube_vorne', 'on') %}
Helligkeit: {{ (state_attr('light.garten_laube_vorne', 'brightness') / 2.55) | round(0) }} %
{% endif %}
- type: custom:template-entity-row
entity: light.gartenlampe_eingang
name: Gartenlampe Eingang
icon: mdi:walk
toggle: true
active: "{{ is_state('light.gartenlampe_eingang', 'on') }}"
color: >-
{{ 'orange' if is_state('light.gartenlampe_eingang', 'on')
else 'grey' }}
secondary: |
{% if is_state('light.gartenlampe_eingang', 'on') %}
Helligkeit: {{ (state_attr('light.gartenlampe_eingang', 'brightness') / 2.55) | round(0) }} %
{% endif %}
- type: custom:template-entity-row
entity: light.gartenlampe_haus
name: Gartenlampe Haus
icon: mdi:walk
toggle: true
active: "{{ is_state('light.gartenlampe_haus', 'on') }}"
color: >-
{{ 'orange' if is_state('light.gartenlampe_haus', 'on') else
'grey' }}
secondary: |
{% if is_state('light.gartenlampe_haus', 'on') %}
Helligkeit: {{ (state_attr('light.gartenlampe_haus', 'brightness') / 2.55) | round(0) }} %
{% endif %}
- type: section
- type: custom:template-entity-row
entity: input_boolean.garten_licht_automatik
name: Garten Automatik Aktiv
icon: mdi:motion-sensor
toggle: true
active: "{{ is_state('input_boolean.garten_licht_automatik', 'on') }}"
color: >-
{{ 'green' if is_state('input_boolean.garten_licht_automatik',
'on') else 'red' }}
secondary: >
{% if is_state('input_boolean.garten_licht_automatik', 'on')
%}
Aktiviert (Bewegung schaltet Licht)
{% else %}
Deaktiviert (Dauerlicht/Aus möglich)
{% endif %}
- type: custom:bubble-card
view_layout:
grid-column: 18 / span 2
grid-row: 56/ span 20
card_type: pop-up
hash: "#Steckdosen"
button_type: name
show_header: false
name: Steckdosen
icon: mdi:flash
sub_button:
main: []
bottom: []
slider_fill_orientation: left
slider_value_position: right
cards:
- type: entities
title: Steckdosen
show_header_toggle: false
state_color: true
entities:
- type: custom:template-entity-row
entity: switch.computer_steckdose
name: Computer
icon: mdi:desktop-tower
active: "{{ is_state('switch.computer_steckdose', 'on') }}"
color: >-
{{ 'orange' if is_state('switch.computer_steckdose', 'on')
else 'grey' }}
toggle: true
secondary: >
aktuell: {{ states('sensor.computer_steckdose_leistung') |
round(0) }} W
gesamt: {{ states('sensor.computer_gesamt') | round(2) }} kWh
card_mod:
style: |
div.secondary { white-space: pre-line; }
- type: custom:template-entity-row
entity: switch.steckdose_mediacenter
name: Mediacenter
icon: mdi:television
active: "{{ is_state('switch.steckdose_mediacenter', 'on') }}"
color: >-
{{ 'orange' if is_state('switch.steckdose_mediacenter', 'on')
else 'grey' }}
toggle: true
secondary: >
aktuell: {{ states('sensor.steckdose_mediacenter_leistung') |
round(0) }} W
gesamt: {{ states('sensor.media_center_gesamt') | round(2) }}
kWh
card_mod:
style: |
div.secondary { white-space: pre-line; }
- type: custom:template-entity-row
entity: switch.steckdose_hauswasserwerk
name: Hauswasserwerk
icon: mdi:water-pump
active: "{{ is_state('switch.steckdose_hauswasserwerk', 'on') }}"
color: >-
{{ 'orange' if is_state('switch.steckdose_hauswasserwerk',
'on') else 'grey' }}
toggle: true
secondary: >
aktuell: {{ states('sensor.steckdose_hauswasserwerk_power') |
round(0) }} W
gesamt: {{ states('sensor.steckdose_hauswasserwerk_energy') |
round(2) }} kWh
card_mod:
style: |
div.secondary { white-space: pre-line; }
- type: custom:template-entity-row
entity: switch.steckdose_tablet
name: Tablet
icon: mdi:tablet
active: "{{ is_state('switch.steckdose_tablet', 'on') }}"
color: >-
{{ 'orange' if is_state('switch.steckdose_tablet', 'on') else
'grey' }}
toggle: true
secondary: >
aktuell: {{ states('sensor.steckdose_tablet_leistung') |
round(0) }} W
gesamt: {{ states('sensor.tablet_gesamt') | round(2) }} kWh
card_mod:
style: |
div.secondary { white-space: pre-line; }
- type: custom:template-entity-row
entity: switch.steckdose_waschmaschine
name: Waschmaschine
icon: mdi:washing-machine
active: "{{ is_state('switch.steckdose_waschmaschine', 'on') }}"
color: >-
{{ 'orange' if is_state('switch.steckdose_waschmaschine',
'on') else 'grey' }}
toggle: true
secondary: >
aktuell: {{ states('sensor.steckdose_waschmaschine_power') |
round(0) }} W
gesamt: {{ states('sensor.steckdose_waschmaschine_energy') |
round(2) }} kWh
card_mod:
style: |
div.secondary { white-space: pre-line; }
- type: custom:template-entity-row
entity: switch.fritz_smart_energy_200_1
name: 3D Drucker
icon: mdi:printer-3d
active: "{{ is_state('switch.fritz_smart_energy_200_1', 'on') }}"
color: >-
{{ 'orange' if is_state('switch.fritz_smart_energy_200_1',
'on') else 'grey' }}
toggle: true
secondary: >
aktuell: {{ states('sensor.fritz_smart_energy_200_1_leistung')
| round(0) }} W
gesamt: {{ states('sensor.fritz_smart_energy_200_1_energie') |
round(2) }} kWh
card_mod:
style: |
div.secondary { white-space: pre-line; }
- type: custom:template-entity-row
entity: switch.steckdose_buro_heizung
name: Büro Heizung
icon: mdi:radiator
active: "{{ is_state('switch.steckdose_buro_heizung', 'on') }}"
color: >-
{{ 'orange' if is_state('switch.steckdose_buro_heizung', 'on')
else 'grey' }}
toggle: true
secondary: >
aktuell: {{ states('sensor.steckdose_buro_heizung_power') |
round(0) }} W
gesamt: {{ states('sensor.steckdose_buro_heizung_energy') |
round(2) }} kWh
card_mod:
style: |
div.secondary { white-space: pre-line; }
- type: custom:template-entity-row
entity: switch.steckdose_gartenpumpe_1
name: Gartenpumpe 1
icon: mdi:water
active: "{{ is_state('switch.steckdose_gartenpumpe_1', 'on') }}"
color: >-
{{ 'orange' if is_state('switch.steckdose_gartenpumpe_1',
'on') else 'grey' }}
toggle: true
secondary: >
aktuell: {{ states('sensor.steckdose_gartenpumpe_1_power') |
round(0) }} W
gesamt: {{ states('sensor.steckdose_gartenpumpe_1_energy') |
round(2) }} kWh
card_mod:
style: |
div.secondary { white-space: pre-line; }
- type: custom:template-entity-row
entity: switch.steckdose_gartenpumpe_2
name: Gartenpumpe 2
icon: mdi:water
active: "{{ is_state('switch.steckdose_gartenpumpe_2', 'on') }}"
color: >-
{{ 'orange' if is_state('switch.steckdose_gartenpumpe_2',
'on') else 'grey' }}
toggle: true
secondary: >
aktuell: {{ states('sensor.steckdose_gartenpumpe_2_power') |
round(0) }} W
gesamt: {{ states('sensor.steckdose_gartenpumpe_2_energy') |
round(2) }} kWh
card_mod:
style: |
div.secondary { white-space: pre-line; }
- type: custom:template-entity-row
entity: switch.steckdose_pizzaofen
name: Pizzaofen
icon: mdi:pizza
active: "{{ is_state('switch.steckdose_pizzaofen', 'on') }}"
color: >-
{{ 'orange' if is_state('switch.steckdose_pizzaofen', 'on')
else 'grey' }}
toggle: true
secondary: >
aktuell: {{ states('sensor.steckdose_pizzaofen_power') |
round(0) }} W
gesamt: {{ states('sensor.steckdose_pizzaofen_energy') |
round(2) }} kWh
card_mod:
style: |
div.secondary { white-space: pre-line; }
- type: custom:template-entity-row
entity: switch.steckdose_laube
name: Laube
icon: mdi:home-lightning-bolt
active: "{{ is_state('switch.steckdose_laube', 'on') }}"
color: >-
{{ 'orange' if is_state('switch.steckdose_laube', 'on') else
'grey' }}
toggle: true
secondary: >
aktuell: {{ states('sensor.steckdose_laube_power') | round(0)
}} W
gesamt: {{ states('sensor.steckdose_laube_energy') | round(2)
}} kWh
card_mod:
style: |
div.secondary { white-space: pre-line; }
- type: custom:template-entity-row
entity: switch.steckdose_laube_vorne
name: Laube vorne
icon: mdi:home-lightning-bolt
active: "{{ is_state('switch.steckdose_laube_vorne', 'on') }}"
color: >-
{{ 'orange' if is_state('switch.steckdose_laube_vorne', 'on')
else 'grey' }}
toggle: true
secondary: >
aktuell: {{ states('sensor.steckdose_laube_vorne_power') |
round(0) }} W
gesamt: {{ states('sensor.steckdose_laube_vorne_energy') |
round(2) }} kWh
card_mod:
style: |
div.secondary { white-space: pre-line; }
- type: custom:bubble-card
view_layout:
grid-column: 18 / span 2
grid-row: 176 / span 20
card_type: pop-up
hash: "#HausKamera"
button_type: name
show_header: false
sub_button:
main: []
bottom: []
cards:
- type: alarm-panel
entity: alarm_control_panel.blink_kameras
name: Kameras
states:
- arm_away
card_mod:
style:
ha-assist-chip:
$: |
div > md-ripple {
{% if is_state('alarm_control_panel.blink_kameras', 'disarmed') %}
background-color: red !important;
{% else %}
background-color: green !important;
{% endif %}
}
- type: entities
title: Kameras & Bewegung
show_header_toggle: false
entities:
- type: custom:template-entity-row
entity: switch.haustur_bewegungserkennung_der_kamera
name: Haustür
icon: mdi:doorbell-video
toggle: true
active: "{{ is_state(config.entity, 'on') }}"
color: "{{ 'green' if is_state(config.entity, 'on') else 'grey' }}"
secondary: |
{% if is_state('binary_sensor.haustur_bewegung', 'on') %}
ALARM: Bewegung ({{ now().strftime('%H:%M | %d.%m.') }})
{% else %}
Status: Keine Bewegung
{% endif %}
card_mod:
style: >
div.secondary { font-size: 10px !important; opacity: 0.8;
margin-top: 4px !important; }
- type: custom:template-entity-row
entity: switch.wohnzimmer_bewegungserkennung_der_kamera
name: Wohnzimmer
icon: mdi:sofa
toggle: true
active: "{{ is_state(config.entity, 'on') }}"
color: "{{ 'green' if is_state(config.entity, 'on') else 'grey' }}"
secondary: |
{% if is_state('binary_sensor.wohnzimmer_bewegung', 'on') %}
ALARM: Bewegung ({{ now().strftime('%H:%M | %d.%m.') }})
{% else %}
Status: Keine Bewegung
{% endif %}
card_mod:
style: >
div.secondary { font-size: 10px !important; opacity: 0.8;
margin-top: 4px !important; }
- type: custom:template-entity-row
entity: switch.wintergarten_bewegungserkennung_der_kamera
name: Wintergarten
icon: mdi:sprout
toggle: true
active: "{{ is_state(config.entity, 'on') }}"
color: "{{ 'green' if is_state(config.entity, 'on') else 'grey' }}"
secondary: |
{% if is_state('binary_sensor.wintergarten_bewegung', 'on') %}
ALARM: Bewegung ({{ now().strftime('%H:%M | %d.%m.') }})
{% else %}
Status: Keine Bewegung
{% endif %}
card_mod:
style: >
div.secondary { font-size: 10px !important; opacity: 0.8;
margin-top: 4px !important; }
- type: custom:template-entity-row
entity: switch.outdoor_bewegungserkennung_der_kamera
name: Outdoor 1
icon: mdi:cctv
toggle: true
active: "{{ is_state(config.entity, 'on') }}"
color: "{{ 'green' if is_state(config.entity, 'on') else 'grey' }}"
secondary: |
{% if is_state('binary_sensor.outdoor_bewegung', 'on') %}
ALARM: Bewegung ({{ now().strftime('%H:%M | %d.%m.') }})
{% else %}
Status: Keine Bewegung
{% endif %}
card_mod:
style: >
div.secondary { font-size: 10px !important; opacity: 0.8;
margin-top: 4px !important; }
- type: custom:template-entity-row
entity: switch.outdoor_2_bewegungserkennung_der_kamera
name: Outdoor 2
icon: mdi:camera
toggle: true
active: "{{ is_state(config.entity, 'on') }}"
color: "{{ 'green' if is_state(config.entity, 'on') else 'grey' }}"
secondary: |
{% if is_state('binary_sensor.outdoor_2_bewegung', 'on') %}
ALARM: Bewegung ({{ now().strftime('%H:%M | %d.%m.') }})
{% else %}
Status: Keine Bewegung
{% endif %}
card_mod:
style: >
div.secondary { font-size: 10px !important; opacity: 0.8;
margin-top: 4px !important; }
- type: custom:bubble-card
card_type: pop-up
hash: "#Batterienalt"
button_type: name
show_header: false
name: Batterien
sub_button:
main: []
bottom: []
cards:
- type: entities
title: Batteriestände
show_header_toggle: false
entities:
- type: custom:template-entity-row
entity: sensor.rauchmelder_batterie
name: Rauchmelder Wohnzimmer
state: " "
secondary: "Ladezustand: {{ states('sensor.rauchmelder_batterie') }}%"
card_mod:
style: >
state-badge { color: {{ 'green' if
states('sensor.rauchmelder_batterie')|float(0) > 50 else
'orange' if states('sensor.rauchmelder_batterie')|float(0) >
20 else 'red' }}; }
- type: custom:template-entity-row
entity: sensor.rauchmelder_2_batterie
name: Rauchmelder Küche
state: " "
secondary: "Ladezustand: {{ states('sensor.rauchmelder_2_batterie') }}%"
card_mod:
style: >
state-badge { color: {{ 'green' if
states('sensor.rauchmelder_2_batterie')|float(0) > 50 else
'orange' if states('sensor.rauchmelder_2_batterie')|float(0)
> 20 else 'red' }}; }
- type: custom:template-entity-row
entity: sensor.rauchmelder_3_batterie
name: Rauchmelder Flur
state: " "
secondary: "Ladezustand: {{ states('sensor.rauchmelder_3_batterie') }}%"
card_mod:
style: >
state-badge { color: {{ 'green' if
states('sensor.rauchmelder_3_batterie')|float(0) > 50 else
'orange' if states('sensor.rauchmelder_3_batterie')|float(0)
> 20 else 'red' }}; }
- type: custom:template-entity-row
entity: sensor.rauchmelder_4_batterie
name: Rauchmelder Lager
state: " "
secondary: "Ladezustand: {{ states('sensor.rauchmelder_4_batterie') }}%"
card_mod:
style: >
state-badge { color: {{ 'green' if
states('sensor.rauchmelder_4_batterie')|float(0) > 50 else
'orange' if states('sensor.rauchmelder_4_batterie')|float(0)
> 20 else 'red' }}; }
- type: custom:template-entity-row
entity: sensor.rauchmelder_5_batterie
name: Rauchmelder Laube
state: " "
secondary: "Ladezustand: {{ states('sensor.rauchmelder_5_batterie') }}%"
card_mod:
style: >
state-badge { color: {{ 'green' if
states('sensor.rauchmelder_5_batterie')|float(0) > 50 else
'orange' if states('sensor.rauchmelder_5_batterie')|float(0)
> 20 else 'red' }}; }
- type: custom:template-entity-row
entity: sensor.rauchmelder_6_batterie
name: Rauchmelder Holz Lager
state: " "
secondary: "Ladezustand: {{ states('sensor.rauchmelder_6_batterie') }}%"
card_mod:
style: >
state-badge { color: {{ 'green' if
states('sensor.rauchmelder_6_batterie')|float(0) > 50 else
'orange' if states('sensor.rauchmelder_6_batterie')|float(0)
> 20 else 'red' }}; }
- type: custom:template-entity-row
entity: binary_sensor.badezimmer_thermostat_1_battery
name: Thermostat Badezimmer
state: " "
secondary: >-
Status: {{ 'Schwach' if
is_state('binary_sensor.badezimmer_thermostat_1_battery',
'on') else 'OK' }}
card_mod:
style: >
state-badge { color: {{ 'red' if
is_state('binary_sensor.badezimmer_thermostat_1_battery',
'on') else 'green' }}; }
- type: custom:template-entity-row
entity: binary_sensor.badezimmer_wandthermostat_1_battery
name: Wandthermostat Badezimmer
state: " "
secondary: >-
Status: {{ 'Schwach' if
is_state('binary_sensor.badezimmer_wandthermostat_1_battery',
'on') else 'OK' }}
card_mod:
style: >
state-badge { color: {{ 'red' if
is_state('binary_sensor.badezimmer_wandthermostat_1_battery',
'on') else 'green' }}; }
- type: custom:template-entity-row
entity: binary_sensor.flur_thermostat_1_battery
name: Thermostat Flur
state: " "
secondary: >-
Status: {{ 'Schwach' if
is_state('binary_sensor.flur_thermostat_1_battery', 'on') else
'OK' }}
card_mod:
style: >
state-badge { color: {{ 'red' if
is_state('binary_sensor.flur_thermostat_1_battery', 'on')
else 'green' }}; }
- type: custom:template-entity-row
entity: binary_sensor.kleiderraum_wandthermostat_1_battery
name: Wandthermostat Kleiderraum
state: " "
secondary: >-
Status: {{ 'Schwach' if
is_state('binary_sensor.kleiderraum_wandthermostat_1_battery',
'on') else 'OK' }}
card_mod:
style: >
state-badge { color: {{ 'red' if
is_state('binary_sensor.kleiderraum_wandthermostat_1_battery',
'on') else 'green' }}; }
- type: custom:template-entity-row
entity: binary_sensor.laube_schlafzimmer_thermostat_1_battery
name: Thermostat Laube Schlafzimmer
state: " "
secondary: >-
Status: {{ 'Schwach' if
is_state('binary_sensor.laube_schlafzimmer_thermostat_1_battery',
'on') else 'OK' }}
card_mod:
style: >
state-badge { color: {{ 'red' if
is_state('binary_sensor.laube_schlafzimmer_thermostat_1_battery',
'on') else 'green' }}; }
- type: custom:template-entity-row
entity: binary_sensor.lebensraum_thermostat_1_battery
name: Thermostat Lebensraum
state: " "
secondary: >-
Status: {{ 'Schwach' if
is_state('binary_sensor.lebensraum_thermostat_1_battery',
'on') else 'OK' }}
card_mod:
style: >
state-badge { color: {{ 'red' if
is_state('binary_sensor.lebensraum_thermostat_1_battery',
'on') else 'green' }}; }
- type: custom:template-entity-row
entity: binary_sensor.lebensraum_wandthermostat_1_battery
name: Wandthermostat Lebensraum
state: " "
secondary: >-
Status: {{ 'Schwach' if
is_state('binary_sensor.lebensraum_wandthermostat_1_battery',
'on') else 'OK' }}
card_mod:
style: >
state-badge { color: {{ 'red' if
is_state('binary_sensor.lebensraum_wandthermostat_1_battery',
'on') else 'green' }}; }
- type: custom:template-entity-row
entity: binary_sensor.schlafzimmer_thermostat_1_battery
name: Thermostat Schlafzimmer
state: " "
secondary: >-
Status: {{ 'Schwach' if
is_state('binary_sensor.schlafzimmer_thermostat_1_battery',
'on') else 'OK' }}
card_mod:
style: >
state-badge { color: {{ 'red' if
is_state('binary_sensor.schlafzimmer_thermostat_1_battery',
'on') else 'green' }}; }
- type: custom:template-entity-row
entity: binary_sensor.schlafzimmer_wandthermostat_1_battery
name: Wandthermostat Schlafzimmer
state: " "
secondary: >-
Status: {{ 'Schwach' if
is_state('binary_sensor.schlafzimmer_wandthermostat_1_battery',
'on') else 'OK' }}
card_mod:
style: >
state-badge { color: {{ 'red' if
is_state('binary_sensor.schlafzimmer_wandthermostat_1_battery',
'on') else 'green' }}; }
- type: custom:template-entity-row
entity: binary_sensor.wohnzimmer_thermostat_1_battery
name: Thermostat Wohnzimmer
state: " "
secondary: >-
Status: {{ 'Schwach' if
is_state('binary_sensor.wohnzimmer_thermostat_1_battery',
'on') else 'OK' }}
card_mod:
style: >
state-badge { color: {{ 'red' if
is_state('binary_sensor.wohnzimmer_thermostat_1_battery',
'on') else 'green' }}; }
- type: custom:template-entity-row
entity: binary_sensor.wohnzimmer_wandthermostat_1_battery
name: Wandthermostat Wohnzimmer
state: " "
secondary: >-
Status: {{ 'Schwach' if
is_state('binary_sensor.wohnzimmer_wandthermostat_1_battery',
'on') else 'OK' }}
card_mod:
style: >
state-badge { color: {{ 'red' if
is_state('binary_sensor.wohnzimmer_wandthermostat_1_battery',
'on') else 'green' }}; }
- type: custom:template-entity-row
entity: binary_sensor.badezimmer_fensterkontakt_1_battery
name: Fensterkontakt Badezimmer
state: " "
secondary: >-
Status: {{ 'Schwach' if
is_state('binary_sensor.badezimmer_fensterkontakt_1_battery',
'on') else 'OK' }}
card_mod:
style: >
state-badge { color: {{ 'red' if
is_state('binary_sensor.badezimmer_fensterkontakt_1_battery',
'on') else 'green' }}; }
- type: custom:template-entity-row
entity: binary_sensor.haustur_batteriestand
name: Kamera Haustür
state: " "
secondary: >-
Status: {{ 'Schwach' if
is_state('binary_sensor.haustur_batteriestand', 'on') else
'OK' }}
card_mod:
style: >
state-badge { color: {{ 'red' if
is_state('binary_sensor.haustur_batteriestand', 'on') else
'green' }}; }
- type: custom:template-entity-row
entity: binary_sensor.outdoor_batteriestand
name: Kamera Outdoor 1
state: " "
secondary: >-
Status: {{ 'Schwach' if
is_state('binary_sensor.outdoor_batteriestand', 'on') else
'OK' }}
card_mod:
style: >
state-badge { color: {{ 'red' if
is_state('binary_sensor.outdoor_batteriestand', 'on') else
'green' }}; }
- type: custom:template-entity-row
entity: binary_sensor.outdoor_2_batteriestand
name: Kamera Outdoor 2
state: " "
secondary: >-
Status: {{ 'Schwach' if
is_state('binary_sensor.outdoor_2_batteriestand', 'on') else
'OK' }}
card_mod:
style: >
state-badge { color: {{ 'red' if
is_state('binary_sensor.outdoor_2_batteriestand', 'on') else
'green' }}; }
- type: custom:template-entity-row
entity: sensor.0xa4c138da66acc759_battery
name: Bewegungsmelder Tablet
state: " "
secondary: >-
Ladezustand: {{ states('sensor.0xa4c138da66acc759_battery')
}}%
card_mod:
style: >
state-badge { color: {{ 'green' if
states('sensor.0xa4c138da66acc759_battery')|float(0) > 50
else 'orange' if
states('sensor.0xa4c138da66acc759_battery')|float(0) > 20
else 'red' }}; }
- type: custom:template-entity-row
entity: sensor.0xa4c138e43bd441af_battery
name: Bewegungsmelder Flur
state: " "
secondary: >-
Ladezustand: {{ states('sensor.0xa4c138e43bd441af_battery')
}}%
card_mod:
style: >
state-badge { color: {{ 'green' if
states('sensor.0xa4c138e43bd441af_battery')|float(0) > 50
else 'orange' if
states('sensor.0xa4c138e43bd441af_battery')|float(0) > 20
else 'red' }}; }
- type: custom:template-entity-row
entity: sensor.bewegungsmelder_buro_battery
name: Bewegungsmelder Büro
state: " "
secondary: >-
Ladezustand: {{ states('sensor.bewegungsmelder_buro_battery')
}}%
card_mod:
style: >
state-badge { color: {{ 'green' if
states('sensor.bewegungsmelder_buro_battery')|float(0) > 50
else 'orange' if
states('sensor.bewegungsmelder_buro_battery')|float(0) > 20
else 'red' }}; }
- type: custom:template-entity-row
entity: sensor.kuchenlicht_schalter_battery
name: Lichtschalter Küche
state: " "
secondary: >-
Ladezustand: {{ states('sensor.kuchenlicht_schalter_battery')
}}%
card_mod:
style: >
state-badge { color: {{ 'green' if
states('sensor.kuchenlicht_schalter_battery')|float(0) > 50
else 'orange' if
states('sensor.kuchenlicht_schalter_battery')|float(0) > 20
else 'red' }}; }
- type: custom:template-entity-row
entity: sensor.schalter_kuchenzeile_battery
name: Schalter Küchenzeile
state: " "
secondary: >-
Ladezustand: {{ states('sensor.schalter_kuchenzeile_battery')
}}%
card_mod:
style: >
state-badge { color: {{ 'green' if
states('sensor.schalter_kuchenzeile_battery')|float(0) > 50
else 'orange' if
states('sensor.schalter_kuchenzeile_battery')|float(0) > 20
else 'red' }}; }
view_layout:
grid-column: 18 / span 2
grid-row: 150 / span 20
- type: custom:bubble-card
view_layout:
grid-column: 18 / span 2
grid-row: 99 / span 20
card_type: pop-up
hash: "#Heizung"
name: Heizungssteuerung
show_header: false
button_type: name
sub_button:
main: []
bottom: []
slider_fill_orientation: left
slider_value_position: right
cards:
- type: custom:bubble-card
card_type: climate
entity: climate.lebensraum_wandthermostat_1
name: Küche
button_type: switch
icon: mdi:heating-coil
show_state: true
show_attribute: true
attribute: current_temperature
min_temp: 10
max_temp: 22
hide_temperature: false
state_color: false
show_icon: true
scrolling_effect: true
sub_button:
- name: HVAC modes menu
select_attribute: hvac_modes
state_background: false
show_arrow: false
show_state: false
modules:
- frosted_glass
frosted_glass:
icon_background: light
background:
- 112
- 107
- 107
main_shadow: true
styles: |
.bubble-icon-container {
{% set ist = state_attr('climate.lebensraum_wandthermostat_1', 'current_temperature') | float(-1) %}
{% set soll = state_attr('climate.lebensraum_wandthermostat_1', 'temperature') | float(-1) %}
{% if ist != -1 and soll != -1 and ist < (soll - 0.5) %}
background-color: rgba(255, 152, 0, 0.25) !important;
{% else %}
background-color: rgba(112, 107, 107, 0.3) !important;
{% endif %}
}
.bubble-icon {
{% set ist = state_attr('climate.lebensraum_wandthermostat_1', 'current_temperature') | float(-1) %}
{% set soll = state_attr('climate.lebensraum_wandthermostat_1', 'temperature') | float(-1) %}
{% if ist != -1 and soll != -1 and ist < (soll - 0.5) %}
color: rgb(255, 152, 0) !important;
{% else %}
color: rgb(150, 150, 150) !important;
{% endif %}
}
- type: custom:bubble-card
card_type: climate
entity: climate.wohnzimmer
name: Wohnzimmer
button_type: switch
icon: mdi:heating-coil
show_state: true
show_attribute: true
attribute: current_temperature
min_temp: 10
max_temp: 22
hide_temperature: false
state_color: false
show_icon: true
scrolling_effect: true
sub_button:
- name: HVAC modes menu
select_attribute: hvac_modes
state_background: false
show_arrow: false
show_state: false
modules:
- frosted_glass
frosted_glass:
icon_background: light
background:
- 112
- 107
- 107
main_shadow: true
styles: |
.bubble-icon-container {
{% set ist = state_attr('climate.wohnzimmer', 'current_temperature') | float(-1) %}
{% set soll = state_attr('climate.wohnzimmer', 'temperature') | float(-1) %}
{% if ist != -1 and soll != -1 and ist < (soll - 0.5) %}
background-color: rgba(255, 152, 0, 0.25) !important;
{% else %}
background-color: rgba(112, 107, 107, 0.3) !important;
{% endif %}
}
.bubble-icon {
{% set ist = state_attr('climate.wohnzimmer', 'current_temperature') | float(-1) %}
{% set soll = state_attr('climate.wohnzimmer', 'temperature') | float(-1) %}
{% if ist != -1 and soll != -1 and ist < (soll - 0.5) %}
color: rgb(255, 152, 0) !important;
{% else %}
color: rgb(150, 150, 150) !important;
{% endif %}
}
- type: custom:bubble-card
card_type: climate
entity: climate.badezimmer_wandthermostat_1
name: Badezimmer
button_type: switch
icon: mdi:heating-coil
show_state: true
show_attribute: true
attribute: current_temperature
min_temp: 10
max_temp: 22
hide_temperature: false
state_color: false
show_icon: true
scrolling_effect: true
sub_button:
- name: HVAC modes menu
select_attribute: hvac_modes
state_background: false
show_arrow: false
show_state: false
modules:
- frosted_glass
frosted_glass:
icon_background: light
background:
- 112
- 107
- 107
main_shadow: true
styles: |
.bubble-icon-container {
{% set ist = state_attr('climate.badezimmer_wandthermostat_1', 'current_temperature') | float(-1) %}
{% set soll = state_attr('climate.badezimmer_wandthermostat_1', 'temperature') | float(-1) %}
{% if ist != -1 and soll != -1 and ist < (soll - 0.5) %}
background-color: rgba(255, 152, 0, 0.25) !important;
{% else %}
background-color: rgba(112, 107, 107, 0.3) !important;
{% endif %}
}
.bubble-icon {
{% set ist = state_attr('climate.badezimmer_wandthermostat_1', 'current_temperature') | float(-1) %}
{% set soll = state_attr('climate.badezimmer_wandthermostat_1', 'temperature') | float(-1) %}
{% if ist != -1 and soll != -1 and ist < (soll - 0.5) %}
color: rgb(255, 152, 0) !important;
{% else %}
color: rgb(150, 150, 150) !important;
{% endif %}
}
- type: custom:bubble-card
card_type: climate
entity: climate.kleiderraum_wandthermostat_1
name: Flur
button_type: switch
icon: mdi:heating-coil
show_state: true
show_attribute: true
attribute: current_temperature
min_temp: 10
max_temp: 22
hide_temperature: false
state_color: false
show_icon: true
scrolling_effect: true
sub_button:
- name: HVAC modes menu
select_attribute: hvac_modes
state_background: false
show_arrow: false
show_state: false
modules:
- frosted_glass
frosted_glass:
icon_background: light
background:
- 112
- 107
- 107
main_shadow: true
styles: |
.bubble-icon-container {
{% set ist = state_attr('climate.kleiderraum_wandthermostat_1', 'current_temperature') | float(-1) %}
{% set soll = state_attr('climate.kleiderraum_wandthermostat_1', 'temperature') | float(-1) %}
{% if ist != -1 and soll != -1 and ist < (soll - 0.5) %}
background-color: rgba(255, 152, 0, 0.25) !important;
{% else %}
background-color: rgba(112, 107, 107, 0.3) !important;
{% endif %}
}
.bubble-icon {
{% set ist = state_attr('climate.kleiderraum_wandthermostat_1', 'current_temperature') | float(-1) %}
{% set soll = state_attr('climate.kleiderraum_wandthermostat_1', 'temperature') | float(-1) %}
{% if ist != -1 and soll != -1 and ist < (soll - 0.5) %}
color: rgb(255, 152, 0) !important;
{% else %}
color: rgb(150, 150, 150) !important;
{% endif %}
}
- type: custom:bubble-card
card_type: climate
entity: climate.schlafzimmer_wandthermostat_1
name: Schlafzimmer
button_type: switch
icon: mdi:heating-coil
show_state: true
show_attribute: true
attribute: current_temperature
min_temp: 10
max_temp: 22
hide_temperature: false
state_color: false
show_icon: true
scrolling_effect: true
sub_button:
- name: HVAC modes menu
select_attribute: hvac_modes
state_background: false
show_arrow: false
show_state: false
modules:
- frosted_glass
frosted_glass:
icon_background: light
background:
- 112
- 107
- 107
main_shadow: true
styles: |
.bubble-icon-container {
{% set ist = state_attr('climate.schlafzimmer_wandthermostat_1', 'current_temperature') | float(-1) %}
{% set soll = state_attr('climate.schlafzimmer_wandthermostat_1', 'temperature') | float(-1) %}
{% if ist != -1 and soll != -1 and ist < (soll - 0.5) %}
background-color: rgba(255, 152, 0, 0.25) !important;
{% else %}
background-color: rgba(112, 107, 107, 0.3) !important;
{% endif %}
}
.bubble-icon {
{% set ist = state_attr('climate.schlafzimmer_wandthermostat_1', 'current_temperature') | float(-1) %}
{% set soll = state_attr('climate.schlafzimmer_wandthermostat_1', 'temperature') | float(-1) %}
{% if ist != -1 and soll != -1 and ist < (soll - 0.5) %}
color: rgb(255, 152, 0) !important;
{% else %}
color: rgb(150, 150, 150) !important;
{% endif %}
}
- type: custom:bubble-card
card_type: climate
entity: climate.flur_thermostat_1
name: Wintergarten
button_type: switch
icon: mdi:heating-coil
show_state: true
show_attribute: true
attribute: current_temperature
min_temp: 10
max_temp: 22
hide_temperature: false
state_color: false
show_icon: true
scrolling_effect: true
sub_button:
- name: HVAC modes menu
select_attribute: hvac_modes
state_background: false
show_arrow: false
show_state: false
modules:
- frosted_glass
frosted_glass:
icon_background: light
background:
- 112
- 107
- 107
main_shadow: true
styles: |
.bubble-icon-container {
{% set ist = state_attr('climate.flur_thermostat_1', 'current_temperature') | float(-1) %}
{% set soll = state_attr('climate.flur_thermostat_1', 'temperature') | float(-1) %}
{% if ist != -1 and soll != -1 and ist < (soll - 0.5) %}
background-color: rgba(255, 152, 0, 0.25) !important;
{% else %}
background-color: rgba(112, 107, 107, 0.3) !important;
{% endif %}
}
.bubble-icon {
{% set ist = state_attr('climate.flur_thermostat_1', 'current_temperature') | float(-1) %}
{% set soll = state_attr('climate.flur_thermostat_1', 'temperature') | float(-1) %}
{% if ist != -1 and soll != -1 and ist < (soll - 0.5) %}
color: rgb(255, 152, 0) !important;
{% else %}
color: rgb(150, 150, 150) !important;
{% endif %}
}
- type: custom:bubble-card
card_type: climate
entity: climate.laube_wohnbereich_wandthermostat_1
name: Laube Wohnbereich
button_type: switch
icon: mdi:heating-coil
show_state: true
show_attribute: true
attribute: current_temperature
min_temp: 10
max_temp: 22
hide_temperature: false
state_color: false
show_icon: true
scrolling_effect: true
sub_button:
- name: HVAC modes menu
select_attribute: hvac_modes
state_background: false
show_arrow: false
show_state: false
modules:
- frosted_glass
frosted_glass:
icon_background: light
background:
- 112
- 107
- 107
main_shadow: true
styles: |
.bubble-icon-container {
{% set ist = state_attr('climate.laube_wohnbereich_wandthermostat_1', 'current_temperature') | float(-1) %}
{% set soll = state_attr('climate.laube_wohnbereich_wandthermostat_1', 'temperature') | float(-1) %}
{% if ist != -1 and soll != -1 and ist < (soll - 0.5) %}
background-color: rgba(255, 152, 0, 0.25) !important;
{% else %}
background-color: rgba(112, 107, 107, 0.3) !important;
{% endif %}
}
.bubble-icon {
{% set ist = state_attr('climate.laube_wohnbereich_wandthermostat_1', 'current_temperature') | float(-1) %}
{% set soll = state_attr('climate.laube_wohnbereich_wandthermostat_1', 'temperature') | float(-1) %}
{% if ist != -1 and soll != -1 and ist < (soll - 0.5) %}
color: rgb(255, 152, 0) !important;
{% else %}
color: rgb(150, 150, 150) !important;
{% endif %}
}
- type: custom:bubble-card
card_type: climate
entity: climate.laube_schlafzimmer_thermostat_1
name: Laube Schlafzimmer
button_type: switch
icon: mdi:heating-coil
show_state: true
show_attribute: true
attribute: current_temperature
min_temp: 10
max_temp: 22
hide_temperature: false
state_color: false
show_icon: true
scrolling_effect: true
sub_button:
- name: HVAC modes menu
select_attribute: hvac_modes
state_background: false
show_arrow: false
show_state: false
modules:
- frosted_glass
frosted_glass:
icon_background: light
background:
- 112
- 107
- 107
main_shadow: true
styles: |
.bubble-icon-container {
{% set ist = state_attr('climate.laube_schlafzimmer_thermostat_1', 'current_temperature') | float(-1) %}
{% set soll = state_attr('climate.laube_schlafzimmer_thermostat_1', 'temperature') | float(-1) %}
{% if ist != -1 and soll != -1 and ist < (soll - 0.5) %}
background-color: rgba(255, 152, 0, 0.25) !important;
{% else %}
background-color: rgba(112, 107, 107, 0.3) !important;
{% endif %}
}
.bubble-icon {
{% set ist = state_attr('climate.laube_schlafzimmer_thermostat_1', 'current_temperature') | float(-1) %}
{% set soll = state_attr('climate.laube_schlafzimmer_thermostat_1', 'temperature') | float(-1) %}
{% if ist != -1 and soll != -1 and ist < (soll - 0.5) %}
color: rgb(255, 152, 0) !important;
{% else %}
color: rgb(150, 150, 150) !important;
{% endif %}
}
- type: history-graph
entities:
- entity: switch.heizung_shellyplus1
name: Wolf GG EK
hours_to_show: 24
title: Heizaktivität (24h)
- type: custom:mushroom-chips-card
chips:
- type: template
icon: |
{% set shelly = states('switch.heizung_shellyplus1') %}
{% if shelly in ['unavailable', 'unknown'] %}
mdi:alert-circle
{% elif is_state('switch.heizung_shellyplus1', 'on') %}
mdi:fire
{% else %}
mdi:shield-check
{% endif %}
icon_color: |
{% set shelly = states('switch.heizung_shellyplus1') %}
{% if shelly in ['unavailable', 'unknown'] %}
red
{% elif is_state('switch.heizung_shellyplus1', 'on') %}
orange
{% else %}
green
{% endif %}
content: >
{% set shelly = states('switch.heizung_shellyplus1') %}
{% set liter = states('sensor.gasverbrauch_in_litern_2') |
float(0) %}
{% set thermostats = [
'climate.lebensraum_wandthermostat_1', 'climate.wohnzimmer',
'climate.badezimmer_wandthermostat_1', 'climate.kleiderraum_wandthermostat_1',
'climate.schlafzimmer_wandthermostat_1', 'climate.flur_thermostat_1',
'climate.laube_wohnbereich_wandthermostat_1', 'climate.laube_schlafzimmer_thermostat_1'
] %}
{% set offline = expand(thermostats) | selectattr('state',
'in', ['unavailable', 'unknown']) | list | count %}
{% if shelly in ['unavailable', 'unknown'] %}
Shelly FEHLER
{% elif offline > 0 %}
{{ offline }} Sensoren weg
{% else %}
System OK • {{ liter | round(1) }} L heute
{% endif %}
tap_action:
action: more-info
hold_action:
action: none
double_tap_action:
action: none
entity: sensor.gasverbrauch_in_litern_2
- type: entity
entity: sensor.temperatur_sensor_lager_temperature
name: Lager Temperatur
alignment: start
- type: custom:button-card
view_layout:
grid-column: 2 / 18
grid-row: 1 / span 10
entity: sun.sun
show_name: false
show_state: false
show_icon: false
tap_action:
action: fire-dom-event
browser_mod:
service: browser_mod.popup
data:
title: Google Kalender
size: wide
content:
type: custom:calendar-card-pro
entities:
- entity: calendar.dertimos_gmail_com
- entity: calendar.geburtstage
- entity: calendar.feiertage_in_deutschland
- entity: calendar.kalenderwochen
days_to_show: 30
default_view: list
weather:
entity: weather.forecast_home
position: date
date:
show_conditions: true
show_high_temp: true
show_low_temp: false
icon_size: 14px
font_size: 12px
color: var(--primary-text-color)
event:
show_conditions: true
show_temp: true
icon_size: 14px
font_size: 12px
color: var(--primary-text-color)
tap_action:
action: expand
hold_action:
action: more-info
grid_options:
columns: 16
rows: 8
styles:
card:
- background: rgba(0, 0, 0, 0.1)
- border: 1px solid rgba(255, 255, 255, 0.1)
- border-radius: 12px
- height: 40px !important
- min-height: 40px !important
- max-height: 40px !important
- position: relative
- padding: 0px
- overflow: hidden
- cursor: pointer
custom_fields:
uhr:
- position: absolute
- left: 20px
- top: 50%
- transform: translateY(-50%)
- width: auto
- pointer-events: none
datum:
- position: absolute
- right: 20px
- top: 50%
- transform: translateY(-50%)
- font-size: 1.3rem
- font-weight: 300
- color: white
- white-space: nowrap
- pointer-events: none
custom_fields:
uhr:
card:
type: custom:font-clock-card
font_name: san-serif
font_weight: "300"
font_size: 1.5rem
format: HH:mm
align: left
show_icon: false
card_mod:
style: |
ha-card {
background: none !important;
border: none !important;
box-shadow: none !important;
}
datum: |
[[[ return states['sensor.dashboard_datum'].state ]]]
- type: custom:weather-chart-card
view_layout:
grid-column: 2 / span 8
grid-row: 10 / span 31
grid_options:
columns: 8
rows: 31
entity: weather.forecast_home
show_main: true
show_temperature: true
show_current_condition: true
show_attributes: false
show_time: false
show_time_seconds: false
show_day: false
show_date: false
show_humidity: false
show_pressure: false
show_wind_direction: false
show_wind_speed: false
show_sun: false
show_feels_like: false
show_dew_point: false
show_wind_gust_speed: false
show_visibility: false
show_last_changed: false
use_12hour_format: false
icons_size: "19"
animated_icons: false
icon_style: style1
autoscroll: true
forecast:
precipitation_type: rainfall
show_probability: false
labels_font_size: "11"
precip_bar_size: "100"
style: style2
show_wind_forecast: true
condition_icons: true
round_temp: false
type: daily
number_of_forecasts: "0"
disable_animation: false
current_temp_size: "24"
- type: custom:power-flow-card-plus
entities:
battery:
state_of_charge: sensor.solarbank_3_e2700_pro_ladestand
use_separated_entities: true
entity:
consumption: sensor.solarbank_3_e2700_pro_entladeleistung
production: sensor.solarbank_3_e2700_pro_aufladeleistung
grid:
entity:
consumption: sensor.smart_meter_netzbezug
production: sensor.smart_meter_netzeinspeisung
solar:
entity: sensor.solarbank_3_e2700_pro_solarleistung
display_zero_state: true
home:
entity: sensor.solarbank_3_e2700_pro_hausbedarf
override_state: true
subtract_individual: false
tap_action:
action: call-service
service: script.trigger_anker_echtzeit
clickable_entities: true
display_zero_lines: true
use_new_flow_rate_model: true
base_decimals: 0
kilo_decimals: 1
view_layout:
grid-column: 10 / span 8
grid-row: 10 / span 31
card_mod:
style: |
ha-card {
height: 325px !important; /* Fixer Wert für dein Wallpanel */
display: flex !important;
align-items: center;
justify-content: center;
overflow: hidden;
background: transparent !important; /* Optional, falls Overlay drunter liegt */
}
.card-content {
transform: scale(0.90);
width: 100%;
}
- type: custom:button-card
card_mod:
style: |
ha-card {
border: none !important;
box-shadow: none !important;
background: none !important;
backdrop-filter: none !important;
--ha-card-border-width: 0px !important;
}
ha-card:after, ha-card:before { display: none !important; }
view_layout:
grid-column: 10 / span 1
grid-row: 9 / span 5
show_name: false
show_icon: false
show_state: false
styles:
card:
- background: transparent
- padding-left: 15px
- padding-top: 16px
- overflow: visible !important
grid:
- grid-template-areas: >-
"aufgang" "aufgang_zeit" "gap" "untergang" "untergang_zeit"
"line" "diff"
- grid-template-rows: auto auto 2px auto auto 10px auto
- justify-items: start
custom_fields:
aufgang:
- font-size: 10px
- color: rgba(255,255,255,0.6)
- white-space: nowrap
aufgang_zeit:
- font-size: 14px
- font-weight: bold
untergang:
- font-size: 10px
- color: rgba(255,255,255,0.6)
- white-space: nowrap
untergang_zeit:
- font-size: 14px
- font-weight: bold
line:
- width: 35px
- border-top: 1px solid rgba(255,255,255,0.3)
- height: 1px
- margin-top: 2px
diff:
- font-size: 11px
- color: rgba(255,255,255,0.8)
- margin-top: "-2px"
custom_fields:
aufgang: Sonnenaufgang
aufgang_zeit: |
[[[
const d = new Date(states['sensor.sun_next_rising'].state);
return d.getHours().toString().padStart(2, '0') + ':' + d.getMinutes().toString().padStart(2, '0');
]]]
untergang: Sonnenuntergang
untergang_zeit: |
[[[
const d = new Date(states['sensor.sun_next_setting'].state);
return d.getHours().toString().padStart(2, '0') + ':' + d.getMinutes().toString().padStart(2, '0');
]]]
line: " "
diff: |
[[[
const s = states['sensor.home_sun_daylight'];
if (!s || !s.attributes.today || !s.attributes.yesterday) return '';
const diffMinTotal = (s.attributes.today - s.attributes.yesterday) * 60;
const absMinTotal = Math.abs(diffMinTotal);
const m = Math.floor(absMinTotal);
const s_rest = Math.round((absMinTotal - m) * 60);
const sign = diffMinTotal > 0 ? '+ ' : '- ';
return sign + m + ':' + s_rest.toString().padStart(2, '0') + ' Min. Licht';
]]]
- type: custom:button-card
triggers_update:
- sensor.hausbedarf_energie_heute
- sensor.taglicher_netzbezug
- number.solarbank_3_e2700_pro_tarifpreis_kwh
card_mod:
style: |
ha-card {
border: none !important;
box-shadow: none !important;
background: none !important;
--ha-card-border-width: 0px !important;
}
ha-card:after, ha-card:before { display: none !important; }
view_layout:
grid-column: 16 / span 2
grid-row: 9 / span 5
tap_action:
action: fire-dom-event
browser_mod:
service: browser_mod.popup
data:
title: Energie-Statistiken
size: wide
content:
type: vertical-stack
cards:
- type: heading
heading: Energie-Historie (Letzte 7 Tage)
- type: statistics-graph
entities:
- sensor.hausbedarf_energie_heute
- sensor.taglicher_netzbezug
chart_type: bar
period: day
days_to_show: 7
stat_types:
- change
- type: heading
heading: Live-Verlauf (24h)
- type: history-graph
entities:
- sensor.hausbedarf_energie_heute
- sensor.taglicher_netzbezug
hours_to_show: 24
refresh_interval: 0
show_name: false
show_icon: false
show_state: false
styles:
card:
- background: transparent
- padding-right: 15px
- padding-top: 16px
- overflow: visible !important
- cursor: pointer
grid:
- grid-template-areas: >-
"autarkie" "autarkie_wert" "gap" "ersparnis" "ersparnis_wert"
"line" "diff"
- grid-template-rows: auto auto 2px auto auto 10px auto
- justify-items: end
custom_fields:
autarkie:
- font-size: 10px
- color: rgba(255,255,255,0.6)
autarkie_wert:
- font-size: 14px
- font-weight: bold
ersparnis:
- font-size: 10px
- color: rgba(255,255,255,0.6)
ersparnis_wert:
- font-size: 14px
- font-weight: bold
line:
- width: 35px
- border-top: 1px solid rgba(255,255,255,0.3)
- height: 1px
- margin-top: 2px
diff:
- font-size: 11px
- color: rgba(255,255,255,0.8)
custom_fields:
autarkie: Autarkie heute
autarkie_wert: |
[[[
const s1 = states['sensor.hausbedarf_energie_heute'];
const s2 = states['sensor.taglicher_netzbezug'];
if (!s1 || !s2 || s1.state === 'unavailable' || s2.state === 'unavailable' || s1.state === 'unknown') return '...';
const verbrauch = parseFloat(s1.state) || 0;
const netz = parseFloat(s2.state) || 0;
if (verbrauch <= 0) return '0.0 %';
const autarkie = ((verbrauch - netz) / verbrauch) * 100;
return Math.max(0, Math.min(100, autarkie)).toFixed(1) + ' %';
]]]
ersparnis: Ersparnis heute
ersparnis_wert: |
[[[
const s1 = states['sensor.hausbedarf_energie_heute'];
const s2 = states['sensor.taglicher_netzbezug'];
const sp = states['number.solarbank_3_e2700_pro_tarifpreis_kwh'];
if (!s1 || !s2 || s1.state === 'unavailable' || s2.state === 'unavailable') return '...';
const verbrauch = parseFloat(s1.state) || 0;
const netz = parseFloat(s2.state) || 0;
const eigenverbrauch = Math.max(0, verbrauch - netz);
const preis = (parseFloat(sp?.state) || 32) / 100;
return (eigenverbrauch * preis).toFixed(2) + ' €';
]]]
line: " "
diff: |
[[[
const s1 = states['sensor.hausbedarf_energie_heute'];
const s2 = states['sensor.taglicher_netzbezug'];
if (!s1 || !s2 || s1.state === 'unavailable' || s2.state === 'unavailable') return '...';
const verbrauch = parseFloat(s1.state) || 0;
const netz = parseFloat(s2.state) || 0;
const eigenverbrauch = Math.max(0, verbrauch - netz);
return eigenverbrauch.toFixed(2) + ' kWh';
]]]
- type: custom:button-card
card_mod:
style: |
ha-card {
border: none !important;
box-shadow: none !important;
background: none !important;
backdrop-filter: none !important;
--ha-card-border-width: 0px !important;
}
ha-card:after, ha-card:before { display: none !important; }
view_layout:
grid-column: 10 / span 1
grid-row: 48 / span 5
show_name: false
show_icon: false
show_state: false
styles:
card:
- background: transparent
- padding-left: 15px
- padding-bottom: 17px
- overflow: visible !important
grid:
- grid-template-areas: >-
"uv_label" "uv_wert" "gap" "prog_label" "prog_wert" "line"
"info"
- grid-template-rows: auto auto 2px auto auto 10px auto
- justify-items: start
custom_fields:
uv_label:
- font-size: 10px
- color: rgba(255,255,255,0.6)
uv_wert:
- font-size: 12px
- font-weight: bold
prog_label:
- font-size: 10px
- color: rgba(255,255,255,0.6)
prog_wert:
- font-size: 12px
- font-weight: bold
line:
- width: 35px
- border-top: 1px solid rgba(255,255,255,0.3)
- height: 1px
- margin-top: 2px
info:
- font-size: 11px
- color: rgba(255,255,255,0.8)
- margin-top: "-2px"
custom_fields:
uv_label: UV-Index
uv_wert: |
[[[
const uv = states['weather.forecast_home']?.attributes?.uv_index;
return uv !== undefined ? uv : '0';
]]]
prog_label: Solar Vorschau
prog_wert: |
[[[
const p = states['sensor.solar_vorhersage_gesamt']?.state;
return p ? parseFloat(p).toFixed(2) + ' kWh' : '0 kWh';
]]]
line: " "
info: Vorhersage aktiv
- type: custom:button-card
card_mod:
style: |
ha-card {
border: none !important;
box-shadow: none !important;
background: none !important;
backdrop-filter: none !important;
--ha-card-border-width: 0px !important;
}
ha-card:after, ha-card:before { display: none !important; }
view_layout:
grid-column: 16 / span 2
grid-row: 48 / span 5
show_name: false
show_icon: false
show_state: false
styles:
card:
- background: transparent
- padding-right: 15px
- padding-bottom: 15px
- overflow: visible !important
grid:
- grid-template-areas: >-
"netz_kwh_label" "netz_kwh_wert" "gap" "netz_w_label"
"netz_w_wert" "line" "status"
- grid-template-rows: auto auto 2px auto auto 10px auto
- justify-items: end
custom_fields:
netz_kwh_label:
- font-size: 10px
- color: rgba(255,255,255,0.6)
netz_kwh_wert:
- font-size: 11px
- font-weight: bold
netz_w_label:
- font-size: 10px
- color: rgba(255,255,255,0.6)
netz_w_wert:
- font-size: 11px
- font-weight: bold
line:
- width: 35px
- border-top: 1px solid rgba(255,255,255,0.3)
- height: 1px
- margin-top: 2px
status:
- font-size: 11px
- margin-top: "-2px"
- color: |
[[[
return states['binary_sensor.solarbank_3_e2700_pro_wifi_verbindung']?.state === 'on'
? 'rgba(255,255,255,0.8)'
: '#ff5252';
]]]
custom_fields:
netz_kwh_label: Netzbezug heute
netz_kwh_wert: |
[[[
const s = states['sensor.taglicher_netzbezug'];
if (!s || s.state === 'unknown' || s.state === 'unavailable') return '0.00 kWh';
let val = parseFloat(s.state);
return val.toFixed(2) + ' kWh';
]]]
netz_w_label: Aktueller Bezug
netz_w_wert: |
[[[
const w = parseFloat(states['sensor.smart_meter_netzbezug']?.state) || 0;
// Falls der Wert negativ ist (Einspeisung), zeigen wir 0 W an
const anzeige = w < 0 ? 0 : w;
return anzeige.toFixed(0) + ' W';
]]]
line: " "
status: |
[[[
const wifi = states['binary_sensor.solarbank_3_e2700_pro_wifi_verbindung']?.state;
return wifi === 'on' ? 'WiFi: Online' : 'WiFi: Offline';
]]]
- type: custom:bubble-card
view_layout:
grid-column: 18 / span 2
grid-row: 77 / span 20
card_type: pop-up
hash: "#Rauchmelder"
show_icon: false
scrolling_effect: false
show_name: false
button_type: name
show_header: false
sub_button:
main: []
bottom: []
cards:
- type: entities
title: Rauchmelder
entities:
- type: custom:template-entity-row
entity: binary_sensor.rauchmelder_rauch
name: Wohnzimmer
state: (Test drücken)
icon: mdi:smoke-detector
secondary: >-
Status: {{ 'RAUCH!' if
is_state('binary_sensor.rauchmelder_rauch', 'on') else 'Frei'
}}
tap_action:
action: call-service
service: button.press
target:
entity_id: button.rauchmelder_none
card_mod:
style: >
div.secondary { color: {{ 'red' if
is_state('binary_sensor.rauchmelder_rauch', 'on') else
'green' }}; }
- type: custom:template-entity-row
entity: binary_sensor.rauchmelder_2_rauch
name: Küche
state: (Test drücken)
icon: mdi:smoke-detector
secondary: >-
Status: {{ 'RAUCH!' if
is_state('binary_sensor.rauchmelder_2_rauch', 'on') else
'Frei' }}
tap_action:
action: call-service
service: button.press
target:
entity_id: button.rauchmelder_2_none
card_mod:
style: >
div.secondary { color: {{ 'red' if
is_state('binary_sensor.rauchmelder_2_rauch', 'on') else
'green' }}; }
- type: custom:template-entity-row
entity: binary_sensor.rauchmelder_3_rauch
name: Flur
state: (Test drücken)
icon: mdi:smoke-detector
secondary: >-
Status: {{ 'RAUCH!' if
is_state('binary_sensor.rauchmelder_3_rauch', 'on') else
'Frei' }}
tap_action:
action: call-service
service: button.press
target:
entity_id: button.rauchmelder_3_none
card_mod:
style: >
div.secondary { color: {{ 'red' if
is_state('binary_sensor.rauchmelder_3_rauch', 'on') else
'green' }}; }
- type: custom:template-entity-row
entity: binary_sensor.rauchmelder_4_rauch
name: Lager
state: (Test drücken)
icon: mdi:smoke-detector
secondary: >-
Status: {{ 'RAUCH!' if
is_state('binary_sensor.rauchmelder_4_rauch', 'on') else
'Frei' }}
tap_action:
action: call-service
service: button.press
target:
entity_id: button.rauchmelder_4_none
card_mod:
style: >
div.secondary { color: {{ 'red' if
is_state('binary_sensor.rauchmelder_4_rauch', 'on') else
'green' }}; }
- type: custom:template-entity-row
entity: binary_sensor.rauchmelder_5_rauch
name: Laube
state: (Test drücken)
icon: mdi:smoke-detector
secondary: >-
Status: {{ 'RAUCH!' if
is_state('binary_sensor.rauchmelder_5_rauch', 'on') else
'Frei' }}
tap_action:
action: call-service
service: button.press
target:
entity_id: button.rauchmelder_5_none
card_mod:
style: >
div.secondary { color: {{ 'red' if
is_state('binary_sensor.rauchmelder_5_rauch', 'on') else
'green' }}; }
- type: custom:template-entity-row
entity: binary_sensor.rauchmelder_6_rauch
name: Holzlager
state: (Test drücken)
icon: mdi:smoke-detector
secondary: >-
Status: {{ 'RAUCH!' if
is_state('binary_sensor.rauchmelder_6_rauch', 'on') else
'Frei' }}
tap_action:
action: call-service
service: button.press
target:
entity_id: button.rauchmelder_6_none
card_mod:
style: >
div.secondary { color: {{ 'red' if
is_state('binary_sensor.rauchmelder_6_rauch', 'on') else
'green' }}; }
- type: custom:bubble-card
view_layout:
grid-column: 18 / span 2
grid-row: 124 / span 20
card_type: pop-up
hash: "#PflanzenNeu"
show_header: false
button_type: name
sub_button:
main: []
bottom: []
cards:
- type: entities
entities:
- type: custom:template-entity-row
entity: input_boolean.bewasserungs_automatik
name: Pflanzen Automatik
icon: mdi:water
active: "{{ is_state('input_boolean.bewasserungs_automatik', 'on') }}"
color: >-
{{ 'blue' if is_state('input_boolean.bewasserungs_automatik',
'on') else 'grey' }}
toggle: false
secondary: >-
Bewässerung {{ 'aktiv' if
is_state('input_boolean.bewasserungs_automatik', 'on') else
'aus' }}
tap_action:
action: call-service
service: input_boolean.toggle
target:
entity_id: input_boolean.bewasserungs_automatik
- type: entities
entities:
- type: custom:template-entity-row
entity: switch.steckdose_gartenpumpe_1
name: Gartenpumpe 1
icon: mdi:water
active: "{{ is_state('switch.steckdose_gartenpumpe_1', 'on') }}"
color: >-
{{ 'orange' if is_state('switch.steckdose_gartenpumpe_1',
'on') else 'grey' }}
toggle: true
secondary: >
aktuell: {{ states('sensor.steckdose_gartenpumpe_1_power') |
round(0) }} W gesamt: {{
states('sensor.steckdose_gartenpumpe_1_energy') | round(2) }}
kWh
card_mod:
style: |
div.secondary { white-space: pre-line; }
- type: custom:template-entity-row
entity: switch.steckdose_gartenpumpe_2
name: Gartenpumpe 2
icon: mdi:water
active: "{{ is_state('switch.steckdose_gartenpumpe_2', 'on') }}"
color: >-
{{ 'orange' if is_state('switch.steckdose_gartenpumpe_2',
'on') else 'grey' }}
toggle: true
secondary: >
aktuell: {{ states('sensor.steckdose_gartenpumpe_2_power') |
round(0) }} W gesamt: {{
states('sensor.steckdose_gartenpumpe_2_energy') | round(2) }}
kWh
card_mod:
style: |
div.secondary { white-space: pre-line; }
- type: custom:flower-card
entity: plant.garten_gemuse
battery_sensor: sensor.pflanzen_garten_gemuse_battery
show_bars:
- moisture
- temperature
- humidity
name: Gemüsebeet
- type: entities
entities:
- type: custom:template-entity-row
entity: switch.bewasserungscomputer_1
name: Gemüsebeet
icon: mdi:water-pump
active: "{{ is_state('switch.bewasserungscomputer_1', 'on') }}"
color: >-
{{ 'blue' if is_state('switch.bewasserungscomputer_1', 'on')
else 'grey' }}
toggle: false
secondary: >-
{{ 'Gießt...' if is_state('switch.bewasserungscomputer_1',
'on') else 'Aus' }}
tap_action:
action: call-service
service: script.gemusebeet
- entity: input_number.bewasserungszeit_gemusebeet
name: Dauer Gemüsebeet
- type: custom:flower-card
entity: plant.beerengarten
battery_sensor: sensor.pflanzen_garten_beerenbeet_battery
show_bars:
- moisture
- conductivity
- temperature
- illuminance
- humidity
- dli
- type: entities
entities:
- type: custom:template-entity-row
entity: switch.bewasserungscomputer_3
name: Beerengarten
icon: mdi:water-pump
active: "{{ is_state('switch.bewasserungscomputer_3', 'on') }}"
color: >-
{{ 'blue' if is_state('switch.bewasserungscomputer_3', 'on')
else 'grey' }}
toggle: false
secondary: >-
{{ 'Gießt...' if is_state('switch.bewasserungscomputer_3',
'on') else 'Aus' }}
tap_action:
action: call-service
service: script.beerengarten
- entity: input_number.bewasserungszeit_beerengarten
name: Dauer Beerengarten
- type: custom:flower-card
entity: plant.blumenwiese
battery_sensor: sensor.pflanzen_blumenwiese_battery
show_bars:
- moisture
- conductivity
- temperature
- illuminance
- humidity
- dli
- type: entities
entities:
- type: custom:template-entity-row
entity: switch.bewasserungscomputer_2
name: Blumenwiese
icon: mdi:water-pump
active: "{{ is_state('switch.bewasserungscomputer_2', 'on') }}"
color: >-
{{ 'blue' if is_state('switch.bewasserungscomputer_2', 'on')
else 'grey' }}
toggle: false
secondary: >-
{{ 'Gießt...' if is_state('switch.bewasserungscomputer_2',
'on') else 'Aus' }}
tap_action:
action: call-service
service: script.blumenwiese
- entity: input_number.bewasserungszeit_blumenwiese
name: Dauer Blumenwiese
- type: custom:flower-card
entity: plant.rot_ahorn
battery_sensor: sensor.pflanzen_garten_pumpe_2_battery
show_bars:
- moisture
- conductivity
- temperature
- illuminance
- humidity
- dli
- type: entities
entities:
- type: custom:template-entity-row
entity: switch.steckdose_gartenpumpe_2
name: Rot-Ahorn
icon: mdi:water-pump
active: "{{ is_state('switch.steckdose_gartenpumpe_2', 'on') }}"
color: >-
{{ 'blue' if is_state('switch.steckdose_gartenpumpe_2', 'on')
else 'grey' }}
toggle: false
secondary: >-
{{ 'Gießt...' if is_state('switch.steckdose_gartenpumpe_2',
'on') else 'Aus' }}
tap_action:
action: call-service
service: script.manuell_giesen_pumpe_2_direkt
- entity: input_number.bewasserungszeit_rot_ahorn
name: Dauer Rot-Ahorn
- type: custom:flower-card
entity: plant.badezimmer
battery_sensor: sensor.0xa4c13886bf2d955c_battery
show_bars:
- moisture
- conductivity
- temperature
- illuminance
- humidity
- dli
- type: custom:flower-card
entity: plant.wintergarten
battery_sensor: sensor.pfanzen_wintergarten_2_battery
show_bars:
- moisture
- temperature
- humidity
- type: custom:flower-card
entity: plant.wohnzimmer
battery_sensor: sensor.planzen_wohnzimmer_battery
show_bars:
- moisture
- temperature
- humidity
- type: custom:bubble-card
view_layout:
grid-column: 18 / span 2
grid-row: 20 / span 20
card_type: pop-up
hash: "#GartenKamera"
button_type: name
show_header: false
name: Garten Kamera
sub_button:
main: []
bottom: []
cards:
- type: tile
entity: automation.reolink_zu_echo_show_pro_push_video_ton_schalter
name: Überwachung
icon: mdi:camera
tap_action:
action: toggle
grid_options:
columns: 6
- type: tile
entity: input_boolean.kamera_garten_modus_tag_nacht
name: Tag-Modus
icon: mdi:sun-clock
tap_action:
action: toggle
grid_options:
columns: 6
- type: entities
title: Kameraeinstellungen
show_header_toggle: false
entities:
- type: section
label: Steuerung
- entity: button.garten_gehe_zu_startposition
name: Startposition anfahren
- entity: select.garten_ptz_voreinstellung
name: Voreinstellung wählen
- entity: number.garten_zoom
name: Zoom-Stufe
- entity: switch.garten_automatisches_tracking
name: Auto-Tracking
state_color: true
- entity: switch.garten_autofokus
name: Autofokus
- type: section
label: Licht & Nachtsicht
- entity: light.garten_scheinwerfer
name: Scheinwerfer
- entity: select.garten_scheinwerfermodus
name: Scheinwerfer-Modus
- entity: switch.garten_infrarotlicht_im_nachtmodus
name: Infrarot-Licht
- entity: light.garten_status_led
name: Status LED
- type: section
label: Aufnahme & Alarm
- entity: switch.garten_aufzeichnen
name: Video-Aufzeichnung
- entity: switch.garten_audio_aufnehmen
name: Audio-Aufnahme
- entity: number.garten_lautstarke
name: Lautsprecher-Lautstärke
- entity: siren.garten_sirene
name: Sirene (Manuell)
- entity: switch.garten_sirene_bei_ereignis
name: Sirene bei Alarm
- type: section
label: Benachrichtigungen
- entity: switch.garten_push_benachrichtigungen
name: Push-Nachricht
- entity: switch.garten_e_mail_bei_ereignis
name: E-Mail Alarm
- type: section
label: KI-Empfindlichkeit
- entity: number.garten_bewegungsempfindlichkeit
name: Allgemein
- entity: number.garten_ki_personen_empfindlichkeit
name: Personen
- entity: number.garten_ki_tier_empfindlichkeit
name: Tiere
- entity: number.garten_ki_fahrzeug_empfindlichkeit
name: Fahrzeuge
- type: section
label: System-Info
- entity: sensor.garten_wlan_signal
name: WLAN Signalstärke
- type: custom:bubble-card
view_layout:
grid-column: 18 / span 2
grid-row: 220 / span 20
card_type: pop-up
hash: "#Batterien"
button_type: name
show_header: false
name: Batterien
sub_button:
main: []
bottom: []
cards:
- type: entities
title: Batteriestände
show_header_toggle: false
entities:
- type: section
label: Rauchmelder
- type: custom:template-entity-row
entity: sensor.rauchmelder_batterie
name: Wohnzimmer
state: " "
secondary: "Ladezustand: {{ states('sensor.rauchmelder_batterie') }}%"
card_mod:
style: >
state-badge { color: {{ 'green' if
states('sensor.rauchmelder_batterie')|float(0) > 50 else
'orange' if states('sensor.rauchmelder_batterie')|float(0) >
20 else 'red' }}; }
- type: custom:template-entity-row
entity: sensor.rauchmelder_2_batterie
name: Küche
state: " "
secondary: "Ladezustand: {{ states('sensor.rauchmelder_2_batterie') }}%"
card_mod:
style: >
state-badge { color: {{ 'green' if
states('sensor.rauchmelder_2_batterie')|float(0) > 50 else
'orange' if states('sensor.rauchmelder_2_batterie')|float(0)
> 20 else 'red' }}; }
- type: custom:template-entity-row
entity: sensor.rauchmelder_3_batterie
name: Flur
state: " "
secondary: "Ladezustand: {{ states('sensor.rauchmelder_3_batterie') }}%"
card_mod:
style: >
state-badge { color: {{ 'green' if
states('sensor.rauchmelder_3_batterie')|float(0) > 50 else
'orange' if states('sensor.rauchmelder_3_batterie')|float(0)
> 20 else 'red' }}; }
- type: custom:template-entity-row
entity: sensor.rauchmelder_4_batterie
name: Lager
state: " "
secondary: "Ladezustand: {{ states('sensor.rauchmelder_4_batterie') }}%"
card_mod:
style: >
state-badge { color: {{ 'green' if
states('sensor.rauchmelder_4_batterie')|float(0) > 50 else
'orange' if states('sensor.rauchmelder_4_batterie')|float(0)
> 20 else 'red' }}; }
- type: custom:template-entity-row
entity: sensor.rauchmelder_5_batterie
name: Laube
state: " "
secondary: "Ladezustand: {{ states('sensor.rauchmelder_5_batterie') }}%"
card_mod:
style: >
state-badge { color: {{ 'green' if
states('sensor.rauchmelder_5_batterie')|float(0) > 50 else
'orange' if states('sensor.rauchmelder_5_batterie')|float(0)
> 20 else 'red' }}; }
- type: custom:template-entity-row
entity: sensor.rauchmelder_6_batterie
name: Holz Lager
state: " "
secondary: "Ladezustand: {{ states('sensor.rauchmelder_6_batterie') }}%"
card_mod:
style: >
state-badge { color: {{ 'green' if
states('sensor.rauchmelder_6_batterie')|float(0) > 50 else
'orange' if states('sensor.rauchmelder_6_batterie')|float(0)
> 20 else 'red' }}; }
- type: section
label: Thermostate
- type: custom:template-entity-row
entity: binary_sensor.badezimmer_thermostat_1_battery
name: Badezimmer (Thermostat)
state: " "
secondary: >-
Status: {{ 'Schwach' if
is_state('binary_sensor.badezimmer_thermostat_1_battery',
'on') else 'OK' }}
card_mod:
style: >
state-badge { color: {{ 'red' if
is_state('binary_sensor.badezimmer_thermostat_1_battery',
'on') else 'green' }}; }
- type: custom:template-entity-row
entity: binary_sensor.badezimmer_wandthermostat_1_battery
name: Badezimmer (Wandthermostat)
state: " "
secondary: >-
Status: {{ 'Schwach' if
is_state('binary_sensor.badezimmer_wandthermostat_1_battery',
'on') else 'OK' }}
card_mod:
style: >
state-badge { color: {{ 'red' if
is_state('binary_sensor.badezimmer_wandthermostat_1_battery',
'on') else 'green' }}; }
- type: custom:template-entity-row
entity: binary_sensor.flur_thermostat_1_battery
name: Flur (Thermostat)
state: " "
secondary: >-
Status: {{ 'Schwach' if
is_state('binary_sensor.flur_thermostat_1_battery', 'on') else
'OK' }}
card_mod:
style: >
state-badge { color: {{ 'red' if
is_state('binary_sensor.flur_thermostat_1_battery', 'on')
else 'green' }}; }
- type: custom:template-entity-row
entity: binary_sensor.kleiderraum_wandthermostat_1_battery
name: Kleiderraum (Wandthermostat)
state: " "
secondary: >-
Status: {{ 'Schwach' if
is_state('binary_sensor.kleiderraum_wandthermostat_1_battery',
'on') else 'OK' }}
card_mod:
style: >
state-badge { color: {{ 'red' if
is_state('binary_sensor.kleiderraum_wandthermostat_1_battery',
'on') else 'green' }}; }
- type: custom:template-entity-row
entity: binary_sensor.laube_schlafzimmer_thermostat_1_battery
name: Laube Schlafzimmer (Thermostat)
state: " "
secondary: >-
Status: {{ 'Schwach' if
is_state('binary_sensor.laube_schlafzimmer_thermostat_1_battery',
'on') else 'OK' }}
card_mod:
style: >
state-badge { color: {{ 'red' if
is_state('binary_sensor.laube_schlafzimmer_thermostat_1_battery',
'on') else 'green' }}; }
- type: custom:template-entity-row
entity: binary_sensor.laube_wohnbereich_thermostat_2_battery
name: Laube Wohnbereich (Thermostat)
state: " "
secondary: >-
Status: {{ 'Schwach' if
is_state('binary_sensor.laube_wohnbereich_thermostat_2_battery',
'on') else 'OK' }}
card_mod:
style: >
state-badge { color: {{ 'red' if
is_state('binary_sensor.laube_schlafzimmer_thermostat_1_battery',
'on') else 'green' }}; }
- type: custom:template-entity-row
entity: binary_sensor.lebensraum_thermostat_1_battery
name: Lebensraum (Thermostat)
state: " "
secondary: >-
Status: {{ 'Schwach' if
is_state('binary_sensor.lebensraum_thermostat_1_battery',
'on') else 'OK' }}
card_mod:
style: >
state-badge { color: {{ 'red' if
is_state('binary_sensor.lebensraum_thermostat_1_battery',
'on') else 'green' }}; }
- type: custom:template-entity-row
entity: binary_sensor.lebensraum_wandthermostat_1_battery
name: Lebensraum (Wandthermostat)
state: " "
secondary: >-
Status: {{ 'Schwach' if
is_state('binary_sensor.lebensraum_wandthermostat_1_battery',
'on') else 'OK' }}
card_mod:
style: >
state-badge { color: {{ 'red' if
is_state('binary_sensor.lebensraum_wandthermostat_1_battery',
'on') else 'green' }}; }
- type: custom:template-entity-row
entity: binary_sensor.schlafzimmer_thermostat_1_battery
name: Schlafzimmer (Thermostat)
state: " "
secondary: >-
Status: {{ 'Schwach' if
is_state('binary_sensor.schlafzimmer_thermostat_1_battery',
'on') else 'OK' }}
card_mod:
style: >
state-badge { color: {{ 'red' if
is_state('binary_sensor.schlafzimmer_thermostat_1_battery',
'on') else 'green' }}; }
- type: custom:template-entity-row
entity: binary_sensor.schlafzimmer_wandthermostat_1_battery
name: Schlafzimmer (Wandthermostat)
state: " "
secondary: >-
Status: {{ 'Schwach' if
is_state('binary_sensor.schlafzimmer_wandthermostat_1_battery',
'on') else 'OK' }}
card_mod:
style: >
state-badge { color: {{ 'red' if
is_state('binary_sensor.schlafzimmer_wandthermostat_1_battery',
'on') else 'green' }}; }
- type: custom:template-entity-row
entity: binary_sensor.wohnzimmer_thermostat_1_battery
name: Wohnzimmer (Thermostat)
state: " "
secondary: >-
Status: {{ 'Schwach' if
is_state('binary_sensor.wohnzimmer_thermostat_1_battery',
'on') else 'OK' }}
card_mod:
style: >
state-badge { color: {{ 'red' if
is_state('binary_sensor.wohnzimmer_thermostat_1_battery',
'on') else 'green' }}; }
- type: custom:template-entity-row
entity: binary_sensor.wohnzimmer_wandthermostat_1_battery
name: Wohnzimmer (Wandthermostat)
state: " "
secondary: >-
Status: {{ 'Schwach' if
is_state('binary_sensor.wohnzimmer_wandthermostat_1_battery',
'on') else 'OK' }}
card_mod:
style: >
state-badge { color: {{ 'red' if
is_state('binary_sensor.wohnzimmer_wandthermostat_1_battery',
'on') else 'green' }}; }
- type: custom:template-entity-row
entity: binary_sensor.badezimmer_fensterkontakt_1_battery
name: Badezimmer (Fensterkontakt)
state: " "
secondary: >-
Status: {{ 'Schwach' if
is_state('binary_sensor.badezimmer_fensterkontakt_1_battery',
'on') else 'OK' }}
card_mod:
style: >
state-badge { color: {{ 'red' if
is_state('binary_sensor.badezimmer_fensterkontakt_1_battery',
'on') else 'green' }}; }
- type: section
label: Kameras
- type: custom:template-entity-row
entity: binary_sensor.haustur_batteriestand
name: Haustür
state: " "
secondary: >-
Status: {{ 'Schwach' if
is_state('binary_sensor.haustur_batteriestand', 'on') else
'OK' }}
card_mod:
style: >
state-badge { color: {{ 'red' if
is_state('binary_sensor.haustur_batteriestand', 'on') else
'green' }}; }
- type: custom:template-entity-row
entity: binary_sensor.outdoor_batteriestand
name: Outdoor 1
state: " "
secondary: >-
Status: {{ 'Schwach' if
is_state('binary_sensor.outdoor_batteriestand', 'on') else
'OK' }}
card_mod:
style: >
state-badge { color: {{ 'red' if
is_state('binary_sensor.outdoor_batteriestand', 'on') else
'green' }}; }
- type: custom:template-entity-row
entity: binary_sensor.outdoor_2_batteriestand
name: Outdoor 2
state: " "
secondary: >-
Status: {{ 'Schwach' if
is_state('binary_sensor.outdoor_2_batteriestand', 'on') else
'OK' }}
card_mod:
style: >
state-badge { color: {{ 'red' if
is_state('binary_sensor.outdoor_2_batteriestand', 'on') else
'green' }}; }
- type: section
label: Bewegungsmelder
- type: custom:template-entity-row
entity: sensor.0xa4c138da66acc759_battery
name: Tablet
state: " "
secondary: >-
Ladezustand: {{ states('sensor.0xa4c138da66acc759_battery')
}}%
card_mod:
style: >
state-badge { color: {{ 'green' if
states('sensor.0xa4c138da66acc759_battery')|float(0) > 50
else 'orange' if
states('sensor.0xa4c138da66acc759_battery')|float(0) > 20
else 'red' }}; }
- type: custom:template-entity-row
entity: sensor.0xa4c138e43bd441af_battery
name: Flur
state: " "
secondary: >-
Ladezustand: {{ states('sensor.0xa4c138e43bd441af_battery')
}}%
card_mod:
style: >
state-badge { color: {{ 'green' if
states('sensor.0xa4c138e43bd441af_battery')|float(0) > 50
else 'orange' if
states('sensor.0xa4c138e43bd441af_battery')|float(0) > 20
else 'red' }}; }
- type: custom:template-entity-row
entity: sensor.bewegungsmelder_buro_battery
name: Büro
state: " "
secondary: >-
Ladezustand: {{ states('sensor.bewegungsmelder_buro_battery')
}}%
card_mod:
style: >
state-badge { color: {{ 'green' if
states('sensor.bewegungsmelder_buro_battery')|float(0) > 50
else 'orange' if
states('sensor.bewegungsmelder_buro_battery')|float(0) > 20
else 'red' }}; }
- type: custom:template-entity-row
entity: sensor.gartensensor_eingang_battery
name: Eingang Garten
state: " "
secondary: >-
Ladezustand: {{ states('sensor.gartensensor_eingang_battery')
}}%
card_mod:
style: >
state-badge { color: {{ 'green' if
states('sensor.gartensensor_eingang_battery')|float(0) > 50
else 'orange' if
states('sensor.gartensensor_eingang_battery')|float(0) > 20
else 'red' }}; }
- type: custom:template-entity-row
entity: sensor.gartensensor_haus_battery
name: Haus Garten
state: " "
secondary: "Ladezustand: {{ states('sensor.gartensensor_haus_battery') }}%"
card_mod:
style: >
state-badge { color: {{ 'green' if
states('sensor.gartensensor_haus_battery')|float(0) > 50
else 'orange' if
states('sensor.gartensensor_haus_battery')|float(0) > 20
else 'red' }}; }
- type: custom:template-entity-row
entity: sensor.briefkasten_post_ist_da_battery
name: Post ist da
state: " "
secondary: >-
Ladezustand: {{
states('sensor.briefkasten_post_ist_da_battery') }}%
card_mod:
style: >
state-badge { color: {{ 'green' if
states('sensor.briefkasten_post_ist_da_battery')|float(0) >
50 else 'orange' if
states('sensor.briefkasten_post_ist_da_battery')|float(0) >
20 else 'red' }}; }
- type: custom:template-entity-row
entity: sensor.briefkasten_post_ist_entnommen_battery
name: Post entnommen
state: " "
secondary: >-
Ladezustand: {{
states('sensor.briefkasten_post_ist_entnommen_battery') }}%
card_mod:
style: >
state-badge { color: {{ 'green' if
states('sensor.briefkasten_post_ist_entnommen_battery')|float(0)
> 50 else 'orange' if
states('sensor.briefkasten_post_ist_entnommen_battery')|float(0)
> 20 else 'red' }}; }
- type: section
label: Lichtschalter
- type: custom:template-entity-row
entity: sensor.kuchenlicht_schalter_battery
name: Küche
state: " "
secondary: >-
Ladezustand: {{ states('sensor.kuchenlicht_schalter_battery')
}}%
card_mod:
style: >
state-badge { color: {{ 'green' if
states('sensor.kuchenlicht_schalter_battery')|float(0) > 50
else 'orange' if
states('sensor.kuchenlicht_schalter_battery')|float(0) > 20
else 'red' }}; }
- type: custom:template-entity-row
entity: sensor.schalter_kuchenzeile_battery
name: Küchenzeile
state: " "
secondary: >-
Ladezustand: {{ states('sensor.schalter_kuchenzeile_battery')
}}%
card_mod:
style: >
state-badge { color: {{ 'green' if
states('sensor.schalter_kuchenzeile_battery')|float(0) > 50
else 'orange' if
states('sensor.schalter_kuchenzeile_battery')|float(0) > 20
else 'red' }}; }
- type: section
label: Bewässerungscomputer
- type: custom:template-entity-row
entity: sensor.bewasserungscomputer_1_battery
name: Bewässerungscomputer 1
state: " "
secondary: >-
Ladezustand: {{
states('sensor.bewasserungscomputer_1_battery') }}%
card_mod:
style: >
state-badge { color: {{ 'green' if
states('sensor.bewasserungscomputer_1_battery')|float(0) >
50 else 'orange' if
states('sensor.bewasserungscomputer_1_battery')|float(0) >
20 else 'red' }}; }
- type: custom:template-entity-row
entity: sensor.bewasserungscomputer_2_battery
name: Bewässerungscomputer 2
state: " "
secondary: >-
Ladezustand: {{
states('sensor.bewasserungscomputer_2_battery') }}%
card_mod:
style: >
state-badge { color: {{ 'green' if
states('sensor.bewasserungscomputer_2_battery')|float(0) >
50 else 'orange' if
states('sensor.bewasserungscomputer_2_battery_battery')|float(0)
> 20 else 'red' }}; }
- type: custom:template-entity-row
entity: sensor.bewasserungscomputer_3_battery
name: Bewässerungscomputer 3
state: " "
secondary: >-
Ladezustand: {{
states('sensor.bewasserungscomputer_3_battery') }}%
card_mod:
style: >
state-badge { color: {{ 'green' if
states('sensor.bewasserungscomputer_3_battery')|float(0) >
50 else 'orange' if
states('sensor.bewasserungscomputer_3_battery')|float(0) >
20 else 'red' }}; }
- type: custom:mushroom-template-card
primary: Gartentor
secondary: >-
{% if is_state('switch.garten_shelly_tursummer', 'on') %} Offen {%
else %} Geschlossen {% endif %}
icon: >-
{% if is_state('switch.garten_shelly_tursummer', 'on') %}
mdi:lock-open {% else %} mdi:lock {% endif %}
tap_action:
action: perform-action
perform_action: switch.turn_on
target:
entity_id: switch.garten_shelly_tursummer
entity: switch.garten_shelly_tursummer
view_layout:
grid-column: 4 / span 2
grid-row: 66 / span 20
place-self: stretch
card_mod:
style: |
:host {
display: flex !important;
width: 100% !important;
height: 100% !important;
}
ha-card {
width: 100% !important;
height: 100% !important;
flex: 1 1 100% !important;
}
color: >-
{% if is_state('switch.garten_shelly_tursummer', 'on') %} green {%
else %} grey {% endif %}
icon_color: >-
{% if is_state('switch.garten_shelly_tursummer', 'on') %} green {%
else %} grey {% endif %}
vertical: true
- type: sidebar
title: Kamera Vollbild
path: kamera-garten
cards:
- type: custom:advanced-camera-card
cameras:
- camera_entity: camera.garten_hochauflosung
live_provider: webrtc-card
ptz:
enabled: true
webrtc_card:
entity: camera.garten_hochauflosung
menu:
buttons:
microphone:
enabled: true
permanent: false
icon: mdi:microphone
type: toggle
priority: 64
subview: true
- type: sections
path: energie-details
title: Energie Details
cards: []
sections:
- type: grid
cards:
- type: energy-date-selection
grid_options:
columns: 24
rows: 1
- type: vertical-stack
cards:
- type: energy-distribution
- type: heading
icon: ""
heading: Energienutzung
heading_style: title
grid_options:
columns: 12
rows: 1
- type: energy-usage-graph
- type: heading
heading: Solarproduktion
heading_style: title
- type: energy-solar-graph
- type: vertical-stack
cards:
- type: energy-sources-table
- type: heading
heading: Einzelne Geräte
heading_style: title
- type: energy-devices-graph
column_span: 2
- type: grid
cards:
- type: gauge
entity: sensor.solarbank_3_e2700_pro_temperatur
name: Solarbank Temperatur
unit: °C
min: 0
max: 65
severity:
green: 0
yellow: 45
red: 55
- type: vertical-stack
cards:
- type: glance
show_icon: true
show_name: true
show_state: true
entities:
- entity: sensor.solarbank_3_e2700_pro_solar_pv1
name: Süd 1
card_mod:
style: >
:host { --paper-item-icon-color: #3498db; color:
#3498db; font-weight: bold; }
- entity: sensor.solarbank_3_e2700_pro_solar_pv2
name: Ost/West 1
card_mod:
style: >
:host { --paper-item-icon-color: #d4ac0d; color:
#d4ac0d; font-weight: bold; }
- entity: sensor.solarbank_3_e2700_pro_solar_pv3
name: Ost/West 2
card_mod:
style: >
:host { --paper-item-icon-color: #e74c3c; color:
#e74c3c; font-weight: bold; }
- entity: sensor.solarbank_3_e2700_pro_solar_pv4
name: Süd 2
card_mod:
style: >
:host { --paper-item-icon-color: #2ecc71; color:
#2ecc71; font-weight: bold; }
- type: custom:button-card
entity: sensor.solarbank_3_e2700_pro_solarleistung
show_name: true
name: "Auslastung:"
show_state: false
styles:
card:
- height: 40px
- padding: 0px 15px
- border: 1px solid rgba(255,255,255,0.1)
grid:
- grid-template-areas: "\"n prozent\""
- grid-template-columns: 1fr auto
name:
- justify-self: start
- font-size: 14px
- color: white
custom_fields:
prozent:
- font-weight: bold
- font-size: 16px
- color: |
[[[
const p = (parseFloat(states['sensor.solarbank_3_e2700_pro_solarleistung'].state) / 3000) * 100;
if (p < 10) return "#ff4d4d"; // Rot
if (p < 50) return "#ffd700"; // Gelb/Gold
return "#4caf50"; // Grün
]]]
custom_fields:
prozent: |
[[[
const watt = states['sensor.solarbank_3_e2700_pro_solarleistung'].state;
return ((parseFloat(watt) / 3000) * 100).toFixed(1) + ' %';
]]]
- type: entities
entities:
- entity: sensor.solarbank_gesamtleistung
name: Gesamtleistung aktuell
card_mod:
style: >
:host { font-size: 0.9em; }
.state { font-weight: 900; font-size: 1.1em; text-align:
right; }
- entity: sensor.solarbank_3_e2700_pro_hauptakku_ladestand
name: Batterie Füllstand
icon: mdi:battery
- entity: sensor.solarbank_3_e2700_pro_hauptakku_ladestand
name: "Status / Voll um:"
icon: mdi:battery-clock
type: custom:template-entity-row
state: >
{% set soc =
states('sensor.solarbank_3_e2700_pro_hauptakku_ladestand')
| float(0) %} {% set power =
states('sensor.solarbank_3_e2700_pro_aufladeleistung') |
float(0) %} {% if soc >= 100 %}
Voll um {{ states.sensor.solarbank_3_e2700_pro_hauptakku_ladestand.last_changed.local().strftime('%H:%M') }} Uhr
{% elif power > 5 %}
Lädt mit {{ power | round(0) }} W
{% else %}
Keine Ladung
{% endif %}
- type: history-graph
entities:
- entity: sensor.solarbank_3_e2700_pro_solar_pv1
name: Süd 1
- entity: sensor.solarbank_3_e2700_pro_solar_pv2
name: Ost/West 1
- entity: sensor.solarbank_3_e2700_pro_solar_pv3
name: Ost/West 2
- entity: sensor.solarbank_3_e2700_pro_solar_pv4
name: Süd 2
hours_to_show: 24
- type: grid
cards:
- type: vertical-stack
cards:
- type: heading
heading: Eigenverbrauch
heading_style: title
- type: energy-solar-consumed-gauge
- type: heading
heading: Netto vom Netz bezogen
heading_style: title
- type: energy-grid-neutrality-gauge
- type: heading
heading: Gasverbrauch
heading_style: title
- type: energy-gas-graph
footer: {}
max_columns: 2
subview: false
Ob das ganze funktioniert kann ich aber erst testen wenn mein E Auto da ist, genauso werde ich mir en Dashboard aufbauen aktuell ist nur 1 Phase angeschlossen zum Testen aber sie wird dauerhaft auf 3 Phasen betrieben da der Akku im Haus groß ist und ich so keine Phasen umschaltung brauche.
Nachtrag das 3 Dashboard dazu also die 3 te Version eine erarbiete ich mir nochHallo werte Community,
ich bin echt begeistert, welche Dashboards der eine oder andere am Start hat. Wie vielfältig doch die Anspüche eines jeden zu seinem Dashboard bestehen. Möchte auch mein Dashboard gern einmal Vorstellen. Am Ende ist es immer eine subjektive Wahrnehmung, wie das Dashboard aussehen soll.
Derzeit bin ich damit zu frieden. Es ist immer noch Luft nach oben. Fürs erste soll es aber reichen. Bei Fragen oder Anregungen haut in die Tastaturen. Freu mich darauf. ![]()
Hier mal die Startseite meins aktuellen mobilen Dashboards.
Die Unteransichten sind noch relativ unspektakulär, werden aber wenn wir im Haus eingezogen sind, an die Räumlichkeiten angepasst und optimiert.
Hier noch mein Dashbord auf dem Tablet in der Küche.
In dem unteren freien Feld werden bei Bedarf noch Unwetterwarnungen angezeigt.
Hallo,
ich sehe gerade dein Fritzbox Dashboard mit dem Gastzugang via QR-Code. Kannst du kurz beschreiben, wie du den Gastzugang zur Verfügung stellst? Ich habe eine 5690 Pro und hatte damit extreme Probleme. Ich hatte pro Tag per Script das Guest-WLAN-Kennwort geändert. Im Ergebnis hat mir das System aber das Haupt WLAN Kennwort geändert und ich kam nur per LAN auf meine Fritzbox. Das ganze hatte mit der alten 7590 ohne Probleme funktioniert.
Mit welcher App / Integration liesst du den Status aus? Änderst du auch per Automation das Guest-WLAN-Kennwort ?
Gruß
Martin
Das sollte aus den FritzBox Tools kommen, die dann eine image Entität bereit stellt, z.b.: image.fritz_box_7590_ui_gastzugang
Okay, danke. Teste ich mal.
Kennwörter kann man (scheinbar) nicht über Fritzbox Tools ändern. Richtig?
Den QR Code sehe ich aber.
Nein, nicht das ich wüsste.
Hallo MartyBr,
Ich nutze die Integration Fritz!Box Tools.
Und mittels:
type: picture
image_entity: image.fritz_box_7590_mikes_gastzugang
wird der QR-Code dargestellt.
Den Gastzugang habe ich gesondert in der Fritzbox eingestellt. Aber das kennst du ja sicher schon. Einzig muss bei mir noch der Gastzugang eingeschaltet werden, da er nicht dauerhaft zur Verfügung steht.
Ich hoffe ich konnte Dir weiterhelfen.
Das Passwort kann nur in der Fritzbox geändert werden. Aber wenn Du es in der Fritzbox geändert hast, wird es in der Integration aktualisiert.
Danke dir. Ich hatte das Thema etwas aus den Augen verloren, da ich ziemliche Probleme mit der 5690 Pro hatte. Die hat ja 3 Frequenzen: 2.4, 5 und 6 GHz. Und das sorgte für Konfusion bei Script: ich hatte eindeutig das Gäste WLAN ausgewählt und trotzdem hat das System immer das zentrale WLAN-Kennwort geändert. Ich habe daher alle erstmal raus geschmissen.
Sieht super aus! Könntest du den Code dafür teilen?
Ich suche genau danach
Hallo zusammen,
ich möchte euch mein aktuelles Home-Assistant-Dashboard vorstellen. Es heißt bei mir einfach Homi und ist über längere Zeit aus dem Rounded-Bubble-Design und verschiedenen Custom Cards entstanden. Mein Ziel war kein möglichst spektakuläres Dashboard, sondern eine Oberfläche, die im Alltag schnell verständlich ist, auf Desktop und Tablet funktioniert und sich später noch vernünftig pflegen lässt.
Der aktuelle Aufbau
Das Dashboard besteht aktuell aus 12 Ansichten und 115 Decluttering-Templates. Dazu kommen zwei eigene Navbar-Templates für Desktop und Tablet.
Neben der Startseite gibt es Raumansichten für Wohnen, Küche, Bad, Flur und Terrasse. Weitere Ansichten bündeln größere Themen wie Kaffeemaschine, 3D-Drucker, Energieverbrauch, Homelab, Batterien und Wetter. Ich gehe deshalb nicht auf jede Ansicht einzeln ein – wichtiger ist das gemeinsame System dahinter.
Fast alle Ansichten verwenden das Sections-Layout. Nur die Wetterseite nutzt wegen ihres besonderen Aufbaus ein eigenes Grid-Layout. Die normale Reihenfolge ist meistens:
- kompakte Topbar mit den wichtigsten Werten,
- Uhr beziehungsweise aktive Timer,
- mehrere thematische Kartengruppen,
- Detail-Popups,
- responsive Navigation am unteren Rand.
Optisch nutze ich dunkle blau-violette Flächen, große Rundungen, kompakte Schrift und möglichst wenig Schatten. Farben haben dabei meistens eine Bedeutung: Grün steht beispielsweise für aktiv oder in Ordnung, Orange für eine Warnung und Rot für einen kritischen Zustand.
Die wichtigsten Bausteine
Das Grundgerüst bilden vor allem diese Custom Cards:
- Decluttering Card für wiederverwendbare Templates
- Button Card für frei gestaltete Status-, Geräte- und Gruppenkarten
- Bubble Card für Popups
- Auto Entities für automatisch gefilterte Listen
- Navbar Card für die Navigation auf Desktop und Tablet
Dazu kommen an passenden Stellen spezialisierte Karten, beispielsweise ApexCharts, die Energieverbrauchskarte oder Horseshoe-Anzeigen. Ich versuche aber nicht, jede Funktion mit der Button Card nachzubauen. Wenn eine native oder spezialisierte Karte eine Aufgabe besser löst, wird sie in das vorhandene Design eingebettet.
Warum so viele Templates?
115 Templates klingen zunächst nach sehr viel. Tatsächlich machen sie das Dashboard aber erst wartbar. Die Templates enthalten das Aussehen und die Logik, jedoch keine fest eingebauten Geräte. Die konkreten Entitäten werden erst in der jeweiligen Ansicht als Variablen übergeben.
Dadurch kann ich dieselbe Licht-, Status- oder Timerkarte in mehreren Räumen einsetzen. Ändere ich später Höhe, Schrift oder Farben eines gemeinsamen Templates, wird die Änderung überall übernommen.
Ein Beispiel ist die Statusgruppe auf der Startseite. Sie fasst eingeschaltete Lichter, offene Rollläden, den Sicherheitsstatus und kritische Batterien in vier kleinen Kacheln zusammen:
type: custom:decluttering-card
template: homi_group_home_status_overview
variables:
- sensor_angeschaltete_lichter: sensor.dashboard_lichter_aktiv
- sensor_offene_rollos: sensor.dashboard_rolllaeden_offen
- sensor_status_sicherheit: sensor.dashboard_sicherheitsstatus
- sensor_batterien_kritisch: sensor.dashboard_batterien_kritisch
Die hier gezeigten Entitäten sind absichtlich fiktiv.
Kartengruppen statt einzelner Sensorlisten
In den Ansichten versuche ich, zusammengehörende Dinge als eine visuelle Gruppe darzustellen. Eine Gruppe besitzt einen gemeinsamen Header und darunter zwei oder mehrere kompakte Kacheln. So bleiben beispielsweise Beleuchtung, Raumklima, Geräte, Sicherheit oder Steckdosen klar voneinander getrennt.
Die Beleuchtungsgruppe der Küche wird in der Ansicht nur noch mit zwei Entitäten aufgerufen:
type: custom:decluttering-card
template: homi_group_kueche_lights
variables:
- light_deckenlicht: light.kueche_deckenlicht_beispiel
- light_lichterkette: light.kueche_led_beispiel
Das Template baut daraus den Gruppenrahmen und zwei homi_tile_light-Kacheln. Tippen schaltet das Licht, ein längerer Druck öffnet die Detailansicht und die Kachel zeigt auch die Helligkeit an. Die eigentliche Ansicht bleibt dadurch sehr kurz.
Dasselbe Prinzip verwende ich unter anderem für den Kühlschrank, Rauchmelder, die Kaffeemaschine, den 3D-Drucker und meine Homelab-Systeme. Gerade bei komplexeren Geräten ist die Hauptkarte bewusst reduziert. Weitere Messwerte und Steuerungen liegen in einem Popup, statt die Übersicht zu überladen.
Timer, Popups und dynamische Listen
Timer sind bei mir eigene wiederverwendbare Kacheln mit Live-Countdown. Auf einigen Seiten ersetzen kompakte Timerkarten die Uhr, solange ein Timer aktiv ist. Eine Gruppe mit zwei Lüftungstimern sieht im Aufruf beispielsweise so aus:
type: custom:decluttering-card
template: homi_group_bad_timers
variables:
- timer_duschen: timer.bad_lueftung_duschen_beispiel
- timer_toilette: timer.bad_lueftung_toilette_beispiel
Für Details nutze ich Bubble-Card-Popups. Dort landen zum Beispiel Lichtsteuerungen, offene Kontakte oder Aktionen für virtuelle Maschinen. Gefährlichere Aktionen wie Neustart oder Herunterfahren haben zusätzlich einen Bestätigungsdialog.
Dynamische Listen werden mit Auto Entities erzeugt. Das nutze ich vor allem bei Batterien, eingeschalteten Lichtern und offenen Kontakten. Dadurch zeigt das Dashboard nur die Einträge, die gerade wirklich relevant sind, ohne dass ich jede Karte von Hand ein- und ausblenden muss.
Responsive Nutzung
Das Dashboard ist nicht nur für einen Bildschirm gebaut. Die Sections ordnen sich abhängig von der verfügbaren Breite neu an. Zusätzlich gibt es zwei Navbar-Varianten: eine für Desktop und eine für Tablet. Auch einzelne Karten können über Sichtbarkeitsregeln nur auf bestimmten Displaygrößen erscheinen.
Die Oberfläche bleibt dadurch auf dem großen Monitor übersichtlich, ohne auf dem Tablet zu einer unlesbaren Miniaturansicht zu werden.
Mein Fazit
Der Aufbau hat anfangs mehr Arbeit gemacht als ein Dashboard aus einzelnen Standardkarten. Inzwischen zahlt sich das Template-System aber aus: Neue Räume oder Geräte lassen sich aus vorhandenen Kartenfamilien zusammensetzen und gemeinsame Änderungen müssen nur an einer Stelle erfolgen.
Für mich ist Homi inzwischen ein guter Mittelweg aus Optik, Bedienbarkeit und Wartbarkeit. Es ist weiterhin ein laufendes Projekt, aber die grundlegende Struktur steht: kompakte Übersichten, wiederverwendbare Templates und Details nur dort, wo man sie wirklich braucht.
Falls Interesse besteht, kann ich einzelne Kartenfamilien oder Templates später noch genauer zeigen.
Highlights:
Ich arbeite gerade an einem neuen globalen Theme (Danke an Piranha1605 für HATG). Es gibt einen Dark und Light Mode und der 3D Card-Mod Hintergrund lässt sich per Flag abschalten (wenn man Flat-Design bevorzugt) Es ist noch nicht perfekt, funktioniert aber schon so gut das ich es bereits bei mir aktiv nutze. Für den 3D-Hintergrund wird card-mod benötigt und die Themes müssen über die configuration.yaml geladen werden.
Hier schonmal ein paar Sreenshots:
Super geworden.Ich bin gerade dabei die Kinderkrankheiten zu fixen.Hast du noch was gefunden? Und welche Version hast du gerade am laufen? Ich bin gerade dabei dem Programm beizubringen was zu was gehört das man im Prinzip nur noch eine Seite braucht und der rest Automatisch an alle anderen Karten und an Bubble und Mushroom angepasst wird.
ich hab das zweite Bild bei deiner Theme als wallpaper gesetzt.Ist richtig gut geworden.
Ich hab das mit den Farben usw. alles mit der Version 0.2.12 gemacht. Dann den ganzen card-mod code manuell entfernt und den card-mod Code von mir manuell hinzugefügt, weil ich nicht wusste wie ich es sonst machen sollte. Bubblecard nutze ich nur das Popup und Mushroom-card garnicht. Weiss also nicht wie es da aussieht.
Ich habe unter dark und light jeweils noch ein paar Variablen gesetzt und an Ende dann den card-mod Code der dann mit den übergebenen Werten die am Anfang von dark und light stehen entsprechend den Hintergrund für dark und light unterschiedlich gerendert für alle Karten, ausser glaub ich 3 bisher. Und es wird ein Flag abgefragt, was ich per Helfer setzen kann, ob card-mod genutzt werden soll oder nicht (für Flat-Design ohne card-mod). Wenn der Helfer nicht extistiert wird card-mod ausgeführt. achja für die Textfarbe für die Überschriften wird noch im card-mod Teil gesetzt, weil es da keinen Eintrag für gab.
Wenn man das alles auch direkt im Editor anpassen kann, wäre das natürlich eleganter. Guck es dir mal an, ob man das auch direkt im Editor machen könnte.
Achja ich weiss nicht, ob das in der neuen Version schon gefixt ist, der Theme-Name wurde immer klein geschrieben gespeichert (hab ich von Hand geändert)
Ich hänge mal die bisherige Version mal an, auch für Andere die es mal probieren wollen.
Awesome-Blue.yaml (46,4 KB)
Hallo zusammen,
ich möchte euch mein aktuelles Home-Assistant-Dashboard vorstellen
QHOME Pool ist mein Home-Assistant-Projekt zur Visualisierung und Steuerung meiner kompletten Pooltechnik. Ziel war es, Wetter, Wasserqualität, Wärmepumpe, Filteranlage und Dosierung in einer modernen, appähnlichen Oberfläche zusammenzuführen. Statt möglichst viele Daten anzuzeigen, steht der aktuelle Zustand und die Frage „Muss ich heute etwas tun?“ im Mittelpunkt. Das Dashboard ist aktuell noch vollständig auf meine eigene Home-Assistant-Installation zugeschnitten.





































