- ioBroker Community Home
- Deutsch
- Tester
- Test Adapter lovelace v0.2.x
NEWS
-
@all Gibt es irgendwo im www noch Lesestoff für die Konfiguration des Adapters?
Tue mich sehr schwer mit dem Einrichten. Würde z.B. gerne so ne Ansicht für die Rollladen einrichten.


Auf Github, der Home Assistant Seite oder Youtube gibt es zu genug fertige Sachen. Doch ich verstehe es nicht wie ich sowas einbinde.
Gruß
-
@all Gibt es irgendwo im www noch Lesestoff für die Konfiguration des Adapters?
Tue mich sehr schwer mit dem Einrichten. Würde z.B. gerne so ne Ansicht für die Rollladen einrichten.


Auf Github, der Home Assistant Seite oder Youtube gibt es zu genug fertige Sachen. Doch ich verstehe es nicht wie ich sowas einbinde.
Gruß
@ecki945
Such Mal nach input_number, damit kannst dein vorhaben realisieren.<a href="https://github.com/Scrounger/ioBroker.linkeddevices">LinkedDevices Adapter</a>
<a href="https://github.com/Scrounger/ioBroker.vis-materialdesign">Material Design Widgets</a>
-
Hier mal ein paar Beispiele, was ich so mit lovelace realisiert habe.
Hauptsächlich verwende ich die button-card, da diese sehr viel Flexibilität ermöglicht und man so mit manuellen entities sehr gut arbeiten kann.
Anwesenheit

type: horizontal-stack cards: - type: 'custom:vertical-stack-in-card' cards: - type: 'custom:button-card' entity: sensor.Netzwerk_Devices_Tussi_Anwesend layout: vertical show_name: true show_last_changed: true show_entity_picture: true show_icon: false tap_action: action: none styles: label: - font-size: small - font-style: italic - color: '#a1a1a1' state: - value: true entity_picture: /static/myimages/tussi_presence.png name: anwesend - value: false entity_picture: /static/myimages/tussi_presence.png name: abwesend styles: icon: - filter: grayscale(100%) - type: 'custom:button-card' entity: sensor.Netzwerk_Devices_Tussi_Anwesend show_name: false show_icon: false styles: card: - width: 100% - padding: 2px state: - value: true styles: card: - background: green - value: false styles: card: - background: FireBrick - type: 'custom:vertical-stack-in-card' cards: - type: 'custom:button-card' entity: sensor.Netzwerk_Devices_Handy_Anwesend layout: vertical show_name: true show_last_changed: true show_entity_picture: true show_icon: false tap_action: action: none styles: label: - font-size: small - font-style: italic - color: '#a1a1a1' state: - value: true entity_picture: /static/myimages/ich_presence.png name: anwesend - value: false entity_picture: /static/myimages/ich_presence.png name: abwesend styles: icon: - filter: grayscale(100%) - type: 'custom:button-card' entity: sensor.Netzwerk_Devices_Handy_Anwesend show_name: false show_icon: false styles: card: - width: 100% - padding: 2px state: - value: true styles: card: - background: green - value: false styles: card: - background: FireBrickFenster

type: horizontal-stack cards: - type: 'custom:vertical-stack-in-card' cards: - type: 'custom:button-card' entity: sensor.Sensoren_Fenster_Bad_Offen layout: vertical show_name: false show_entity_picture: true show_icon: false show_last_changed: true tap_action: action: none styles: label: - font-size: small - font-style: italic - color: '#a1a1a1' state: - value: true entity_picture: /static/myimages/window_open.png name: offen show_last_changed: true - value: false entity_picture: /static/myimages/window_closed.png name: geschlossen show_last_changed: false - type: 'custom:vertical-stack-in-card' cards: - type: 'custom:button-card' entity: sensor.Sensoren_Fenster_WC_Offen layout: vertical show_name: false show_entity_picture: true show_icon: false show_last_changed: true tap_action: action: none styles: label: - font-size: small - font-style: italic - color: '#a1a1a1' state: - value: true entity_picture: /static/myimages/window_open.png name: offen show_last_changed: true - value: false entity_picture: /static/myimages/window_closed.png name: geschlossen show_last_changed: falseLicht - Schalter

type: vertical-stack cards: - type: horizontal-stack cards: - type: 'custom:vertical-stack-in-card' cards: - type: entity-button tap_action: action: toggle hold_action: action: more-info show_icon: true show_name: true entity: light.Licht_Flur_Main_An name: Flur - type: horizontal-stack cards: - type: 'custom:button-card' entity: sensor.Licht_Flur_Main_Leistung layout: vertical show_name: true show_icon: false show_state: false show_label: true name: Leistung label: | [[[ if(entity.state > 0) return (entity.state + " " + entity.attributes.unit_of_measurement); else return "0 " + entity.attributes.unit_of_measurement; ]]] styles: card: - background: '#a1a1a1' - border-radius: 0px - height: 50px name: - font-size: x-small - color: '#44739e' - font-weight: bold - font-style: oblique state: - font-size: smaller label: - font-size: smaller - type: 'custom:button-card' entity: sensor.Verbrauchszaehler_Licht_Flur_Main_Verbrauch_Tag layout: vertical show_name: true show_icon: false show_state: false show_label: true name: Heute label: | [[[ return entity.state * 1000 + ' Wh']]] styles: card: - background: '#a1a1a1' - border-radius: 0px - height: 50px name: - font-size: x-small - color: '#44739e' - font-weight: bold - font-style: oblique state: - font-size: smaller label: - font-size: smaller - type: 'custom:button-card' entity: sensor.Verbrauchszaehler_Licht_Flur_Main_Kosten_Jahr layout: vertical show_name: true show_icon: false show_state: false show_label: true name: Jahr label: | [[[ if(entity.state > 0) return (entity.state + " " + entity.attributes.unit_of_measurement); else return "0 " + entity.attributes.unit_of_measurement; ]]] styles: card: - background: '#a1a1a1' - border-radius: 0px - height: 50px name: - font-size: x-small - color: '#44739e' - font-weight: bold - font-style: oblique state: - font-size: smaller label: - font-size: smaller - type: 'custom:vertical-stack-in-card' cards: - type: entity-button tap_action: action: toggle hold_action: action: more-info show_icon: true show_name: true entity: light.Licht_Flur_Nische_An name: Nische - type: horizontal-stack cards: - type: 'custom:button-card' entity: sensor.Licht_Flur_Nische_Leistung layout: vertical show_name: true show_icon: false show_state: false show_label: true name: Leistung label: | [[[ if(entity.state > 0) return (entity.state + " " + entity.attributes.unit_of_measurement); else return "0 " + entity.attributes.unit_of_measurement; ]]] styles: card: - background: '#a1a1a1' - border-radius: 0px - height: 50px name: - font-size: x-small - color: '#44739e' - font-weight: bold - font-style: oblique state: - font-size: smaller label: - font-size: smaller - type: 'custom:button-card' entity: sensor.Verbrauchszaehler_Licht_Flur_Nische_Verbrauch_Tag layout: vertical show_name: true show_icon: false show_state: false show_label: true name: Heute label: | [[[ return entity.state * 1000 + ' Wh']]] styles: card: - background: '#a1a1a1' - border-radius: 0px - height: 50px name: - font-size: x-small - color: '#44739e' - font-weight: bold - font-style: oblique state: - font-size: smaller label: - font-size: smaller - type: 'custom:button-card' entity: sensor.Verbrauchszaehler_Licht_Flur_Nische_Kosten_Jahr layout: vertical show_name: true show_icon: false show_state: false show_label: true name: Jahr label: | [[[ if(entity.state > 0) return (entity.state + " " + entity.attributes.unit_of_measurement); else return "0 " + entity.attributes.unit_of_measurement; ]]] styles: card: - background: '#a1a1a1' - border-radius: 0px - height: 50px name: - font-size: x-small - color: '#44739e' - font-weight: bold - font-style: oblique state: - font-size: smaller label: - font-size: smallerLicht - Dimmer

type: 'custom:vertical-stack-in-card' title: Esszimmer cards: - type: horizontal-stack cards: - type: light entity: light.Licht_Esszimmer_Links_Dimmer name: Links - type: light entity: light.Licht_Esszimmer_Rechts_Dimmer name: Rechts - type: horizontal-stack cards: - type: 'custom:button-card' entity: sensor.Licht_Esszimmer_Gruppe_SummeLeistung layout: vertical show_name: true show_icon: false show_state: false show_label: true name: Leistung label: | [[[ if(entity.state > 0) return (entity.state + " " + entity.attributes.unit_of_measurement); else return "0 " + entity.attributes.unit_of_measurement; ]]] styles: card: - background: '#a1a1a1' - border-radius: 0px - height: 50px name: - font-size: x-small - color: '#44739e' - font-weight: bold - font-style: oblique state: - font-size: smaller label: - font-size: smaller - type: 'custom:button-card' entity: sensor.Verbrauchszaehler_Licht_Esszimmer_Gruppe_Verbrauch_Tag layout: vertical show_name: true show_icon: false show_state: false show_label: true name: Heute label: | [[[ return entity.state * 1000 + ' Wh']]] styles: card: - background: '#a1a1a1' - border-radius: 0px - height: 50px name: - font-size: x-small - color: '#44739e' - font-weight: bold - font-style: oblique state: - font-size: smaller label: - font-size: smaller - type: 'custom:button-card' entity: sensor.Verbrauchszaehler_Licht_Esszimmer_Gruppe_Kosten_Jahr layout: vertical show_name: true show_icon: false show_state: false show_label: true name: Jahr label: | [[[ if(entity.state > 0) return (entity.state + " " + entity.attributes.unit_of_measurement); else return "0 " + entity.attributes.unit_of_measurement; ]]] styles: card: - background: '#a1a1a1' - border-radius: 0px - height: 50px name: - font-size: x-small - color: '#44739e' - font-weight: bold - font-style: oblique state: - font-size: smaller label: - font-size: smallerGeräte

type: 'custom:vertical-stack-in-card' cards: - type: 'custom:button-card' entity: switch.Netzwerk_Devices_MusicCast_Esszimmer_An layout: vertical show_name: false show_entity_picture: true tap_action: action: toggle size: 30% state: - value: 'on' entity_picture: /static/myimages/MusicCast-WX-030.png styles: card: - background: LemonChiffon - value: 'off' entity_picture: /static/myimages/MusicCast-WX-030.png - type: 'custom:button-card' entity: sensor.Netzwerk_Devices_MusicCast_Esszimmer_PowerStatus show_name: false show_icon: false tap_action: action: none styles: card: - width: 100% - padding: 2px - margin-top: '-10px' state: - value: An styles: card: - background: green - value: Aus styles: card: - background: FireBrick - value: Boot styles: card: - background: MediumSeaGreen - animation: blink 2s ease infinite - value: Standby styles: card: - background: Orange - value: Enter Standby styles: card: - background: Orange - animation: blink 2s ease infinite - value: Leave Standby styles: card: - background: Orange - animation: blink 2s ease infinite - type: horizontal-stack cards: - type: 'custom:button-card' entity: sensor.Netzwerk_Devices_MusicCast_Esszimmer_PowerStatus layout: vertical show_name: true show_icon: false show_state: true name: Status styles: card: - background: '#a1a1a1' - border-radius: 0px - height: 50px name: - font-size: x-small - color: '#44739e' - font-weight: bold - font-style: oblique state: - font-size: smaller - type: 'custom:button-card' entity: sensor.Schalter_Esszimmer_MusicCast_Leistung layout: vertical show_name: true show_icon: false show_state: true show_label: true name: Leistung styles: card: - background: '#a1a1a1' - border-radius: 0px - height: 50px name: - font-size: x-small - color: '#44739e' - font-weight: bold - font-style: oblique state: - font-size: smaller label: - font-size: smaller state: - value: 0 label: 0 W - type: 'custom:button-card' entity: sensor.Verbrauchszaehler_Schalter_Esszimmer_MusicCast_Kosten_Jahr layout: vertical show_name: true show_icon: false show_state: true show_label: true name: Jahr styles: card: - background: '#a1a1a1' - border-radius: 0px - height: 50px name: - font-size: x-small - color: '#44739e' - font-weight: bold - font-style: oblique state: - font-size: smaller label: - font-size: smaller state: - value: 0 label: 0 € - type: 'custom:button-card' entity: switch.Schalter_Esszimmer_MusicCast_An layout: vertical show_name: false styles: card: - background: '#a1a1a1' - border-radius: 0px - height: 50px
type: 'custom:vertical-stack-in-card' cards: - type: 'custom:button-card' name: System show_entity_picture: true entity_picture: /static/myimages/nuc.png styles: card: - height: 60px - padding: 0px - margin: 0px grid: - grid-template-areas: '"n i"' - grid-template-columns: 1fr 30% name: - justify-self: start - padding-left: 20px - color: '#0277bd' - font-size: x-large entity_picture: - padding-right: 20px - padding-top: 6px - padding-bottom: 6px img_cell: - justify-content: flex-end - type: divider style: height: 4px background: '#0277bd' - type: divider style: height: 6px - type: horizontal-stack cards: - type: 'custom:button-card' layout: icon_name name: CPU show_icon: true show_state: false icon: 'mdi:raspberry-pi' styles: card: - height: 100% - width: 100% - min-width: 160px grid: - grid-template-areas: '"i n"' - grid-template-columns: 1fr 70% name: - justify-self: start - font-size: smaller - margin: 0px icon: - color: '#0277bd' - type: 'custom:bignumber-card' entity: sensor.System_CPU_Auslastung scale: 13px from: left min: 0 max: 100 severity: - value: 60 style: green - value: 80 style: Gold - value: 100 style: FireBrick - type: divider style: height: 6px - type: horizontal-stack cards: - type: 'custom:button-card' layout: icon_name name: CPU ∅-Last show_icon: true show_state: false icon: 'mdi:raspberry-pi' styles: card: - height: 100% - width: 100% - min-width: 160px grid: - grid-template-areas: '"i n"' - grid-template-columns: 1fr 70% name: - justify-self: start - font-size: smaller - margin: 0px icon: - color: '#0277bd' - type: 'custom:bignumber-card' entity: sensor.System_CPU_Durchschnitt scale: 13px from: left min: 0 max: 100 severity: - value: 60 style: green - value: 80 style: Gold - value: 100 style: FireBrick - type: divider style: height: 6px - type: horizontal-stack cards: - type: 'custom:button-card' layout: icon_name name: Arbeitsspeicher show_icon: true show_state: false show_label: true icon: 'mdi:memory' label: >- [[[ return (states["sensor.System_RAM_used"].state + " GB / " + states["sensor.System_RAM_total"].state + " GB") ]]] styles: card: - height: 100% - width: 100% - min-width: 160px - padding: 2px grid: - grid-template-areas: '"i n" "i l"' - grid-template-rows: min-content min-content - grid-template-columns: 1fr 72% name: - justify-self: start - font-size: smaller - margin: 0px label: - justify-self: start - font-size: x-small - margin: 0px - font-style: italic - color: '#0277bd' icon: - color: '#0277bd' - type: 'custom:bignumber-card' entity: sensor.System_RAM_usedPercent scale: 13px from: left min: 0 max: 100 severity: - value: 60 style: green - value: 75 style: Gold - value: 100 style: FireBrick - type: divider style: height: 6px - type: horizontal-stack cards: - type: 'custom:button-card' layout: icon_name name: 'Win10 (C:)' show_icon: true show_state: false show_label: true icon: 'mdi:harddisk' label: >- [[[ return (states["sensor.System_Laufwerke_C_used"].state + " GB / " + states["sensor.System_Laufwerke_C_Size"].state + " GB") ]]] styles: card: - height: 100% - width: 100% - min-width: 160px - padding: 2px grid: - grid-template-areas: '"i n" "i l"' - grid-template-rows: min-content min-content - grid-template-columns: 1fr 72% name: - justify-self: start - font-size: smaller - margin: 0px label: - justify-self: start - font-size: x-small - margin: 0px - font-style: italic - color: '#0277bd' icon: - color: '#0277bd' - type: 'custom:bignumber-card' entity: sensor.System_Laufwerke_C_usedPercent scale: 13px from: left min: 0 max: 100 severity: - value: 60 style: green - value: 75 style: Gold - value: 100 style: FireBrick - type: divider style: height: 6px - type: horizontal-stack cards: - type: 'custom:button-card' layout: icon_name name: 'Work (D:)' show_icon: true show_state: false show_label: true icon: 'mdi:harddisk' label: >- [[[ return (states["sensor.System_Laufwerke_D_used"].state + " GB / " + states["sensor.System_Laufwerke_D_Size"].state + " GB") ]]] styles: card: - height: 100% - width: 100% - min-width: 160px - padding: 2px grid: - grid-template-areas: '"i n" "i l"' - grid-template-rows: min-content min-content - grid-template-columns: 1fr 72% name: - justify-self: start - font-size: smaller - margin: 0px label: - justify-self: start - font-size: x-small - margin: 0px - font-style: italic - color: '#0277bd' icon: - color: '#0277bd' - type: 'custom:bignumber-card' entity: sensor.System_Laufwerke_D_usedPercent scale: 13px from: left min: 0 max: 100 severity: - value: 60 style: green - value: 75 style: Gold - value: 100 style: FireBrick - type: divider style: height: 6px - type: horizontal-stack cards: - type: 'custom:button-card' layout: icon_name name: 'Backup (Y:)' show_icon: true show_state: false show_label: true icon: 'mdi:harddisk' label: >- [[[ return (states["sensor.System_Laufwerke_Y_used"].state + " GB / " + states["sensor.System_Laufwerke_Y_Size"].state + " GB") ]]] styles: card: - height: 100% - width: 100% - min-width: 160px - padding: 2px grid: - grid-template-areas: '"i n" "i l"' - grid-template-rows: min-content min-content - grid-template-columns: 1fr 72% name: - justify-self: start - font-size: smaller - margin: 0px label: - justify-self: start - font-size: x-small - margin: 0px - font-style: italic - color: '#0277bd' icon: - color: '#0277bd' - type: 'custom:bignumber-card' entity: sensor.System_Laufwerke_Y_usedPercent scale: 13px from: left min: 0 max: 100 severity: - value: 60 style: green - value: 75 style: Gold - value: 100 style: FireBrick - type: divider style: height: 6px - type: horizontal-stack cards: - type: 'custom:button-card' layout: icon_name name: 'Mirror (Z:)' show_icon: true show_state: false show_label: true icon: 'mdi:harddisk' label: >- [[[ return (states["sensor.System_Laufwerke_Z_used"].state + " GB / " + states["sensor.System_Laufwerke_Z_Size"].state + " GB") ]]] styles: card: - height: 100% - width: 100% - min-width: 160px - padding: 2px grid: - grid-template-areas: '"i n" "i l"' - grid-template-rows: min-content min-content - grid-template-columns: 1fr 72% name: - justify-self: start - font-size: smaller - margin: 0px label: - justify-self: start - font-size: x-small - margin: 0px - font-style: italic - color: '#0277bd' icon: - color: '#0277bd' - type: 'custom:bignumber-card' entity: sensor.System_Laufwerke_Z_usedPercent scale: 13px from: left min: 0 max: 100 severity: - value: 60 style: green - value: 75 style: Gold - value: 100 style: FireBrick - type: divider style: height: 6px - type: 'custom:button-card' entity: sensor.Schalter_Flur_Server_An show_name: false show_icon: false tap_action: action: none styles: card: - width: 100% - padding: 2px state: - value: true styles: card: - background: green - value: false styles: card: - background: FireBrick - type: horizontal-stack cards: - type: 'custom:button-card' entity: sensor.Schalter_Flur_Server_Leistung layout: vertical show_name: true show_icon: false show_state: false show_label: true name: Leistung label: | [[[ if(entity.state > 0) return (entity.state + " " + entity.attributes.unit_of_measurement); else return "0 " + entity.attributes.unit_of_measurement; ]]] styles: card: - background: '#a1a1a1' - border-radius: 0px - height: 50px name: - font-size: x-small - color: '#44739e' - font-weight: bold - font-style: oblique state: - font-size: smaller label: - font-size: smaller - type: 'custom:button-card' entity: sensor.Verbrauchszaehler_Schalter_Flur_Server_Verbrauch_Tag layout: vertical show_name: true show_icon: false show_state: false show_label: true name: Heute label: | [[[ return entity.state * 1000 + ' Wh']]] styles: card: - background: '#a1a1a1' - border-radius: 0px - height: 50px name: - font-size: x-small - color: '#44739e' - font-weight: bold - font-style: oblique state: - font-size: smaller label: - font-size: smaller - type: 'custom:button-card' entity: sensor.Verbrauchszaehler_Schalter_Flur_Server_Kosten_Jahr layout: vertical show_name: true show_icon: false show_state: false show_label: true name: Jahr label: | [[[ if(entity.state > 0) return (entity.state + " " + entity.attributes.unit_of_measurement); else return "0 " + entity.attributes.unit_of_measurement; ]]] styles: card: - background: '#a1a1a1' - border-radius: 0px - height: 50px name: - font-size: x-small - color: '#44739e' - font-weight: bold - font-style: oblique state: - font-size: smaller label: - font-size: smaller
type: 'custom:vertical-stack-in-card' cards: - type: 'custom:button-card' name: Raspimatic show_entity_picture: true entity_picture: /static/myimages/raspberrymatic.png tap_action: action: url url: 'http://10.0.124.189/login.htm' styles: card: - height: 60px - padding: 0px - margin: 0px grid: - grid-template-areas: '"n i"' - grid-template-columns: 1fr 20% name: - justify-self: start - padding-left: 20px - color: '#0277bd' - font-size: x-large entity_picture: - padding-right: 20px - padding-top: 6px - padding-bottom: 6px img_cell: - justify-content: flex-end - type: 'custom:button-card' entity: sensor.Netzwerk_Devices_RaspiMatic_Verbunden show_name: false show_icon: false tap_action: action: none styles: card: - width: 100% - padding: 2px state: - value: true styles: card: - background: green - value: false styles: card: - background: FireBrick - type: 'custom:button-card' entity: sensor.Netzwerk_Devices_RaspiMatic_Betriebszeit layout: icon_name name: Betriebszeit show_icon: true show_state: false show_label: true icon: 'mdi:clock-outline' label: | [[[ if (entity.state == "") return "0m"; else return entity.state; ]]] styles: card: - padding-top: 10px - padding-bottom: 10px grid: - grid-template-areas: '"i n l"' - grid-template-columns: 11% 1fr 19% name: - justify-self: start - margin: 0px label: - justify-self: end - padding-right: 20px icon: - color: '#0277bd' - type: 'custom:button-card' entity: sensor.Netzwerk_Devices_RaspiMatic_upgradable layout: icon_name name: Neue Version verfügbar show_icon: true show_state: false show_label: true icon: 'mdi:update' label: | [[[ if (entity.state == false) return "nein"; else return "Ja"; ]]] styles: card: - padding-top: 10px - padding-bottom: 10px grid: - grid-template-areas: '"i n l"' - grid-template-columns: 11% 1fr 19% name: - justify-self: start - margin: 0px label: - justify-self: end - padding-right: 20px icon: - color: | [[[ if (entity.state === true) return "green"; else return '#0277bd'; ]]] - type: 'custom:button-card' entity: sensor.Netzwerk_Devices_RaspiMatic_Alarmmeldungen layout: icon_name name: Alarmmeldungen show_icon: true show_state: false show_label: true icon: 'mdi:alert-octagon' label: | [[[ if (entity.state == 0) return "0"; else return entity.state; ]]] styles: card: - padding-top: 10px - padding-bottom: 10px grid: - grid-template-areas: '"i n l"' - grid-template-columns: 11% 1fr 19% name: - justify-self: start - margin: 0px label: - justify-self: end - padding-right: 20px icon: - color: | [[[ if (entity.state > 0) return "FireBrick"; else return '#0277bd'; ]]] - type: 'custom:button-card' entity: sensor.Netzwerk_Devices_RaspiMatic_Servicemeldungen layout: icon_name name: Servicemeldungen show_icon: true show_state: false show_label: true icon: 'mdi:alert-octagon' label: | [[[ if (entity.state == 0) return "0"; else return entity.state; ]]] styles: card: - padding-top: 10px - padding-bottom: 10px grid: - grid-template-areas: '"i n l"' - grid-template-columns: 11% 1fr 19% name: - justify-self: start - margin: 0px label: - justify-self: end - padding-right: 20px icon: - color: | [[[ if (entity.state > 0) return "Gold"; else return '#0277bd'; ]]] - type: divider style: height: 1px margin-left: 10px margin-right: 10px background: '#0277bd' - type: divider style: height: 6px - type: horizontal-stack cards: - type: 'custom:button-card' layout: icon_name name: Temperatur show_icon: true show_state: false icon: 'mdi:thermometer' styles: card: - height: 100% - width: 100% - min-width: 160px grid: - grid-template-areas: '"i n"' - grid-template-columns: 1fr 70% name: - justify-self: start - font-size: smaller - margin: 0px icon: - color: '#0277bd' - type: 'custom:bignumber-card' entity: sensor.Netzwerk_Devices_RaspiMatic_Temperatur scale: 12px from: left min: 0 max: 100 severity: - value: 50 style: green - value: 55 style: Gold - value: 65 style: FireBrick - type: divider style: height: 6px - type: horizontal-stack cards: - type: 'custom:button-card' layout: icon_name name: CPU show_icon: true show_state: false icon: 'mdi:raspberry-pi' styles: card: - height: 100% - width: 100% - min-width: 160px grid: - grid-template-areas: '"i n"' - grid-template-columns: 1fr 70% name: - justify-self: start - font-size: smaller - margin: 0px icon: - color: '#0277bd' - type: 'custom:bignumber-card' entity: sensor.Netzwerk_Devices_RaspiMatic_Auslastung scale: 12px from: left min: 0 max: 100 severity: - value: 60 style: green - value: 80 style: Gold - value: 100 style: FireBrick - type: divider style: height: 6px - type: horizontal-stack cards: - type: 'custom:button-card' layout: icon_name name: Arbeitsspeicher show_icon: true show_state: false icon: 'mdi:memory' styles: card: - height: 100% - width: 100% - min-width: 160px grid: - grid-template-areas: '"i n"' - grid-template-columns: 1fr 70% name: - justify-self: start - font-size: smaller - margin: 0px icon: - color: '#0277bd' - type: 'custom:bignumber-card' entity: sensor.Netzwerk_Devices_RaspiMatic_RamUsed scale: 12px from: left min: 0 max: 100 severity: - value: 60 style: green - value: 80 style: Gold - value: 100 style: FireBrick - type: divider style: height: 6px - type: horizontal-stack cards: - type: 'custom:button-card' layout: icon_name name: SD-Karte show_icon: true show_state: false icon: 'mdi:micro-sd' styles: card: - height: 100% - width: 100% - min-width: 160px grid: - grid-template-areas: '"i n"' - grid-template-columns: 1fr 70% name: - justify-self: start - font-size: smaller - margin: 0px icon: - color: '#0277bd' - type: 'custom:bignumber-card' entity: sensor.Netzwerk_Devices_RaspiMatic_SdUsed scale: 12px from: left min: 0 max: 100 severity: - value: 60 style: green - value: 75 style: Gold - value: 100 style: FireBrick - type: divider style: height: 6px - type: horizontal-stack cards: - type: 'custom:button-card' layout: icon_name name: Duty Cycle show_icon: true show_state: false icon: 'mdi:chart-line-variant' styles: card: - height: 100% - width: 100% - min-width: 160px grid: - grid-template-areas: '"i n"' - grid-template-columns: 1fr 70% name: - justify-self: start - font-size: smaller - margin: 0px icon: - color: '#0277bd' - type: 'custom:bignumber-card' entity: sensor.Netzwerk_Devices_RaspiMatic_DutyCycle scale: 12px from: left min: 0 max: 100 severity: - value: 50 style: green - value: 70 style: Gold - value: 100 style: FireBrick - type: divider style: height: 6pxBar-Chart

type: 'custom:vertical-stack-in-card' cards: - type: 'custom:mini-graph-card' entities: - entity: sensor.Verbrauchszaehler_Licht_Summe_Verbrauch__Tag_Tag_1 color: '#44739e' name: Lichter Energie gesamt name: Lichter Energie gesamt hour24: true points_per_hour: 0.041 hours_to_show: 168 decimals: 3 show: graph: bar name: false icon: false - type: horizontal-stack cards: - type: 'custom:button-card' entity: sensor.Licht_Leistung layout: vertical show_name: true show_icon: false show_state: false show_label: true name: Leistung label: | [[[ if(entity.state > 0) return (entity.state + " " + entity.attributes.unit_of_measurement); else return "0 " + entity.attributes.unit_of_measurement; ]]] styles: card: - background: '#a1a1a1' - border-radius: 0px - height: 50px name: - font-size: x-small - color: '#44739e' - font-weight: bold - font-style: oblique state: - font-size: smaller label: - font-size: smaller - type: 'custom:button-card' entity: sensor.Verbrauchszaehler_Licht_Summe_Kosten_Jahr layout: vertical show_name: true show_icon: false show_state: false show_label: true name: Jahr label: | [[[ if(entity.state > 0) return (entity.state + " " + entity.attributes.unit_of_measurement); else return "0 " + entity.attributes.unit_of_measurement; ]]] styles: card: - background: '#a1a1a1' - border-radius: 0px - height: 50px name: - font-size: x-small - color: '#44739e' - font-weight: bold - font-style: oblique state: - font-size: smaller label: - font-size: smaller<a href="https://github.com/Scrounger/ioBroker.linkeddevices">LinkedDevices Adapter</a>
<a href="https://github.com/Scrounger/ioBroker.vis-materialdesign">Material Design Widgets</a>
-
Hier mal ein paar Beispiele, was ich so mit lovelace realisiert habe.
Hauptsächlich verwende ich die button-card, da diese sehr viel Flexibilität ermöglicht und man so mit manuellen entities sehr gut arbeiten kann.
Anwesenheit

type: horizontal-stack cards: - type: 'custom:vertical-stack-in-card' cards: - type: 'custom:button-card' entity: sensor.Netzwerk_Devices_Tussi_Anwesend layout: vertical show_name: true show_last_changed: true show_entity_picture: true show_icon: false tap_action: action: none styles: label: - font-size: small - font-style: italic - color: '#a1a1a1' state: - value: true entity_picture: /static/myimages/tussi_presence.png name: anwesend - value: false entity_picture: /static/myimages/tussi_presence.png name: abwesend styles: icon: - filter: grayscale(100%) - type: 'custom:button-card' entity: sensor.Netzwerk_Devices_Tussi_Anwesend show_name: false show_icon: false styles: card: - width: 100% - padding: 2px state: - value: true styles: card: - background: green - value: false styles: card: - background: FireBrick - type: 'custom:vertical-stack-in-card' cards: - type: 'custom:button-card' entity: sensor.Netzwerk_Devices_Handy_Anwesend layout: vertical show_name: true show_last_changed: true show_entity_picture: true show_icon: false tap_action: action: none styles: label: - font-size: small - font-style: italic - color: '#a1a1a1' state: - value: true entity_picture: /static/myimages/ich_presence.png name: anwesend - value: false entity_picture: /static/myimages/ich_presence.png name: abwesend styles: icon: - filter: grayscale(100%) - type: 'custom:button-card' entity: sensor.Netzwerk_Devices_Handy_Anwesend show_name: false show_icon: false styles: card: - width: 100% - padding: 2px state: - value: true styles: card: - background: green - value: false styles: card: - background: FireBrickFenster

type: horizontal-stack cards: - type: 'custom:vertical-stack-in-card' cards: - type: 'custom:button-card' entity: sensor.Sensoren_Fenster_Bad_Offen layout: vertical show_name: false show_entity_picture: true show_icon: false show_last_changed: true tap_action: action: none styles: label: - font-size: small - font-style: italic - color: '#a1a1a1' state: - value: true entity_picture: /static/myimages/window_open.png name: offen show_last_changed: true - value: false entity_picture: /static/myimages/window_closed.png name: geschlossen show_last_changed: false - type: 'custom:vertical-stack-in-card' cards: - type: 'custom:button-card' entity: sensor.Sensoren_Fenster_WC_Offen layout: vertical show_name: false show_entity_picture: true show_icon: false show_last_changed: true tap_action: action: none styles: label: - font-size: small - font-style: italic - color: '#a1a1a1' state: - value: true entity_picture: /static/myimages/window_open.png name: offen show_last_changed: true - value: false entity_picture: /static/myimages/window_closed.png name: geschlossen show_last_changed: falseLicht - Schalter

type: vertical-stack cards: - type: horizontal-stack cards: - type: 'custom:vertical-stack-in-card' cards: - type: entity-button tap_action: action: toggle hold_action: action: more-info show_icon: true show_name: true entity: light.Licht_Flur_Main_An name: Flur - type: horizontal-stack cards: - type: 'custom:button-card' entity: sensor.Licht_Flur_Main_Leistung layout: vertical show_name: true show_icon: false show_state: false show_label: true name: Leistung label: | [[[ if(entity.state > 0) return (entity.state + " " + entity.attributes.unit_of_measurement); else return "0 " + entity.attributes.unit_of_measurement; ]]] styles: card: - background: '#a1a1a1' - border-radius: 0px - height: 50px name: - font-size: x-small - color: '#44739e' - font-weight: bold - font-style: oblique state: - font-size: smaller label: - font-size: smaller - type: 'custom:button-card' entity: sensor.Verbrauchszaehler_Licht_Flur_Main_Verbrauch_Tag layout: vertical show_name: true show_icon: false show_state: false show_label: true name: Heute label: | [[[ return entity.state * 1000 + ' Wh']]] styles: card: - background: '#a1a1a1' - border-radius: 0px - height: 50px name: - font-size: x-small - color: '#44739e' - font-weight: bold - font-style: oblique state: - font-size: smaller label: - font-size: smaller - type: 'custom:button-card' entity: sensor.Verbrauchszaehler_Licht_Flur_Main_Kosten_Jahr layout: vertical show_name: true show_icon: false show_state: false show_label: true name: Jahr label: | [[[ if(entity.state > 0) return (entity.state + " " + entity.attributes.unit_of_measurement); else return "0 " + entity.attributes.unit_of_measurement; ]]] styles: card: - background: '#a1a1a1' - border-radius: 0px - height: 50px name: - font-size: x-small - color: '#44739e' - font-weight: bold - font-style: oblique state: - font-size: smaller label: - font-size: smaller - type: 'custom:vertical-stack-in-card' cards: - type: entity-button tap_action: action: toggle hold_action: action: more-info show_icon: true show_name: true entity: light.Licht_Flur_Nische_An name: Nische - type: horizontal-stack cards: - type: 'custom:button-card' entity: sensor.Licht_Flur_Nische_Leistung layout: vertical show_name: true show_icon: false show_state: false show_label: true name: Leistung label: | [[[ if(entity.state > 0) return (entity.state + " " + entity.attributes.unit_of_measurement); else return "0 " + entity.attributes.unit_of_measurement; ]]] styles: card: - background: '#a1a1a1' - border-radius: 0px - height: 50px name: - font-size: x-small - color: '#44739e' - font-weight: bold - font-style: oblique state: - font-size: smaller label: - font-size: smaller - type: 'custom:button-card' entity: sensor.Verbrauchszaehler_Licht_Flur_Nische_Verbrauch_Tag layout: vertical show_name: true show_icon: false show_state: false show_label: true name: Heute label: | [[[ return entity.state * 1000 + ' Wh']]] styles: card: - background: '#a1a1a1' - border-radius: 0px - height: 50px name: - font-size: x-small - color: '#44739e' - font-weight: bold - font-style: oblique state: - font-size: smaller label: - font-size: smaller - type: 'custom:button-card' entity: sensor.Verbrauchszaehler_Licht_Flur_Nische_Kosten_Jahr layout: vertical show_name: true show_icon: false show_state: false show_label: true name: Jahr label: | [[[ if(entity.state > 0) return (entity.state + " " + entity.attributes.unit_of_measurement); else return "0 " + entity.attributes.unit_of_measurement; ]]] styles: card: - background: '#a1a1a1' - border-radius: 0px - height: 50px name: - font-size: x-small - color: '#44739e' - font-weight: bold - font-style: oblique state: - font-size: smaller label: - font-size: smallerLicht - Dimmer

type: 'custom:vertical-stack-in-card' title: Esszimmer cards: - type: horizontal-stack cards: - type: light entity: light.Licht_Esszimmer_Links_Dimmer name: Links - type: light entity: light.Licht_Esszimmer_Rechts_Dimmer name: Rechts - type: horizontal-stack cards: - type: 'custom:button-card' entity: sensor.Licht_Esszimmer_Gruppe_SummeLeistung layout: vertical show_name: true show_icon: false show_state: false show_label: true name: Leistung label: | [[[ if(entity.state > 0) return (entity.state + " " + entity.attributes.unit_of_measurement); else return "0 " + entity.attributes.unit_of_measurement; ]]] styles: card: - background: '#a1a1a1' - border-radius: 0px - height: 50px name: - font-size: x-small - color: '#44739e' - font-weight: bold - font-style: oblique state: - font-size: smaller label: - font-size: smaller - type: 'custom:button-card' entity: sensor.Verbrauchszaehler_Licht_Esszimmer_Gruppe_Verbrauch_Tag layout: vertical show_name: true show_icon: false show_state: false show_label: true name: Heute label: | [[[ return entity.state * 1000 + ' Wh']]] styles: card: - background: '#a1a1a1' - border-radius: 0px - height: 50px name: - font-size: x-small - color: '#44739e' - font-weight: bold - font-style: oblique state: - font-size: smaller label: - font-size: smaller - type: 'custom:button-card' entity: sensor.Verbrauchszaehler_Licht_Esszimmer_Gruppe_Kosten_Jahr layout: vertical show_name: true show_icon: false show_state: false show_label: true name: Jahr label: | [[[ if(entity.state > 0) return (entity.state + " " + entity.attributes.unit_of_measurement); else return "0 " + entity.attributes.unit_of_measurement; ]]] styles: card: - background: '#a1a1a1' - border-radius: 0px - height: 50px name: - font-size: x-small - color: '#44739e' - font-weight: bold - font-style: oblique state: - font-size: smaller label: - font-size: smallerGeräte

type: 'custom:vertical-stack-in-card' cards: - type: 'custom:button-card' entity: switch.Netzwerk_Devices_MusicCast_Esszimmer_An layout: vertical show_name: false show_entity_picture: true tap_action: action: toggle size: 30% state: - value: 'on' entity_picture: /static/myimages/MusicCast-WX-030.png styles: card: - background: LemonChiffon - value: 'off' entity_picture: /static/myimages/MusicCast-WX-030.png - type: 'custom:button-card' entity: sensor.Netzwerk_Devices_MusicCast_Esszimmer_PowerStatus show_name: false show_icon: false tap_action: action: none styles: card: - width: 100% - padding: 2px - margin-top: '-10px' state: - value: An styles: card: - background: green - value: Aus styles: card: - background: FireBrick - value: Boot styles: card: - background: MediumSeaGreen - animation: blink 2s ease infinite - value: Standby styles: card: - background: Orange - value: Enter Standby styles: card: - background: Orange - animation: blink 2s ease infinite - value: Leave Standby styles: card: - background: Orange - animation: blink 2s ease infinite - type: horizontal-stack cards: - type: 'custom:button-card' entity: sensor.Netzwerk_Devices_MusicCast_Esszimmer_PowerStatus layout: vertical show_name: true show_icon: false show_state: true name: Status styles: card: - background: '#a1a1a1' - border-radius: 0px - height: 50px name: - font-size: x-small - color: '#44739e' - font-weight: bold - font-style: oblique state: - font-size: smaller - type: 'custom:button-card' entity: sensor.Schalter_Esszimmer_MusicCast_Leistung layout: vertical show_name: true show_icon: false show_state: true show_label: true name: Leistung styles: card: - background: '#a1a1a1' - border-radius: 0px - height: 50px name: - font-size: x-small - color: '#44739e' - font-weight: bold - font-style: oblique state: - font-size: smaller label: - font-size: smaller state: - value: 0 label: 0 W - type: 'custom:button-card' entity: sensor.Verbrauchszaehler_Schalter_Esszimmer_MusicCast_Kosten_Jahr layout: vertical show_name: true show_icon: false show_state: true show_label: true name: Jahr styles: card: - background: '#a1a1a1' - border-radius: 0px - height: 50px name: - font-size: x-small - color: '#44739e' - font-weight: bold - font-style: oblique state: - font-size: smaller label: - font-size: smaller state: - value: 0 label: 0 € - type: 'custom:button-card' entity: switch.Schalter_Esszimmer_MusicCast_An layout: vertical show_name: false styles: card: - background: '#a1a1a1' - border-radius: 0px - height: 50px
type: 'custom:vertical-stack-in-card' cards: - type: 'custom:button-card' name: System show_entity_picture: true entity_picture: /static/myimages/nuc.png styles: card: - height: 60px - padding: 0px - margin: 0px grid: - grid-template-areas: '"n i"' - grid-template-columns: 1fr 30% name: - justify-self: start - padding-left: 20px - color: '#0277bd' - font-size: x-large entity_picture: - padding-right: 20px - padding-top: 6px - padding-bottom: 6px img_cell: - justify-content: flex-end - type: divider style: height: 4px background: '#0277bd' - type: divider style: height: 6px - type: horizontal-stack cards: - type: 'custom:button-card' layout: icon_name name: CPU show_icon: true show_state: false icon: 'mdi:raspberry-pi' styles: card: - height: 100% - width: 100% - min-width: 160px grid: - grid-template-areas: '"i n"' - grid-template-columns: 1fr 70% name: - justify-self: start - font-size: smaller - margin: 0px icon: - color: '#0277bd' - type: 'custom:bignumber-card' entity: sensor.System_CPU_Auslastung scale: 13px from: left min: 0 max: 100 severity: - value: 60 style: green - value: 80 style: Gold - value: 100 style: FireBrick - type: divider style: height: 6px - type: horizontal-stack cards: - type: 'custom:button-card' layout: icon_name name: CPU ∅-Last show_icon: true show_state: false icon: 'mdi:raspberry-pi' styles: card: - height: 100% - width: 100% - min-width: 160px grid: - grid-template-areas: '"i n"' - grid-template-columns: 1fr 70% name: - justify-self: start - font-size: smaller - margin: 0px icon: - color: '#0277bd' - type: 'custom:bignumber-card' entity: sensor.System_CPU_Durchschnitt scale: 13px from: left min: 0 max: 100 severity: - value: 60 style: green - value: 80 style: Gold - value: 100 style: FireBrick - type: divider style: height: 6px - type: horizontal-stack cards: - type: 'custom:button-card' layout: icon_name name: Arbeitsspeicher show_icon: true show_state: false show_label: true icon: 'mdi:memory' label: >- [[[ return (states["sensor.System_RAM_used"].state + " GB / " + states["sensor.System_RAM_total"].state + " GB") ]]] styles: card: - height: 100% - width: 100% - min-width: 160px - padding: 2px grid: - grid-template-areas: '"i n" "i l"' - grid-template-rows: min-content min-content - grid-template-columns: 1fr 72% name: - justify-self: start - font-size: smaller - margin: 0px label: - justify-self: start - font-size: x-small - margin: 0px - font-style: italic - color: '#0277bd' icon: - color: '#0277bd' - type: 'custom:bignumber-card' entity: sensor.System_RAM_usedPercent scale: 13px from: left min: 0 max: 100 severity: - value: 60 style: green - value: 75 style: Gold - value: 100 style: FireBrick - type: divider style: height: 6px - type: horizontal-stack cards: - type: 'custom:button-card' layout: icon_name name: 'Win10 (C:)' show_icon: true show_state: false show_label: true icon: 'mdi:harddisk' label: >- [[[ return (states["sensor.System_Laufwerke_C_used"].state + " GB / " + states["sensor.System_Laufwerke_C_Size"].state + " GB") ]]] styles: card: - height: 100% - width: 100% - min-width: 160px - padding: 2px grid: - grid-template-areas: '"i n" "i l"' - grid-template-rows: min-content min-content - grid-template-columns: 1fr 72% name: - justify-self: start - font-size: smaller - margin: 0px label: - justify-self: start - font-size: x-small - margin: 0px - font-style: italic - color: '#0277bd' icon: - color: '#0277bd' - type: 'custom:bignumber-card' entity: sensor.System_Laufwerke_C_usedPercent scale: 13px from: left min: 0 max: 100 severity: - value: 60 style: green - value: 75 style: Gold - value: 100 style: FireBrick - type: divider style: height: 6px - type: horizontal-stack cards: - type: 'custom:button-card' layout: icon_name name: 'Work (D:)' show_icon: true show_state: false show_label: true icon: 'mdi:harddisk' label: >- [[[ return (states["sensor.System_Laufwerke_D_used"].state + " GB / " + states["sensor.System_Laufwerke_D_Size"].state + " GB") ]]] styles: card: - height: 100% - width: 100% - min-width: 160px - padding: 2px grid: - grid-template-areas: '"i n" "i l"' - grid-template-rows: min-content min-content - grid-template-columns: 1fr 72% name: - justify-self: start - font-size: smaller - margin: 0px label: - justify-self: start - font-size: x-small - margin: 0px - font-style: italic - color: '#0277bd' icon: - color: '#0277bd' - type: 'custom:bignumber-card' entity: sensor.System_Laufwerke_D_usedPercent scale: 13px from: left min: 0 max: 100 severity: - value: 60 style: green - value: 75 style: Gold - value: 100 style: FireBrick - type: divider style: height: 6px - type: horizontal-stack cards: - type: 'custom:button-card' layout: icon_name name: 'Backup (Y:)' show_icon: true show_state: false show_label: true icon: 'mdi:harddisk' label: >- [[[ return (states["sensor.System_Laufwerke_Y_used"].state + " GB / " + states["sensor.System_Laufwerke_Y_Size"].state + " GB") ]]] styles: card: - height: 100% - width: 100% - min-width: 160px - padding: 2px grid: - grid-template-areas: '"i n" "i l"' - grid-template-rows: min-content min-content - grid-template-columns: 1fr 72% name: - justify-self: start - font-size: smaller - margin: 0px label: - justify-self: start - font-size: x-small - margin: 0px - font-style: italic - color: '#0277bd' icon: - color: '#0277bd' - type: 'custom:bignumber-card' entity: sensor.System_Laufwerke_Y_usedPercent scale: 13px from: left min: 0 max: 100 severity: - value: 60 style: green - value: 75 style: Gold - value: 100 style: FireBrick - type: divider style: height: 6px - type: horizontal-stack cards: - type: 'custom:button-card' layout: icon_name name: 'Mirror (Z:)' show_icon: true show_state: false show_label: true icon: 'mdi:harddisk' label: >- [[[ return (states["sensor.System_Laufwerke_Z_used"].state + " GB / " + states["sensor.System_Laufwerke_Z_Size"].state + " GB") ]]] styles: card: - height: 100% - width: 100% - min-width: 160px - padding: 2px grid: - grid-template-areas: '"i n" "i l"' - grid-template-rows: min-content min-content - grid-template-columns: 1fr 72% name: - justify-self: start - font-size: smaller - margin: 0px label: - justify-self: start - font-size: x-small - margin: 0px - font-style: italic - color: '#0277bd' icon: - color: '#0277bd' - type: 'custom:bignumber-card' entity: sensor.System_Laufwerke_Z_usedPercent scale: 13px from: left min: 0 max: 100 severity: - value: 60 style: green - value: 75 style: Gold - value: 100 style: FireBrick - type: divider style: height: 6px - type: 'custom:button-card' entity: sensor.Schalter_Flur_Server_An show_name: false show_icon: false tap_action: action: none styles: card: - width: 100% - padding: 2px state: - value: true styles: card: - background: green - value: false styles: card: - background: FireBrick - type: horizontal-stack cards: - type: 'custom:button-card' entity: sensor.Schalter_Flur_Server_Leistung layout: vertical show_name: true show_icon: false show_state: false show_label: true name: Leistung label: | [[[ if(entity.state > 0) return (entity.state + " " + entity.attributes.unit_of_measurement); else return "0 " + entity.attributes.unit_of_measurement; ]]] styles: card: - background: '#a1a1a1' - border-radius: 0px - height: 50px name: - font-size: x-small - color: '#44739e' - font-weight: bold - font-style: oblique state: - font-size: smaller label: - font-size: smaller - type: 'custom:button-card' entity: sensor.Verbrauchszaehler_Schalter_Flur_Server_Verbrauch_Tag layout: vertical show_name: true show_icon: false show_state: false show_label: true name: Heute label: | [[[ return entity.state * 1000 + ' Wh']]] styles: card: - background: '#a1a1a1' - border-radius: 0px - height: 50px name: - font-size: x-small - color: '#44739e' - font-weight: bold - font-style: oblique state: - font-size: smaller label: - font-size: smaller - type: 'custom:button-card' entity: sensor.Verbrauchszaehler_Schalter_Flur_Server_Kosten_Jahr layout: vertical show_name: true show_icon: false show_state: false show_label: true name: Jahr label: | [[[ if(entity.state > 0) return (entity.state + " " + entity.attributes.unit_of_measurement); else return "0 " + entity.attributes.unit_of_measurement; ]]] styles: card: - background: '#a1a1a1' - border-radius: 0px - height: 50px name: - font-size: x-small - color: '#44739e' - font-weight: bold - font-style: oblique state: - font-size: smaller label: - font-size: smaller
type: 'custom:vertical-stack-in-card' cards: - type: 'custom:button-card' name: Raspimatic show_entity_picture: true entity_picture: /static/myimages/raspberrymatic.png tap_action: action: url url: 'http://10.0.124.189/login.htm' styles: card: - height: 60px - padding: 0px - margin: 0px grid: - grid-template-areas: '"n i"' - grid-template-columns: 1fr 20% name: - justify-self: start - padding-left: 20px - color: '#0277bd' - font-size: x-large entity_picture: - padding-right: 20px - padding-top: 6px - padding-bottom: 6px img_cell: - justify-content: flex-end - type: 'custom:button-card' entity: sensor.Netzwerk_Devices_RaspiMatic_Verbunden show_name: false show_icon: false tap_action: action: none styles: card: - width: 100% - padding: 2px state: - value: true styles: card: - background: green - value: false styles: card: - background: FireBrick - type: 'custom:button-card' entity: sensor.Netzwerk_Devices_RaspiMatic_Betriebszeit layout: icon_name name: Betriebszeit show_icon: true show_state: false show_label: true icon: 'mdi:clock-outline' label: | [[[ if (entity.state == "") return "0m"; else return entity.state; ]]] styles: card: - padding-top: 10px - padding-bottom: 10px grid: - grid-template-areas: '"i n l"' - grid-template-columns: 11% 1fr 19% name: - justify-self: start - margin: 0px label: - justify-self: end - padding-right: 20px icon: - color: '#0277bd' - type: 'custom:button-card' entity: sensor.Netzwerk_Devices_RaspiMatic_upgradable layout: icon_name name: Neue Version verfügbar show_icon: true show_state: false show_label: true icon: 'mdi:update' label: | [[[ if (entity.state == false) return "nein"; else return "Ja"; ]]] styles: card: - padding-top: 10px - padding-bottom: 10px grid: - grid-template-areas: '"i n l"' - grid-template-columns: 11% 1fr 19% name: - justify-self: start - margin: 0px label: - justify-self: end - padding-right: 20px icon: - color: | [[[ if (entity.state === true) return "green"; else return '#0277bd'; ]]] - type: 'custom:button-card' entity: sensor.Netzwerk_Devices_RaspiMatic_Alarmmeldungen layout: icon_name name: Alarmmeldungen show_icon: true show_state: false show_label: true icon: 'mdi:alert-octagon' label: | [[[ if (entity.state == 0) return "0"; else return entity.state; ]]] styles: card: - padding-top: 10px - padding-bottom: 10px grid: - grid-template-areas: '"i n l"' - grid-template-columns: 11% 1fr 19% name: - justify-self: start - margin: 0px label: - justify-self: end - padding-right: 20px icon: - color: | [[[ if (entity.state > 0) return "FireBrick"; else return '#0277bd'; ]]] - type: 'custom:button-card' entity: sensor.Netzwerk_Devices_RaspiMatic_Servicemeldungen layout: icon_name name: Servicemeldungen show_icon: true show_state: false show_label: true icon: 'mdi:alert-octagon' label: | [[[ if (entity.state == 0) return "0"; else return entity.state; ]]] styles: card: - padding-top: 10px - padding-bottom: 10px grid: - grid-template-areas: '"i n l"' - grid-template-columns: 11% 1fr 19% name: - justify-self: start - margin: 0px label: - justify-self: end - padding-right: 20px icon: - color: | [[[ if (entity.state > 0) return "Gold"; else return '#0277bd'; ]]] - type: divider style: height: 1px margin-left: 10px margin-right: 10px background: '#0277bd' - type: divider style: height: 6px - type: horizontal-stack cards: - type: 'custom:button-card' layout: icon_name name: Temperatur show_icon: true show_state: false icon: 'mdi:thermometer' styles: card: - height: 100% - width: 100% - min-width: 160px grid: - grid-template-areas: '"i n"' - grid-template-columns: 1fr 70% name: - justify-self: start - font-size: smaller - margin: 0px icon: - color: '#0277bd' - type: 'custom:bignumber-card' entity: sensor.Netzwerk_Devices_RaspiMatic_Temperatur scale: 12px from: left min: 0 max: 100 severity: - value: 50 style: green - value: 55 style: Gold - value: 65 style: FireBrick - type: divider style: height: 6px - type: horizontal-stack cards: - type: 'custom:button-card' layout: icon_name name: CPU show_icon: true show_state: false icon: 'mdi:raspberry-pi' styles: card: - height: 100% - width: 100% - min-width: 160px grid: - grid-template-areas: '"i n"' - grid-template-columns: 1fr 70% name: - justify-self: start - font-size: smaller - margin: 0px icon: - color: '#0277bd' - type: 'custom:bignumber-card' entity: sensor.Netzwerk_Devices_RaspiMatic_Auslastung scale: 12px from: left min: 0 max: 100 severity: - value: 60 style: green - value: 80 style: Gold - value: 100 style: FireBrick - type: divider style: height: 6px - type: horizontal-stack cards: - type: 'custom:button-card' layout: icon_name name: Arbeitsspeicher show_icon: true show_state: false icon: 'mdi:memory' styles: card: - height: 100% - width: 100% - min-width: 160px grid: - grid-template-areas: '"i n"' - grid-template-columns: 1fr 70% name: - justify-self: start - font-size: smaller - margin: 0px icon: - color: '#0277bd' - type: 'custom:bignumber-card' entity: sensor.Netzwerk_Devices_RaspiMatic_RamUsed scale: 12px from: left min: 0 max: 100 severity: - value: 60 style: green - value: 80 style: Gold - value: 100 style: FireBrick - type: divider style: height: 6px - type: horizontal-stack cards: - type: 'custom:button-card' layout: icon_name name: SD-Karte show_icon: true show_state: false icon: 'mdi:micro-sd' styles: card: - height: 100% - width: 100% - min-width: 160px grid: - grid-template-areas: '"i n"' - grid-template-columns: 1fr 70% name: - justify-self: start - font-size: smaller - margin: 0px icon: - color: '#0277bd' - type: 'custom:bignumber-card' entity: sensor.Netzwerk_Devices_RaspiMatic_SdUsed scale: 12px from: left min: 0 max: 100 severity: - value: 60 style: green - value: 75 style: Gold - value: 100 style: FireBrick - type: divider style: height: 6px - type: horizontal-stack cards: - type: 'custom:button-card' layout: icon_name name: Duty Cycle show_icon: true show_state: false icon: 'mdi:chart-line-variant' styles: card: - height: 100% - width: 100% - min-width: 160px grid: - grid-template-areas: '"i n"' - grid-template-columns: 1fr 70% name: - justify-self: start - font-size: smaller - margin: 0px icon: - color: '#0277bd' - type: 'custom:bignumber-card' entity: sensor.Netzwerk_Devices_RaspiMatic_DutyCycle scale: 12px from: left min: 0 max: 100 severity: - value: 50 style: green - value: 70 style: Gold - value: 100 style: FireBrick - type: divider style: height: 6pxBar-Chart

type: 'custom:vertical-stack-in-card' cards: - type: 'custom:mini-graph-card' entities: - entity: sensor.Verbrauchszaehler_Licht_Summe_Verbrauch__Tag_Tag_1 color: '#44739e' name: Lichter Energie gesamt name: Lichter Energie gesamt hour24: true points_per_hour: 0.041 hours_to_show: 168 decimals: 3 show: graph: bar name: false icon: false - type: horizontal-stack cards: - type: 'custom:button-card' entity: sensor.Licht_Leistung layout: vertical show_name: true show_icon: false show_state: false show_label: true name: Leistung label: | [[[ if(entity.state > 0) return (entity.state + " " + entity.attributes.unit_of_measurement); else return "0 " + entity.attributes.unit_of_measurement; ]]] styles: card: - background: '#a1a1a1' - border-radius: 0px - height: 50px name: - font-size: x-small - color: '#44739e' - font-weight: bold - font-style: oblique state: - font-size: smaller label: - font-size: smaller - type: 'custom:button-card' entity: sensor.Verbrauchszaehler_Licht_Summe_Kosten_Jahr layout: vertical show_name: true show_icon: false show_state: false show_label: true name: Jahr label: | [[[ if(entity.state > 0) return (entity.state + " " + entity.attributes.unit_of_measurement); else return "0 " + entity.attributes.unit_of_measurement; ]]] styles: card: - background: '#a1a1a1' - border-radius: 0px - height: 50px name: - font-size: x-small - color: '#44739e' - font-weight: bold - font-style: oblique state: - font-size: smaller label: - font-size: smallerTussi anwesend ist ein interessanter DP

Bitte benutzt das Voting rechts unten im Beitrag wenn er euch geholfen hat.
Immer Daten sichern! -
Hier mal ein paar Beispiele, was ich so mit lovelace realisiert habe.
Hauptsächlich verwende ich die button-card, da diese sehr viel Flexibilität ermöglicht und man so mit manuellen entities sehr gut arbeiten kann.
Anwesenheit

type: horizontal-stack cards: - type: 'custom:vertical-stack-in-card' cards: - type: 'custom:button-card' entity: sensor.Netzwerk_Devices_Tussi_Anwesend layout: vertical show_name: true show_last_changed: true show_entity_picture: true show_icon: false tap_action: action: none styles: label: - font-size: small - font-style: italic - color: '#a1a1a1' state: - value: true entity_picture: /static/myimages/tussi_presence.png name: anwesend - value: false entity_picture: /static/myimages/tussi_presence.png name: abwesend styles: icon: - filter: grayscale(100%) - type: 'custom:button-card' entity: sensor.Netzwerk_Devices_Tussi_Anwesend show_name: false show_icon: false styles: card: - width: 100% - padding: 2px state: - value: true styles: card: - background: green - value: false styles: card: - background: FireBrick - type: 'custom:vertical-stack-in-card' cards: - type: 'custom:button-card' entity: sensor.Netzwerk_Devices_Handy_Anwesend layout: vertical show_name: true show_last_changed: true show_entity_picture: true show_icon: false tap_action: action: none styles: label: - font-size: small - font-style: italic - color: '#a1a1a1' state: - value: true entity_picture: /static/myimages/ich_presence.png name: anwesend - value: false entity_picture: /static/myimages/ich_presence.png name: abwesend styles: icon: - filter: grayscale(100%) - type: 'custom:button-card' entity: sensor.Netzwerk_Devices_Handy_Anwesend show_name: false show_icon: false styles: card: - width: 100% - padding: 2px state: - value: true styles: card: - background: green - value: false styles: card: - background: FireBrickFenster

type: horizontal-stack cards: - type: 'custom:vertical-stack-in-card' cards: - type: 'custom:button-card' entity: sensor.Sensoren_Fenster_Bad_Offen layout: vertical show_name: false show_entity_picture: true show_icon: false show_last_changed: true tap_action: action: none styles: label: - font-size: small - font-style: italic - color: '#a1a1a1' state: - value: true entity_picture: /static/myimages/window_open.png name: offen show_last_changed: true - value: false entity_picture: /static/myimages/window_closed.png name: geschlossen show_last_changed: false - type: 'custom:vertical-stack-in-card' cards: - type: 'custom:button-card' entity: sensor.Sensoren_Fenster_WC_Offen layout: vertical show_name: false show_entity_picture: true show_icon: false show_last_changed: true tap_action: action: none styles: label: - font-size: small - font-style: italic - color: '#a1a1a1' state: - value: true entity_picture: /static/myimages/window_open.png name: offen show_last_changed: true - value: false entity_picture: /static/myimages/window_closed.png name: geschlossen show_last_changed: falseLicht - Schalter

type: vertical-stack cards: - type: horizontal-stack cards: - type: 'custom:vertical-stack-in-card' cards: - type: entity-button tap_action: action: toggle hold_action: action: more-info show_icon: true show_name: true entity: light.Licht_Flur_Main_An name: Flur - type: horizontal-stack cards: - type: 'custom:button-card' entity: sensor.Licht_Flur_Main_Leistung layout: vertical show_name: true show_icon: false show_state: false show_label: true name: Leistung label: | [[[ if(entity.state > 0) return (entity.state + " " + entity.attributes.unit_of_measurement); else return "0 " + entity.attributes.unit_of_measurement; ]]] styles: card: - background: '#a1a1a1' - border-radius: 0px - height: 50px name: - font-size: x-small - color: '#44739e' - font-weight: bold - font-style: oblique state: - font-size: smaller label: - font-size: smaller - type: 'custom:button-card' entity: sensor.Verbrauchszaehler_Licht_Flur_Main_Verbrauch_Tag layout: vertical show_name: true show_icon: false show_state: false show_label: true name: Heute label: | [[[ return entity.state * 1000 + ' Wh']]] styles: card: - background: '#a1a1a1' - border-radius: 0px - height: 50px name: - font-size: x-small - color: '#44739e' - font-weight: bold - font-style: oblique state: - font-size: smaller label: - font-size: smaller - type: 'custom:button-card' entity: sensor.Verbrauchszaehler_Licht_Flur_Main_Kosten_Jahr layout: vertical show_name: true show_icon: false show_state: false show_label: true name: Jahr label: | [[[ if(entity.state > 0) return (entity.state + " " + entity.attributes.unit_of_measurement); else return "0 " + entity.attributes.unit_of_measurement; ]]] styles: card: - background: '#a1a1a1' - border-radius: 0px - height: 50px name: - font-size: x-small - color: '#44739e' - font-weight: bold - font-style: oblique state: - font-size: smaller label: - font-size: smaller - type: 'custom:vertical-stack-in-card' cards: - type: entity-button tap_action: action: toggle hold_action: action: more-info show_icon: true show_name: true entity: light.Licht_Flur_Nische_An name: Nische - type: horizontal-stack cards: - type: 'custom:button-card' entity: sensor.Licht_Flur_Nische_Leistung layout: vertical show_name: true show_icon: false show_state: false show_label: true name: Leistung label: | [[[ if(entity.state > 0) return (entity.state + " " + entity.attributes.unit_of_measurement); else return "0 " + entity.attributes.unit_of_measurement; ]]] styles: card: - background: '#a1a1a1' - border-radius: 0px - height: 50px name: - font-size: x-small - color: '#44739e' - font-weight: bold - font-style: oblique state: - font-size: smaller label: - font-size: smaller - type: 'custom:button-card' entity: sensor.Verbrauchszaehler_Licht_Flur_Nische_Verbrauch_Tag layout: vertical show_name: true show_icon: false show_state: false show_label: true name: Heute label: | [[[ return entity.state * 1000 + ' Wh']]] styles: card: - background: '#a1a1a1' - border-radius: 0px - height: 50px name: - font-size: x-small - color: '#44739e' - font-weight: bold - font-style: oblique state: - font-size: smaller label: - font-size: smaller - type: 'custom:button-card' entity: sensor.Verbrauchszaehler_Licht_Flur_Nische_Kosten_Jahr layout: vertical show_name: true show_icon: false show_state: false show_label: true name: Jahr label: | [[[ if(entity.state > 0) return (entity.state + " " + entity.attributes.unit_of_measurement); else return "0 " + entity.attributes.unit_of_measurement; ]]] styles: card: - background: '#a1a1a1' - border-radius: 0px - height: 50px name: - font-size: x-small - color: '#44739e' - font-weight: bold - font-style: oblique state: - font-size: smaller label: - font-size: smallerLicht - Dimmer

type: 'custom:vertical-stack-in-card' title: Esszimmer cards: - type: horizontal-stack cards: - type: light entity: light.Licht_Esszimmer_Links_Dimmer name: Links - type: light entity: light.Licht_Esszimmer_Rechts_Dimmer name: Rechts - type: horizontal-stack cards: - type: 'custom:button-card' entity: sensor.Licht_Esszimmer_Gruppe_SummeLeistung layout: vertical show_name: true show_icon: false show_state: false show_label: true name: Leistung label: | [[[ if(entity.state > 0) return (entity.state + " " + entity.attributes.unit_of_measurement); else return "0 " + entity.attributes.unit_of_measurement; ]]] styles: card: - background: '#a1a1a1' - border-radius: 0px - height: 50px name: - font-size: x-small - color: '#44739e' - font-weight: bold - font-style: oblique state: - font-size: smaller label: - font-size: smaller - type: 'custom:button-card' entity: sensor.Verbrauchszaehler_Licht_Esszimmer_Gruppe_Verbrauch_Tag layout: vertical show_name: true show_icon: false show_state: false show_label: true name: Heute label: | [[[ return entity.state * 1000 + ' Wh']]] styles: card: - background: '#a1a1a1' - border-radius: 0px - height: 50px name: - font-size: x-small - color: '#44739e' - font-weight: bold - font-style: oblique state: - font-size: smaller label: - font-size: smaller - type: 'custom:button-card' entity: sensor.Verbrauchszaehler_Licht_Esszimmer_Gruppe_Kosten_Jahr layout: vertical show_name: true show_icon: false show_state: false show_label: true name: Jahr label: | [[[ if(entity.state > 0) return (entity.state + " " + entity.attributes.unit_of_measurement); else return "0 " + entity.attributes.unit_of_measurement; ]]] styles: card: - background: '#a1a1a1' - border-radius: 0px - height: 50px name: - font-size: x-small - color: '#44739e' - font-weight: bold - font-style: oblique state: - font-size: smaller label: - font-size: smallerGeräte

type: 'custom:vertical-stack-in-card' cards: - type: 'custom:button-card' entity: switch.Netzwerk_Devices_MusicCast_Esszimmer_An layout: vertical show_name: false show_entity_picture: true tap_action: action: toggle size: 30% state: - value: 'on' entity_picture: /static/myimages/MusicCast-WX-030.png styles: card: - background: LemonChiffon - value: 'off' entity_picture: /static/myimages/MusicCast-WX-030.png - type: 'custom:button-card' entity: sensor.Netzwerk_Devices_MusicCast_Esszimmer_PowerStatus show_name: false show_icon: false tap_action: action: none styles: card: - width: 100% - padding: 2px - margin-top: '-10px' state: - value: An styles: card: - background: green - value: Aus styles: card: - background: FireBrick - value: Boot styles: card: - background: MediumSeaGreen - animation: blink 2s ease infinite - value: Standby styles: card: - background: Orange - value: Enter Standby styles: card: - background: Orange - animation: blink 2s ease infinite - value: Leave Standby styles: card: - background: Orange - animation: blink 2s ease infinite - type: horizontal-stack cards: - type: 'custom:button-card' entity: sensor.Netzwerk_Devices_MusicCast_Esszimmer_PowerStatus layout: vertical show_name: true show_icon: false show_state: true name: Status styles: card: - background: '#a1a1a1' - border-radius: 0px - height: 50px name: - font-size: x-small - color: '#44739e' - font-weight: bold - font-style: oblique state: - font-size: smaller - type: 'custom:button-card' entity: sensor.Schalter_Esszimmer_MusicCast_Leistung layout: vertical show_name: true show_icon: false show_state: true show_label: true name: Leistung styles: card: - background: '#a1a1a1' - border-radius: 0px - height: 50px name: - font-size: x-small - color: '#44739e' - font-weight: bold - font-style: oblique state: - font-size: smaller label: - font-size: smaller state: - value: 0 label: 0 W - type: 'custom:button-card' entity: sensor.Verbrauchszaehler_Schalter_Esszimmer_MusicCast_Kosten_Jahr layout: vertical show_name: true show_icon: false show_state: true show_label: true name: Jahr styles: card: - background: '#a1a1a1' - border-radius: 0px - height: 50px name: - font-size: x-small - color: '#44739e' - font-weight: bold - font-style: oblique state: - font-size: smaller label: - font-size: smaller state: - value: 0 label: 0 € - type: 'custom:button-card' entity: switch.Schalter_Esszimmer_MusicCast_An layout: vertical show_name: false styles: card: - background: '#a1a1a1' - border-radius: 0px - height: 50px
type: 'custom:vertical-stack-in-card' cards: - type: 'custom:button-card' name: System show_entity_picture: true entity_picture: /static/myimages/nuc.png styles: card: - height: 60px - padding: 0px - margin: 0px grid: - grid-template-areas: '"n i"' - grid-template-columns: 1fr 30% name: - justify-self: start - padding-left: 20px - color: '#0277bd' - font-size: x-large entity_picture: - padding-right: 20px - padding-top: 6px - padding-bottom: 6px img_cell: - justify-content: flex-end - type: divider style: height: 4px background: '#0277bd' - type: divider style: height: 6px - type: horizontal-stack cards: - type: 'custom:button-card' layout: icon_name name: CPU show_icon: true show_state: false icon: 'mdi:raspberry-pi' styles: card: - height: 100% - width: 100% - min-width: 160px grid: - grid-template-areas: '"i n"' - grid-template-columns: 1fr 70% name: - justify-self: start - font-size: smaller - margin: 0px icon: - color: '#0277bd' - type: 'custom:bignumber-card' entity: sensor.System_CPU_Auslastung scale: 13px from: left min: 0 max: 100 severity: - value: 60 style: green - value: 80 style: Gold - value: 100 style: FireBrick - type: divider style: height: 6px - type: horizontal-stack cards: - type: 'custom:button-card' layout: icon_name name: CPU ∅-Last show_icon: true show_state: false icon: 'mdi:raspberry-pi' styles: card: - height: 100% - width: 100% - min-width: 160px grid: - grid-template-areas: '"i n"' - grid-template-columns: 1fr 70% name: - justify-self: start - font-size: smaller - margin: 0px icon: - color: '#0277bd' - type: 'custom:bignumber-card' entity: sensor.System_CPU_Durchschnitt scale: 13px from: left min: 0 max: 100 severity: - value: 60 style: green - value: 80 style: Gold - value: 100 style: FireBrick - type: divider style: height: 6px - type: horizontal-stack cards: - type: 'custom:button-card' layout: icon_name name: Arbeitsspeicher show_icon: true show_state: false show_label: true icon: 'mdi:memory' label: >- [[[ return (states["sensor.System_RAM_used"].state + " GB / " + states["sensor.System_RAM_total"].state + " GB") ]]] styles: card: - height: 100% - width: 100% - min-width: 160px - padding: 2px grid: - grid-template-areas: '"i n" "i l"' - grid-template-rows: min-content min-content - grid-template-columns: 1fr 72% name: - justify-self: start - font-size: smaller - margin: 0px label: - justify-self: start - font-size: x-small - margin: 0px - font-style: italic - color: '#0277bd' icon: - color: '#0277bd' - type: 'custom:bignumber-card' entity: sensor.System_RAM_usedPercent scale: 13px from: left min: 0 max: 100 severity: - value: 60 style: green - value: 75 style: Gold - value: 100 style: FireBrick - type: divider style: height: 6px - type: horizontal-stack cards: - type: 'custom:button-card' layout: icon_name name: 'Win10 (C:)' show_icon: true show_state: false show_label: true icon: 'mdi:harddisk' label: >- [[[ return (states["sensor.System_Laufwerke_C_used"].state + " GB / " + states["sensor.System_Laufwerke_C_Size"].state + " GB") ]]] styles: card: - height: 100% - width: 100% - min-width: 160px - padding: 2px grid: - grid-template-areas: '"i n" "i l"' - grid-template-rows: min-content min-content - grid-template-columns: 1fr 72% name: - justify-self: start - font-size: smaller - margin: 0px label: - justify-self: start - font-size: x-small - margin: 0px - font-style: italic - color: '#0277bd' icon: - color: '#0277bd' - type: 'custom:bignumber-card' entity: sensor.System_Laufwerke_C_usedPercent scale: 13px from: left min: 0 max: 100 severity: - value: 60 style: green - value: 75 style: Gold - value: 100 style: FireBrick - type: divider style: height: 6px - type: horizontal-stack cards: - type: 'custom:button-card' layout: icon_name name: 'Work (D:)' show_icon: true show_state: false show_label: true icon: 'mdi:harddisk' label: >- [[[ return (states["sensor.System_Laufwerke_D_used"].state + " GB / " + states["sensor.System_Laufwerke_D_Size"].state + " GB") ]]] styles: card: - height: 100% - width: 100% - min-width: 160px - padding: 2px grid: - grid-template-areas: '"i n" "i l"' - grid-template-rows: min-content min-content - grid-template-columns: 1fr 72% name: - justify-self: start - font-size: smaller - margin: 0px label: - justify-self: start - font-size: x-small - margin: 0px - font-style: italic - color: '#0277bd' icon: - color: '#0277bd' - type: 'custom:bignumber-card' entity: sensor.System_Laufwerke_D_usedPercent scale: 13px from: left min: 0 max: 100 severity: - value: 60 style: green - value: 75 style: Gold - value: 100 style: FireBrick - type: divider style: height: 6px - type: horizontal-stack cards: - type: 'custom:button-card' layout: icon_name name: 'Backup (Y:)' show_icon: true show_state: false show_label: true icon: 'mdi:harddisk' label: >- [[[ return (states["sensor.System_Laufwerke_Y_used"].state + " GB / " + states["sensor.System_Laufwerke_Y_Size"].state + " GB") ]]] styles: card: - height: 100% - width: 100% - min-width: 160px - padding: 2px grid: - grid-template-areas: '"i n" "i l"' - grid-template-rows: min-content min-content - grid-template-columns: 1fr 72% name: - justify-self: start - font-size: smaller - margin: 0px label: - justify-self: start - font-size: x-small - margin: 0px - font-style: italic - color: '#0277bd' icon: - color: '#0277bd' - type: 'custom:bignumber-card' entity: sensor.System_Laufwerke_Y_usedPercent scale: 13px from: left min: 0 max: 100 severity: - value: 60 style: green - value: 75 style: Gold - value: 100 style: FireBrick - type: divider style: height: 6px - type: horizontal-stack cards: - type: 'custom:button-card' layout: icon_name name: 'Mirror (Z:)' show_icon: true show_state: false show_label: true icon: 'mdi:harddisk' label: >- [[[ return (states["sensor.System_Laufwerke_Z_used"].state + " GB / " + states["sensor.System_Laufwerke_Z_Size"].state + " GB") ]]] styles: card: - height: 100% - width: 100% - min-width: 160px - padding: 2px grid: - grid-template-areas: '"i n" "i l"' - grid-template-rows: min-content min-content - grid-template-columns: 1fr 72% name: - justify-self: start - font-size: smaller - margin: 0px label: - justify-self: start - font-size: x-small - margin: 0px - font-style: italic - color: '#0277bd' icon: - color: '#0277bd' - type: 'custom:bignumber-card' entity: sensor.System_Laufwerke_Z_usedPercent scale: 13px from: left min: 0 max: 100 severity: - value: 60 style: green - value: 75 style: Gold - value: 100 style: FireBrick - type: divider style: height: 6px - type: 'custom:button-card' entity: sensor.Schalter_Flur_Server_An show_name: false show_icon: false tap_action: action: none styles: card: - width: 100% - padding: 2px state: - value: true styles: card: - background: green - value: false styles: card: - background: FireBrick - type: horizontal-stack cards: - type: 'custom:button-card' entity: sensor.Schalter_Flur_Server_Leistung layout: vertical show_name: true show_icon: false show_state: false show_label: true name: Leistung label: | [[[ if(entity.state > 0) return (entity.state + " " + entity.attributes.unit_of_measurement); else return "0 " + entity.attributes.unit_of_measurement; ]]] styles: card: - background: '#a1a1a1' - border-radius: 0px - height: 50px name: - font-size: x-small - color: '#44739e' - font-weight: bold - font-style: oblique state: - font-size: smaller label: - font-size: smaller - type: 'custom:button-card' entity: sensor.Verbrauchszaehler_Schalter_Flur_Server_Verbrauch_Tag layout: vertical show_name: true show_icon: false show_state: false show_label: true name: Heute label: | [[[ return entity.state * 1000 + ' Wh']]] styles: card: - background: '#a1a1a1' - border-radius: 0px - height: 50px name: - font-size: x-small - color: '#44739e' - font-weight: bold - font-style: oblique state: - font-size: smaller label: - font-size: smaller - type: 'custom:button-card' entity: sensor.Verbrauchszaehler_Schalter_Flur_Server_Kosten_Jahr layout: vertical show_name: true show_icon: false show_state: false show_label: true name: Jahr label: | [[[ if(entity.state > 0) return (entity.state + " " + entity.attributes.unit_of_measurement); else return "0 " + entity.attributes.unit_of_measurement; ]]] styles: card: - background: '#a1a1a1' - border-radius: 0px - height: 50px name: - font-size: x-small - color: '#44739e' - font-weight: bold - font-style: oblique state: - font-size: smaller label: - font-size: smaller
type: 'custom:vertical-stack-in-card' cards: - type: 'custom:button-card' name: Raspimatic show_entity_picture: true entity_picture: /static/myimages/raspberrymatic.png tap_action: action: url url: 'http://10.0.124.189/login.htm' styles: card: - height: 60px - padding: 0px - margin: 0px grid: - grid-template-areas: '"n i"' - grid-template-columns: 1fr 20% name: - justify-self: start - padding-left: 20px - color: '#0277bd' - font-size: x-large entity_picture: - padding-right: 20px - padding-top: 6px - padding-bottom: 6px img_cell: - justify-content: flex-end - type: 'custom:button-card' entity: sensor.Netzwerk_Devices_RaspiMatic_Verbunden show_name: false show_icon: false tap_action: action: none styles: card: - width: 100% - padding: 2px state: - value: true styles: card: - background: green - value: false styles: card: - background: FireBrick - type: 'custom:button-card' entity: sensor.Netzwerk_Devices_RaspiMatic_Betriebszeit layout: icon_name name: Betriebszeit show_icon: true show_state: false show_label: true icon: 'mdi:clock-outline' label: | [[[ if (entity.state == "") return "0m"; else return entity.state; ]]] styles: card: - padding-top: 10px - padding-bottom: 10px grid: - grid-template-areas: '"i n l"' - grid-template-columns: 11% 1fr 19% name: - justify-self: start - margin: 0px label: - justify-self: end - padding-right: 20px icon: - color: '#0277bd' - type: 'custom:button-card' entity: sensor.Netzwerk_Devices_RaspiMatic_upgradable layout: icon_name name: Neue Version verfügbar show_icon: true show_state: false show_label: true icon: 'mdi:update' label: | [[[ if (entity.state == false) return "nein"; else return "Ja"; ]]] styles: card: - padding-top: 10px - padding-bottom: 10px grid: - grid-template-areas: '"i n l"' - grid-template-columns: 11% 1fr 19% name: - justify-self: start - margin: 0px label: - justify-self: end - padding-right: 20px icon: - color: | [[[ if (entity.state === true) return "green"; else return '#0277bd'; ]]] - type: 'custom:button-card' entity: sensor.Netzwerk_Devices_RaspiMatic_Alarmmeldungen layout: icon_name name: Alarmmeldungen show_icon: true show_state: false show_label: true icon: 'mdi:alert-octagon' label: | [[[ if (entity.state == 0) return "0"; else return entity.state; ]]] styles: card: - padding-top: 10px - padding-bottom: 10px grid: - grid-template-areas: '"i n l"' - grid-template-columns: 11% 1fr 19% name: - justify-self: start - margin: 0px label: - justify-self: end - padding-right: 20px icon: - color: | [[[ if (entity.state > 0) return "FireBrick"; else return '#0277bd'; ]]] - type: 'custom:button-card' entity: sensor.Netzwerk_Devices_RaspiMatic_Servicemeldungen layout: icon_name name: Servicemeldungen show_icon: true show_state: false show_label: true icon: 'mdi:alert-octagon' label: | [[[ if (entity.state == 0) return "0"; else return entity.state; ]]] styles: card: - padding-top: 10px - padding-bottom: 10px grid: - grid-template-areas: '"i n l"' - grid-template-columns: 11% 1fr 19% name: - justify-self: start - margin: 0px label: - justify-self: end - padding-right: 20px icon: - color: | [[[ if (entity.state > 0) return "Gold"; else return '#0277bd'; ]]] - type: divider style: height: 1px margin-left: 10px margin-right: 10px background: '#0277bd' - type: divider style: height: 6px - type: horizontal-stack cards: - type: 'custom:button-card' layout: icon_name name: Temperatur show_icon: true show_state: false icon: 'mdi:thermometer' styles: card: - height: 100% - width: 100% - min-width: 160px grid: - grid-template-areas: '"i n"' - grid-template-columns: 1fr 70% name: - justify-self: start - font-size: smaller - margin: 0px icon: - color: '#0277bd' - type: 'custom:bignumber-card' entity: sensor.Netzwerk_Devices_RaspiMatic_Temperatur scale: 12px from: left min: 0 max: 100 severity: - value: 50 style: green - value: 55 style: Gold - value: 65 style: FireBrick - type: divider style: height: 6px - type: horizontal-stack cards: - type: 'custom:button-card' layout: icon_name name: CPU show_icon: true show_state: false icon: 'mdi:raspberry-pi' styles: card: - height: 100% - width: 100% - min-width: 160px grid: - grid-template-areas: '"i n"' - grid-template-columns: 1fr 70% name: - justify-self: start - font-size: smaller - margin: 0px icon: - color: '#0277bd' - type: 'custom:bignumber-card' entity: sensor.Netzwerk_Devices_RaspiMatic_Auslastung scale: 12px from: left min: 0 max: 100 severity: - value: 60 style: green - value: 80 style: Gold - value: 100 style: FireBrick - type: divider style: height: 6px - type: horizontal-stack cards: - type: 'custom:button-card' layout: icon_name name: Arbeitsspeicher show_icon: true show_state: false icon: 'mdi:memory' styles: card: - height: 100% - width: 100% - min-width: 160px grid: - grid-template-areas: '"i n"' - grid-template-columns: 1fr 70% name: - justify-self: start - font-size: smaller - margin: 0px icon: - color: '#0277bd' - type: 'custom:bignumber-card' entity: sensor.Netzwerk_Devices_RaspiMatic_RamUsed scale: 12px from: left min: 0 max: 100 severity: - value: 60 style: green - value: 80 style: Gold - value: 100 style: FireBrick - type: divider style: height: 6px - type: horizontal-stack cards: - type: 'custom:button-card' layout: icon_name name: SD-Karte show_icon: true show_state: false icon: 'mdi:micro-sd' styles: card: - height: 100% - width: 100% - min-width: 160px grid: - grid-template-areas: '"i n"' - grid-template-columns: 1fr 70% name: - justify-self: start - font-size: smaller - margin: 0px icon: - color: '#0277bd' - type: 'custom:bignumber-card' entity: sensor.Netzwerk_Devices_RaspiMatic_SdUsed scale: 12px from: left min: 0 max: 100 severity: - value: 60 style: green - value: 75 style: Gold - value: 100 style: FireBrick - type: divider style: height: 6px - type: horizontal-stack cards: - type: 'custom:button-card' layout: icon_name name: Duty Cycle show_icon: true show_state: false icon: 'mdi:chart-line-variant' styles: card: - height: 100% - width: 100% - min-width: 160px grid: - grid-template-areas: '"i n"' - grid-template-columns: 1fr 70% name: - justify-self: start - font-size: smaller - margin: 0px icon: - color: '#0277bd' - type: 'custom:bignumber-card' entity: sensor.Netzwerk_Devices_RaspiMatic_DutyCycle scale: 12px from: left min: 0 max: 100 severity: - value: 50 style: green - value: 70 style: Gold - value: 100 style: FireBrick - type: divider style: height: 6pxBar-Chart

type: 'custom:vertical-stack-in-card' cards: - type: 'custom:mini-graph-card' entities: - entity: sensor.Verbrauchszaehler_Licht_Summe_Verbrauch__Tag_Tag_1 color: '#44739e' name: Lichter Energie gesamt name: Lichter Energie gesamt hour24: true points_per_hour: 0.041 hours_to_show: 168 decimals: 3 show: graph: bar name: false icon: false - type: horizontal-stack cards: - type: 'custom:button-card' entity: sensor.Licht_Leistung layout: vertical show_name: true show_icon: false show_state: false show_label: true name: Leistung label: | [[[ if(entity.state > 0) return (entity.state + " " + entity.attributes.unit_of_measurement); else return "0 " + entity.attributes.unit_of_measurement; ]]] styles: card: - background: '#a1a1a1' - border-radius: 0px - height: 50px name: - font-size: x-small - color: '#44739e' - font-weight: bold - font-style: oblique state: - font-size: smaller label: - font-size: smaller - type: 'custom:button-card' entity: sensor.Verbrauchszaehler_Licht_Summe_Kosten_Jahr layout: vertical show_name: true show_icon: false show_state: false show_label: true name: Jahr label: | [[[ if(entity.state > 0) return (entity.state + " " + entity.attributes.unit_of_measurement); else return "0 " + entity.attributes.unit_of_measurement; ]]] styles: card: - background: '#a1a1a1' - border-radius: 0px - height: 50px name: - font-size: x-small - color: '#44739e' - font-weight: bold - font-style: oblique state: - font-size: smaller label: - font-size: smaller@Scrounger
WOW. Sieht schon sehr cool aus. Klasse Arbeit -
Hier mal ein paar Beispiele, was ich so mit lovelace realisiert habe.
Hauptsächlich verwende ich die button-card, da diese sehr viel Flexibilität ermöglicht und man so mit manuellen entities sehr gut arbeiten kann.
Anwesenheit

type: horizontal-stack cards: - type: 'custom:vertical-stack-in-card' cards: - type: 'custom:button-card' entity: sensor.Netzwerk_Devices_Tussi_Anwesend layout: vertical show_name: true show_last_changed: true show_entity_picture: true show_icon: false tap_action: action: none styles: label: - font-size: small - font-style: italic - color: '#a1a1a1' state: - value: true entity_picture: /static/myimages/tussi_presence.png name: anwesend - value: false entity_picture: /static/myimages/tussi_presence.png name: abwesend styles: icon: - filter: grayscale(100%) - type: 'custom:button-card' entity: sensor.Netzwerk_Devices_Tussi_Anwesend show_name: false show_icon: false styles: card: - width: 100% - padding: 2px state: - value: true styles: card: - background: green - value: false styles: card: - background: FireBrick - type: 'custom:vertical-stack-in-card' cards: - type: 'custom:button-card' entity: sensor.Netzwerk_Devices_Handy_Anwesend layout: vertical show_name: true show_last_changed: true show_entity_picture: true show_icon: false tap_action: action: none styles: label: - font-size: small - font-style: italic - color: '#a1a1a1' state: - value: true entity_picture: /static/myimages/ich_presence.png name: anwesend - value: false entity_picture: /static/myimages/ich_presence.png name: abwesend styles: icon: - filter: grayscale(100%) - type: 'custom:button-card' entity: sensor.Netzwerk_Devices_Handy_Anwesend show_name: false show_icon: false styles: card: - width: 100% - padding: 2px state: - value: true styles: card: - background: green - value: false styles: card: - background: FireBrickFenster

type: horizontal-stack cards: - type: 'custom:vertical-stack-in-card' cards: - type: 'custom:button-card' entity: sensor.Sensoren_Fenster_Bad_Offen layout: vertical show_name: false show_entity_picture: true show_icon: false show_last_changed: true tap_action: action: none styles: label: - font-size: small - font-style: italic - color: '#a1a1a1' state: - value: true entity_picture: /static/myimages/window_open.png name: offen show_last_changed: true - value: false entity_picture: /static/myimages/window_closed.png name: geschlossen show_last_changed: false - type: 'custom:vertical-stack-in-card' cards: - type: 'custom:button-card' entity: sensor.Sensoren_Fenster_WC_Offen layout: vertical show_name: false show_entity_picture: true show_icon: false show_last_changed: true tap_action: action: none styles: label: - font-size: small - font-style: italic - color: '#a1a1a1' state: - value: true entity_picture: /static/myimages/window_open.png name: offen show_last_changed: true - value: false entity_picture: /static/myimages/window_closed.png name: geschlossen show_last_changed: falseLicht - Schalter

type: vertical-stack cards: - type: horizontal-stack cards: - type: 'custom:vertical-stack-in-card' cards: - type: entity-button tap_action: action: toggle hold_action: action: more-info show_icon: true show_name: true entity: light.Licht_Flur_Main_An name: Flur - type: horizontal-stack cards: - type: 'custom:button-card' entity: sensor.Licht_Flur_Main_Leistung layout: vertical show_name: true show_icon: false show_state: false show_label: true name: Leistung label: | [[[ if(entity.state > 0) return (entity.state + " " + entity.attributes.unit_of_measurement); else return "0 " + entity.attributes.unit_of_measurement; ]]] styles: card: - background: '#a1a1a1' - border-radius: 0px - height: 50px name: - font-size: x-small - color: '#44739e' - font-weight: bold - font-style: oblique state: - font-size: smaller label: - font-size: smaller - type: 'custom:button-card' entity: sensor.Verbrauchszaehler_Licht_Flur_Main_Verbrauch_Tag layout: vertical show_name: true show_icon: false show_state: false show_label: true name: Heute label: | [[[ return entity.state * 1000 + ' Wh']]] styles: card: - background: '#a1a1a1' - border-radius: 0px - height: 50px name: - font-size: x-small - color: '#44739e' - font-weight: bold - font-style: oblique state: - font-size: smaller label: - font-size: smaller - type: 'custom:button-card' entity: sensor.Verbrauchszaehler_Licht_Flur_Main_Kosten_Jahr layout: vertical show_name: true show_icon: false show_state: false show_label: true name: Jahr label: | [[[ if(entity.state > 0) return (entity.state + " " + entity.attributes.unit_of_measurement); else return "0 " + entity.attributes.unit_of_measurement; ]]] styles: card: - background: '#a1a1a1' - border-radius: 0px - height: 50px name: - font-size: x-small - color: '#44739e' - font-weight: bold - font-style: oblique state: - font-size: smaller label: - font-size: smaller - type: 'custom:vertical-stack-in-card' cards: - type: entity-button tap_action: action: toggle hold_action: action: more-info show_icon: true show_name: true entity: light.Licht_Flur_Nische_An name: Nische - type: horizontal-stack cards: - type: 'custom:button-card' entity: sensor.Licht_Flur_Nische_Leistung layout: vertical show_name: true show_icon: false show_state: false show_label: true name: Leistung label: | [[[ if(entity.state > 0) return (entity.state + " " + entity.attributes.unit_of_measurement); else return "0 " + entity.attributes.unit_of_measurement; ]]] styles: card: - background: '#a1a1a1' - border-radius: 0px - height: 50px name: - font-size: x-small - color: '#44739e' - font-weight: bold - font-style: oblique state: - font-size: smaller label: - font-size: smaller - type: 'custom:button-card' entity: sensor.Verbrauchszaehler_Licht_Flur_Nische_Verbrauch_Tag layout: vertical show_name: true show_icon: false show_state: false show_label: true name: Heute label: | [[[ return entity.state * 1000 + ' Wh']]] styles: card: - background: '#a1a1a1' - border-radius: 0px - height: 50px name: - font-size: x-small - color: '#44739e' - font-weight: bold - font-style: oblique state: - font-size: smaller label: - font-size: smaller - type: 'custom:button-card' entity: sensor.Verbrauchszaehler_Licht_Flur_Nische_Kosten_Jahr layout: vertical show_name: true show_icon: false show_state: false show_label: true name: Jahr label: | [[[ if(entity.state > 0) return (entity.state + " " + entity.attributes.unit_of_measurement); else return "0 " + entity.attributes.unit_of_measurement; ]]] styles: card: - background: '#a1a1a1' - border-radius: 0px - height: 50px name: - font-size: x-small - color: '#44739e' - font-weight: bold - font-style: oblique state: - font-size: smaller label: - font-size: smallerLicht - Dimmer

type: 'custom:vertical-stack-in-card' title: Esszimmer cards: - type: horizontal-stack cards: - type: light entity: light.Licht_Esszimmer_Links_Dimmer name: Links - type: light entity: light.Licht_Esszimmer_Rechts_Dimmer name: Rechts - type: horizontal-stack cards: - type: 'custom:button-card' entity: sensor.Licht_Esszimmer_Gruppe_SummeLeistung layout: vertical show_name: true show_icon: false show_state: false show_label: true name: Leistung label: | [[[ if(entity.state > 0) return (entity.state + " " + entity.attributes.unit_of_measurement); else return "0 " + entity.attributes.unit_of_measurement; ]]] styles: card: - background: '#a1a1a1' - border-radius: 0px - height: 50px name: - font-size: x-small - color: '#44739e' - font-weight: bold - font-style: oblique state: - font-size: smaller label: - font-size: smaller - type: 'custom:button-card' entity: sensor.Verbrauchszaehler_Licht_Esszimmer_Gruppe_Verbrauch_Tag layout: vertical show_name: true show_icon: false show_state: false show_label: true name: Heute label: | [[[ return entity.state * 1000 + ' Wh']]] styles: card: - background: '#a1a1a1' - border-radius: 0px - height: 50px name: - font-size: x-small - color: '#44739e' - font-weight: bold - font-style: oblique state: - font-size: smaller label: - font-size: smaller - type: 'custom:button-card' entity: sensor.Verbrauchszaehler_Licht_Esszimmer_Gruppe_Kosten_Jahr layout: vertical show_name: true show_icon: false show_state: false show_label: true name: Jahr label: | [[[ if(entity.state > 0) return (entity.state + " " + entity.attributes.unit_of_measurement); else return "0 " + entity.attributes.unit_of_measurement; ]]] styles: card: - background: '#a1a1a1' - border-radius: 0px - height: 50px name: - font-size: x-small - color: '#44739e' - font-weight: bold - font-style: oblique state: - font-size: smaller label: - font-size: smallerGeräte

type: 'custom:vertical-stack-in-card' cards: - type: 'custom:button-card' entity: switch.Netzwerk_Devices_MusicCast_Esszimmer_An layout: vertical show_name: false show_entity_picture: true tap_action: action: toggle size: 30% state: - value: 'on' entity_picture: /static/myimages/MusicCast-WX-030.png styles: card: - background: LemonChiffon - value: 'off' entity_picture: /static/myimages/MusicCast-WX-030.png - type: 'custom:button-card' entity: sensor.Netzwerk_Devices_MusicCast_Esszimmer_PowerStatus show_name: false show_icon: false tap_action: action: none styles: card: - width: 100% - padding: 2px - margin-top: '-10px' state: - value: An styles: card: - background: green - value: Aus styles: card: - background: FireBrick - value: Boot styles: card: - background: MediumSeaGreen - animation: blink 2s ease infinite - value: Standby styles: card: - background: Orange - value: Enter Standby styles: card: - background: Orange - animation: blink 2s ease infinite - value: Leave Standby styles: card: - background: Orange - animation: blink 2s ease infinite - type: horizontal-stack cards: - type: 'custom:button-card' entity: sensor.Netzwerk_Devices_MusicCast_Esszimmer_PowerStatus layout: vertical show_name: true show_icon: false show_state: true name: Status styles: card: - background: '#a1a1a1' - border-radius: 0px - height: 50px name: - font-size: x-small - color: '#44739e' - font-weight: bold - font-style: oblique state: - font-size: smaller - type: 'custom:button-card' entity: sensor.Schalter_Esszimmer_MusicCast_Leistung layout: vertical show_name: true show_icon: false show_state: true show_label: true name: Leistung styles: card: - background: '#a1a1a1' - border-radius: 0px - height: 50px name: - font-size: x-small - color: '#44739e' - font-weight: bold - font-style: oblique state: - font-size: smaller label: - font-size: smaller state: - value: 0 label: 0 W - type: 'custom:button-card' entity: sensor.Verbrauchszaehler_Schalter_Esszimmer_MusicCast_Kosten_Jahr layout: vertical show_name: true show_icon: false show_state: true show_label: true name: Jahr styles: card: - background: '#a1a1a1' - border-radius: 0px - height: 50px name: - font-size: x-small - color: '#44739e' - font-weight: bold - font-style: oblique state: - font-size: smaller label: - font-size: smaller state: - value: 0 label: 0 € - type: 'custom:button-card' entity: switch.Schalter_Esszimmer_MusicCast_An layout: vertical show_name: false styles: card: - background: '#a1a1a1' - border-radius: 0px - height: 50px
type: 'custom:vertical-stack-in-card' cards: - type: 'custom:button-card' name: System show_entity_picture: true entity_picture: /static/myimages/nuc.png styles: card: - height: 60px - padding: 0px - margin: 0px grid: - grid-template-areas: '"n i"' - grid-template-columns: 1fr 30% name: - justify-self: start - padding-left: 20px - color: '#0277bd' - font-size: x-large entity_picture: - padding-right: 20px - padding-top: 6px - padding-bottom: 6px img_cell: - justify-content: flex-end - type: divider style: height: 4px background: '#0277bd' - type: divider style: height: 6px - type: horizontal-stack cards: - type: 'custom:button-card' layout: icon_name name: CPU show_icon: true show_state: false icon: 'mdi:raspberry-pi' styles: card: - height: 100% - width: 100% - min-width: 160px grid: - grid-template-areas: '"i n"' - grid-template-columns: 1fr 70% name: - justify-self: start - font-size: smaller - margin: 0px icon: - color: '#0277bd' - type: 'custom:bignumber-card' entity: sensor.System_CPU_Auslastung scale: 13px from: left min: 0 max: 100 severity: - value: 60 style: green - value: 80 style: Gold - value: 100 style: FireBrick - type: divider style: height: 6px - type: horizontal-stack cards: - type: 'custom:button-card' layout: icon_name name: CPU ∅-Last show_icon: true show_state: false icon: 'mdi:raspberry-pi' styles: card: - height: 100% - width: 100% - min-width: 160px grid: - grid-template-areas: '"i n"' - grid-template-columns: 1fr 70% name: - justify-self: start - font-size: smaller - margin: 0px icon: - color: '#0277bd' - type: 'custom:bignumber-card' entity: sensor.System_CPU_Durchschnitt scale: 13px from: left min: 0 max: 100 severity: - value: 60 style: green - value: 80 style: Gold - value: 100 style: FireBrick - type: divider style: height: 6px - type: horizontal-stack cards: - type: 'custom:button-card' layout: icon_name name: Arbeitsspeicher show_icon: true show_state: false show_label: true icon: 'mdi:memory' label: >- [[[ return (states["sensor.System_RAM_used"].state + " GB / " + states["sensor.System_RAM_total"].state + " GB") ]]] styles: card: - height: 100% - width: 100% - min-width: 160px - padding: 2px grid: - grid-template-areas: '"i n" "i l"' - grid-template-rows: min-content min-content - grid-template-columns: 1fr 72% name: - justify-self: start - font-size: smaller - margin: 0px label: - justify-self: start - font-size: x-small - margin: 0px - font-style: italic - color: '#0277bd' icon: - color: '#0277bd' - type: 'custom:bignumber-card' entity: sensor.System_RAM_usedPercent scale: 13px from: left min: 0 max: 100 severity: - value: 60 style: green - value: 75 style: Gold - value: 100 style: FireBrick - type: divider style: height: 6px - type: horizontal-stack cards: - type: 'custom:button-card' layout: icon_name name: 'Win10 (C:)' show_icon: true show_state: false show_label: true icon: 'mdi:harddisk' label: >- [[[ return (states["sensor.System_Laufwerke_C_used"].state + " GB / " + states["sensor.System_Laufwerke_C_Size"].state + " GB") ]]] styles: card: - height: 100% - width: 100% - min-width: 160px - padding: 2px grid: - grid-template-areas: '"i n" "i l"' - grid-template-rows: min-content min-content - grid-template-columns: 1fr 72% name: - justify-self: start - font-size: smaller - margin: 0px label: - justify-self: start - font-size: x-small - margin: 0px - font-style: italic - color: '#0277bd' icon: - color: '#0277bd' - type: 'custom:bignumber-card' entity: sensor.System_Laufwerke_C_usedPercent scale: 13px from: left min: 0 max: 100 severity: - value: 60 style: green - value: 75 style: Gold - value: 100 style: FireBrick - type: divider style: height: 6px - type: horizontal-stack cards: - type: 'custom:button-card' layout: icon_name name: 'Work (D:)' show_icon: true show_state: false show_label: true icon: 'mdi:harddisk' label: >- [[[ return (states["sensor.System_Laufwerke_D_used"].state + " GB / " + states["sensor.System_Laufwerke_D_Size"].state + " GB") ]]] styles: card: - height: 100% - width: 100% - min-width: 160px - padding: 2px grid: - grid-template-areas: '"i n" "i l"' - grid-template-rows: min-content min-content - grid-template-columns: 1fr 72% name: - justify-self: start - font-size: smaller - margin: 0px label: - justify-self: start - font-size: x-small - margin: 0px - font-style: italic - color: '#0277bd' icon: - color: '#0277bd' - type: 'custom:bignumber-card' entity: sensor.System_Laufwerke_D_usedPercent scale: 13px from: left min: 0 max: 100 severity: - value: 60 style: green - value: 75 style: Gold - value: 100 style: FireBrick - type: divider style: height: 6px - type: horizontal-stack cards: - type: 'custom:button-card' layout: icon_name name: 'Backup (Y:)' show_icon: true show_state: false show_label: true icon: 'mdi:harddisk' label: >- [[[ return (states["sensor.System_Laufwerke_Y_used"].state + " GB / " + states["sensor.System_Laufwerke_Y_Size"].state + " GB") ]]] styles: card: - height: 100% - width: 100% - min-width: 160px - padding: 2px grid: - grid-template-areas: '"i n" "i l"' - grid-template-rows: min-content min-content - grid-template-columns: 1fr 72% name: - justify-self: start - font-size: smaller - margin: 0px label: - justify-self: start - font-size: x-small - margin: 0px - font-style: italic - color: '#0277bd' icon: - color: '#0277bd' - type: 'custom:bignumber-card' entity: sensor.System_Laufwerke_Y_usedPercent scale: 13px from: left min: 0 max: 100 severity: - value: 60 style: green - value: 75 style: Gold - value: 100 style: FireBrick - type: divider style: height: 6px - type: horizontal-stack cards: - type: 'custom:button-card' layout: icon_name name: 'Mirror (Z:)' show_icon: true show_state: false show_label: true icon: 'mdi:harddisk' label: >- [[[ return (states["sensor.System_Laufwerke_Z_used"].state + " GB / " + states["sensor.System_Laufwerke_Z_Size"].state + " GB") ]]] styles: card: - height: 100% - width: 100% - min-width: 160px - padding: 2px grid: - grid-template-areas: '"i n" "i l"' - grid-template-rows: min-content min-content - grid-template-columns: 1fr 72% name: - justify-self: start - font-size: smaller - margin: 0px label: - justify-self: start - font-size: x-small - margin: 0px - font-style: italic - color: '#0277bd' icon: - color: '#0277bd' - type: 'custom:bignumber-card' entity: sensor.System_Laufwerke_Z_usedPercent scale: 13px from: left min: 0 max: 100 severity: - value: 60 style: green - value: 75 style: Gold - value: 100 style: FireBrick - type: divider style: height: 6px - type: 'custom:button-card' entity: sensor.Schalter_Flur_Server_An show_name: false show_icon: false tap_action: action: none styles: card: - width: 100% - padding: 2px state: - value: true styles: card: - background: green - value: false styles: card: - background: FireBrick - type: horizontal-stack cards: - type: 'custom:button-card' entity: sensor.Schalter_Flur_Server_Leistung layout: vertical show_name: true show_icon: false show_state: false show_label: true name: Leistung label: | [[[ if(entity.state > 0) return (entity.state + " " + entity.attributes.unit_of_measurement); else return "0 " + entity.attributes.unit_of_measurement; ]]] styles: card: - background: '#a1a1a1' - border-radius: 0px - height: 50px name: - font-size: x-small - color: '#44739e' - font-weight: bold - font-style: oblique state: - font-size: smaller label: - font-size: smaller - type: 'custom:button-card' entity: sensor.Verbrauchszaehler_Schalter_Flur_Server_Verbrauch_Tag layout: vertical show_name: true show_icon: false show_state: false show_label: true name: Heute label: | [[[ return entity.state * 1000 + ' Wh']]] styles: card: - background: '#a1a1a1' - border-radius: 0px - height: 50px name: - font-size: x-small - color: '#44739e' - font-weight: bold - font-style: oblique state: - font-size: smaller label: - font-size: smaller - type: 'custom:button-card' entity: sensor.Verbrauchszaehler_Schalter_Flur_Server_Kosten_Jahr layout: vertical show_name: true show_icon: false show_state: false show_label: true name: Jahr label: | [[[ if(entity.state > 0) return (entity.state + " " + entity.attributes.unit_of_measurement); else return "0 " + entity.attributes.unit_of_measurement; ]]] styles: card: - background: '#a1a1a1' - border-radius: 0px - height: 50px name: - font-size: x-small - color: '#44739e' - font-weight: bold - font-style: oblique state: - font-size: smaller label: - font-size: smaller
type: 'custom:vertical-stack-in-card' cards: - type: 'custom:button-card' name: Raspimatic show_entity_picture: true entity_picture: /static/myimages/raspberrymatic.png tap_action: action: url url: 'http://10.0.124.189/login.htm' styles: card: - height: 60px - padding: 0px - margin: 0px grid: - grid-template-areas: '"n i"' - grid-template-columns: 1fr 20% name: - justify-self: start - padding-left: 20px - color: '#0277bd' - font-size: x-large entity_picture: - padding-right: 20px - padding-top: 6px - padding-bottom: 6px img_cell: - justify-content: flex-end - type: 'custom:button-card' entity: sensor.Netzwerk_Devices_RaspiMatic_Verbunden show_name: false show_icon: false tap_action: action: none styles: card: - width: 100% - padding: 2px state: - value: true styles: card: - background: green - value: false styles: card: - background: FireBrick - type: 'custom:button-card' entity: sensor.Netzwerk_Devices_RaspiMatic_Betriebszeit layout: icon_name name: Betriebszeit show_icon: true show_state: false show_label: true icon: 'mdi:clock-outline' label: | [[[ if (entity.state == "") return "0m"; else return entity.state; ]]] styles: card: - padding-top: 10px - padding-bottom: 10px grid: - grid-template-areas: '"i n l"' - grid-template-columns: 11% 1fr 19% name: - justify-self: start - margin: 0px label: - justify-self: end - padding-right: 20px icon: - color: '#0277bd' - type: 'custom:button-card' entity: sensor.Netzwerk_Devices_RaspiMatic_upgradable layout: icon_name name: Neue Version verfügbar show_icon: true show_state: false show_label: true icon: 'mdi:update' label: | [[[ if (entity.state == false) return "nein"; else return "Ja"; ]]] styles: card: - padding-top: 10px - padding-bottom: 10px grid: - grid-template-areas: '"i n l"' - grid-template-columns: 11% 1fr 19% name: - justify-self: start - margin: 0px label: - justify-self: end - padding-right: 20px icon: - color: | [[[ if (entity.state === true) return "green"; else return '#0277bd'; ]]] - type: 'custom:button-card' entity: sensor.Netzwerk_Devices_RaspiMatic_Alarmmeldungen layout: icon_name name: Alarmmeldungen show_icon: true show_state: false show_label: true icon: 'mdi:alert-octagon' label: | [[[ if (entity.state == 0) return "0"; else return entity.state; ]]] styles: card: - padding-top: 10px - padding-bottom: 10px grid: - grid-template-areas: '"i n l"' - grid-template-columns: 11% 1fr 19% name: - justify-self: start - margin: 0px label: - justify-self: end - padding-right: 20px icon: - color: | [[[ if (entity.state > 0) return "FireBrick"; else return '#0277bd'; ]]] - type: 'custom:button-card' entity: sensor.Netzwerk_Devices_RaspiMatic_Servicemeldungen layout: icon_name name: Servicemeldungen show_icon: true show_state: false show_label: true icon: 'mdi:alert-octagon' label: | [[[ if (entity.state == 0) return "0"; else return entity.state; ]]] styles: card: - padding-top: 10px - padding-bottom: 10px grid: - grid-template-areas: '"i n l"' - grid-template-columns: 11% 1fr 19% name: - justify-self: start - margin: 0px label: - justify-self: end - padding-right: 20px icon: - color: | [[[ if (entity.state > 0) return "Gold"; else return '#0277bd'; ]]] - type: divider style: height: 1px margin-left: 10px margin-right: 10px background: '#0277bd' - type: divider style: height: 6px - type: horizontal-stack cards: - type: 'custom:button-card' layout: icon_name name: Temperatur show_icon: true show_state: false icon: 'mdi:thermometer' styles: card: - height: 100% - width: 100% - min-width: 160px grid: - grid-template-areas: '"i n"' - grid-template-columns: 1fr 70% name: - justify-self: start - font-size: smaller - margin: 0px icon: - color: '#0277bd' - type: 'custom:bignumber-card' entity: sensor.Netzwerk_Devices_RaspiMatic_Temperatur scale: 12px from: left min: 0 max: 100 severity: - value: 50 style: green - value: 55 style: Gold - value: 65 style: FireBrick - type: divider style: height: 6px - type: horizontal-stack cards: - type: 'custom:button-card' layout: icon_name name: CPU show_icon: true show_state: false icon: 'mdi:raspberry-pi' styles: card: - height: 100% - width: 100% - min-width: 160px grid: - grid-template-areas: '"i n"' - grid-template-columns: 1fr 70% name: - justify-self: start - font-size: smaller - margin: 0px icon: - color: '#0277bd' - type: 'custom:bignumber-card' entity: sensor.Netzwerk_Devices_RaspiMatic_Auslastung scale: 12px from: left min: 0 max: 100 severity: - value: 60 style: green - value: 80 style: Gold - value: 100 style: FireBrick - type: divider style: height: 6px - type: horizontal-stack cards: - type: 'custom:button-card' layout: icon_name name: Arbeitsspeicher show_icon: true show_state: false icon: 'mdi:memory' styles: card: - height: 100% - width: 100% - min-width: 160px grid: - grid-template-areas: '"i n"' - grid-template-columns: 1fr 70% name: - justify-self: start - font-size: smaller - margin: 0px icon: - color: '#0277bd' - type: 'custom:bignumber-card' entity: sensor.Netzwerk_Devices_RaspiMatic_RamUsed scale: 12px from: left min: 0 max: 100 severity: - value: 60 style: green - value: 80 style: Gold - value: 100 style: FireBrick - type: divider style: height: 6px - type: horizontal-stack cards: - type: 'custom:button-card' layout: icon_name name: SD-Karte show_icon: true show_state: false icon: 'mdi:micro-sd' styles: card: - height: 100% - width: 100% - min-width: 160px grid: - grid-template-areas: '"i n"' - grid-template-columns: 1fr 70% name: - justify-self: start - font-size: smaller - margin: 0px icon: - color: '#0277bd' - type: 'custom:bignumber-card' entity: sensor.Netzwerk_Devices_RaspiMatic_SdUsed scale: 12px from: left min: 0 max: 100 severity: - value: 60 style: green - value: 75 style: Gold - value: 100 style: FireBrick - type: divider style: height: 6px - type: horizontal-stack cards: - type: 'custom:button-card' layout: icon_name name: Duty Cycle show_icon: true show_state: false icon: 'mdi:chart-line-variant' styles: card: - height: 100% - width: 100% - min-width: 160px grid: - grid-template-areas: '"i n"' - grid-template-columns: 1fr 70% name: - justify-self: start - font-size: smaller - margin: 0px icon: - color: '#0277bd' - type: 'custom:bignumber-card' entity: sensor.Netzwerk_Devices_RaspiMatic_DutyCycle scale: 12px from: left min: 0 max: 100 severity: - value: 50 style: green - value: 70 style: Gold - value: 100 style: FireBrick - type: divider style: height: 6pxBar-Chart

type: 'custom:vertical-stack-in-card' cards: - type: 'custom:mini-graph-card' entities: - entity: sensor.Verbrauchszaehler_Licht_Summe_Verbrauch__Tag_Tag_1 color: '#44739e' name: Lichter Energie gesamt name: Lichter Energie gesamt hour24: true points_per_hour: 0.041 hours_to_show: 168 decimals: 3 show: graph: bar name: false icon: false - type: horizontal-stack cards: - type: 'custom:button-card' entity: sensor.Licht_Leistung layout: vertical show_name: true show_icon: false show_state: false show_label: true name: Leistung label: | [[[ if(entity.state > 0) return (entity.state + " " + entity.attributes.unit_of_measurement); else return "0 " + entity.attributes.unit_of_measurement; ]]] styles: card: - background: '#a1a1a1' - border-radius: 0px - height: 50px name: - font-size: x-small - color: '#44739e' - font-weight: bold - font-style: oblique state: - font-size: smaller label: - font-size: smaller - type: 'custom:button-card' entity: sensor.Verbrauchszaehler_Licht_Summe_Kosten_Jahr layout: vertical show_name: true show_icon: false show_state: false show_label: true name: Jahr label: | [[[ if(entity.state > 0) return (entity.state + " " + entity.attributes.unit_of_measurement); else return "0 " + entity.attributes.unit_of_measurement; ]]] styles: card: - background: '#a1a1a1' - border-radius: 0px - height: 50px name: - font-size: x-small - color: '#44739e' - font-weight: bold - font-style: oblique state: - font-size: smaller label: - font-size: smaller@Scrounger sagte in [Aufruf] Test lovelace Adapter:
Hauptsächlich verwende ich die button-card, da diese sehr viel Flexibilität ermöglicht und man so mit manuellen entities sehr gut arbeiten kann.
Wie hast du die button-card eingebunden?
Wenn ich sie per Drag and Drop in die Custom Cards lege, bekomme ich den FehlerCustom element doesn't exist: vertical-stack-in-card -
@Scrounger sagte in [Aufruf] Test lovelace Adapter:
Hauptsächlich verwende ich die button-card, da diese sehr viel Flexibilität ermöglicht und man so mit manuellen entities sehr gut arbeiten kann.
Wie hast du die button-card eingebunden?
Wenn ich sie per Drag and Drop in die Custom Cards lege, bekomme ich den FehlerCustom element doesn't exist: vertical-stack-in-card@simatec sagte in [Aufruf] Test lovelace Adapter:
@Scrounger sagte in [Aufruf] Test lovelace Adapter:
Hauptsächlich verwende ich die button-card, da diese sehr viel Flexibilität ermöglicht und man so mit manuellen entities sehr gut arbeiten kann.
Wie hast du die button-card eingebunden?
Wenn ich sie per Drag and Drop in die Custom Cards lege, bekomme ich den FehlerCustom element doesn't exist: vertical-stack-in-cardBitte benutzt das Voting rechts unten im Beitrag wenn er euch geholfen hat.
Immer Daten sichern! -
Danke die fehlte ...

-
@simatec sagte in [Aufruf] Test lovelace Adapter:
Danke die fehlte ...

Bitte, wo gehört die JS Datei hineinkopiert?
Habe ich schon mal gemacht, weis nicht mehr wie.Aha,
Drag and drop the custom cards files here
Bitte benutzt das Voting rechts unten im Beitrag wenn er euch geholfen hat.
Immer Daten sichern! -
Ich kann derzeit keine manuellen Entitys erstellen. Der erkennt bei mir nur die, die durch den TypDetector erstellt wurden. Sobald ich die Raum und Funktion raus nehme und einen Datenpunkt versuche manuell zuzuweisen, taucht der nicht mehr auf.
Hat zufällig jemand das selbe Problem?
-
@Scrounger Danke für die Hilfe. So langsam blicke ich da durch wie das ganze funktioniert.

-
Tussi anwesend ist ein interessanter DP

@sigi234 sagte in [Aufruf] Test lovelace Adapter:
Tussi anwesend ist ein interessanter DP

Dann drück mal die Daumen das es nie einen Bug geben wird der den DP Namen auf dem Tablet anzeigt

Sodele Burger is back

Hab gerade die neuste Version von lovelace kompeliert, wer testen will, kann aus meinem Fork installieren:
https://github.com/Scrounger/ioBroker.lovelace
<a href="https://github.com/Scrounger/ioBroker.linkeddevices">LinkedDevices Adapter</a>
<a href="https://github.com/Scrounger/ioBroker.vis-materialdesign">Material Design Widgets</a>
-
@sigi234 sagte in [Aufruf] Test lovelace Adapter:
Tussi anwesend ist ein interessanter DP

Dann drück mal die Daumen das es nie einen Bug geben wird der den DP Namen auf dem Tablet anzeigt

Sodele Burger is back

Hab gerade die neuste Version von lovelace kompeliert, wer testen will, kann aus meinem Fork installieren:
https://github.com/Scrounger/ioBroker.lovelace
@Scrounger sagte in [Aufruf] Test lovelace Adapter:
@sigi234 sagte in [Aufruf] Test lovelace Adapter:
Sodele Burger is back

Hab gerade die neuste Version von lovelace kompeliert, wer testen will, kann aus meinem Fork installieren:
https://github.com/Scrounger/ioBroker.lovelacelovelace.0 2019-09-19 08:00:28.091 info http server listening on port 8091 lovelace.0 2019-09-19 08:00:28.070 info starting. Version 0.1.5 in C:/ioBroker/node_modules/iobroker.lovelace, node: v10.16.3 lovelace.0 2019-09-19 08:00:08.760 warn no max value for light object 'alexa2.0.Smart-Home-Devices' defined -> using fallback max = 100 lovelace.0 2019-09-19 07:58:06.919 warn Unknown entity: undefined lovelace.0 2019-09-19 07:58:06.918 warn Unknown entity: undefined lovelace.0 2019-09-19 07:58:06.914 warn Unknown entity: undefined lovelace.0 2019-09-19 07:58:06.911 warn Unknown entity: undefined lovelace.0 2019-09-19 07:58:06.911 warn Unknown entity: undefined lovelace.0 2019-09-19 07:57:46.322 warn HASS auth_invalid: 20cc14336299e1f5650c87028ad11e40a76459f98008c416542d6c1b521f3ea6 lovelace.0 2019-09-19 07:57:45.778 warn no max value for light object 'alexa2.0.Smart-Home-Devices' defined -> using fallback max = 100 lovelace.0 2019-09-19 07:57:43.253 info http server listening on port 8091Ok, wie bekomme ich die alten ID weg?

Wenn ich auf die UI klicke muss ich mich jedes mal anmelden?

Bitte benutzt das Voting rechts unten im Beitrag wenn er euch geholfen hat.
Immer Daten sichern! -
Hat hier jemand iobroker auf einer Proxmox VM laufen? Ich habe Probleme mit Lovelace und finde die Ursache nicht
@WW1983 sagte in [Aufruf] Test lovelace Adapter:
Hat hier jemand iobroker auf einer Proxmox VM laufen? Ich habe Probleme mit Lovelace und finde die Ursache nicht
Ich habe es in einer VM.
Host: Intel Nuc6cayh (16GB Ram, 240GB SSD) mit Proxmox.
Iobroker VM, InfluxDB LXC, Pihole LXC, Tasmoadmin LXC, Easy2connect VM
-
Wenn ich eine Manual Card erstelle oder bei einer anderen Card und ich in die Raw von der Card bin, stockt Lovelace so arg, dass ich nichts mehr machen kann.
Woran liegt das ?
Wie auf dem Bild z.B. wenn ich jetzt ein Type hinzufügen will oder icon etc. geht auf einmal nichts mehr.
Host: Intel Nuc6cayh (16GB Ram, 240GB SSD) mit Proxmox.
Iobroker VM, InfluxDB LXC, Pihole LXC, Tasmoadmin LXC, Easy2connect VM
-
Kann mir jemand sagen wo mein Fehler liegt. Bekomme die vertical-stack-in-Card nicht hin. DIe js habe ich bereits eingefügt:

type: 'custom:vertical-stack-in-card' title: Wohnzimmer cards: - type: horizontal-stack cards: - type: light entity: light.WZ_Lampe_am_Sofa_level - type: light entity: light.WZ_Sideboard_level -
@simatec sagte in [Aufruf] Test lovelace Adapter:
Danke die fehlte ...

Bitte, wo gehört die JS Datei hineinkopiert?
Habe ich schon mal gemacht, weis nicht mehr wie.Aha,
Drag and drop the custom cards files here
@sigi234 Hallo Sigi,
wo hast du die Datei genau hinkopiert?
- Install the vertical-style-card card by copying vertical-style-card.js to <config directory>/www/vertical-style-card.js
Auf Github steht auch:
- Link vertical-stack-in-card inside your ui-lovelace.yaml
resources:
- url: /local/vertical-stack-in-card.js?v=0.1.3
type: js
Was ist damit gemeint? Ich finde keine ui-lovelace.yaml....
Kannst du mir bitte eventuell eine kurze Anleitung dazu geben?
Gruß Ben
Sonos, Intel Nuc, Iobroker Pro, Proxmox, IPad Air (Wand), Vis, Xiaomi, Devolo, Bose, Philips Hue, Instar, Synology
-
@sigi234 Hallo Sigi,
wo hast du die Datei genau hinkopiert?
- Install the vertical-style-card card by copying vertical-style-card.js to <config directory>/www/vertical-style-card.js
Auf Github steht auch:
- Link vertical-stack-in-card inside your ui-lovelace.yaml
resources:
- url: /local/vertical-stack-in-card.js?v=0.1.3
type: js
Was ist damit gemeint? Ich finde keine ui-lovelace.yaml....
Kannst du mir bitte eventuell eine kurze Anleitung dazu geben?
Gruß Ben
-
Wenn du auf die Einstellung der Instanz Lovelace gehst, da gibt es einen Reiter "Custom Cards". Dort per Drag&Drop reinziehen und die Instanz neu starten. Dann wir die automatisch hochgeladen