Skip to content
  • Home
  • Aktuell
  • Tags
  • 0 Ungelesen 0
  • Kategorien
  • Unreplied
  • Beliebt
  • GitHub
  • Docu
  • Hilfe
Skins
  • Light
  • Brite
  • Cerulean
  • Cosmo
  • Flatly
  • Journal
  • Litera
  • Lumen
  • Lux
  • Materia
  • Minty
  • Morph
  • Pulse
  • Sandstone
  • Simplex
  • Sketchy
  • Spacelab
  • United
  • Yeti
  • Zephyr
  • Dark
  • Cyborg
  • Darkly
  • Quartz
  • Slate
  • Solar
  • Superhero
  • Vapor

  • Standard: (Kein Skin)
  • Kein Skin
Einklappen
ioBroker Logo

Community Forum

donate donate
  1. ioBroker Community Home
  2. Deutsch
  3. Tester
  4. Test Adapter lovelace v0.2.x

NEWS

  • UPDATE 31.10.: Amazon Alexa - ioBroker Skill läuft aus ?
    apollon77A
    apollon77
    48
    3
    8.7k

  • Monatsrückblick – September 2025
    BluefoxB
    Bluefox
    13
    1
    2.2k

  • Neues Video "KI im Smart Home" - ioBroker plus n8n
    BluefoxB
    Bluefox
    16
    1
    3.1k

Test Adapter lovelace v0.2.x

Geplant Angeheftet Gesperrt Verschoben Tester
testcall for actionlovelacevisualisierung
1.1k Beiträge 131 Kommentatoren 385.7k Aufrufe 99 Watching
  • Älteste zuerst
  • Neuste zuerst
  • Meiste Stimmen
Antworten
  • In einem neuen Thema antworten
Anmelden zum Antworten
Dieses Thema wurde gelöscht. Nur Nutzer mit entsprechenden Rechten können es sehen.
  • A ak1

    @WW1983 Kannst Du bitte auch den Code teilen, so wie @Scrounger das bei seinen Beispielen gemacht hat?
    Da kann man immer eine Menge von lernen.
    Danke!
    ak1

    W Offline
    W Offline
    WW1983
    schrieb am zuletzt editiert von
    #245

    @ak1
    Klar:

    title: Home
    views:
      - cards:
          - type: glance
            entities:
              - entity: switch.WZ_Deckenlicht
                icon: 'mdi:ceiling-light'
              - entity: switch.WZ_Sideboard_on
                icon: 'mdi:led-strip-variant'
              - entity: switch.WZ_Lampe_am_Sofa_on
                icon: 'mdi:floor-lamp'
              - entity: switch.KU_Deckenlicht
                icon: 'mdi:ceiling-light'
              - entity: switch.EZ_Deckenlicht
                icon: 'mdi:ceiling-light'
              - entity: switch.WR_Luefter
                icon: 'mdi:fan'
              - entity: switch.WR_Deckenlicht
                icon: 'mdi:ceiling-light'
              - entity: switch.AZ_Stehlampe_on
                icon: 'mdi:floor-lamp'
              - entity: switch.AZ_Tischlampe_on
                icon: 'mdi:desk-lamp'
              - entity: switch.AZ_Deckenlicht
                icon: 'mdi:ceiling-light'
              - entity: switch.BZ_Lueftung
                icon: 'mdi:fan'
              - entity: switch.BZ_Licht
                icon: 'mdi:ceiling-light'
            title: ÜBERSICHT-LICHT
            show_state: true
            show_icon: true
            show_name: false
          - type: weather-forecast
            entity: weather.Wiesbaden__Hessen_Deutschland_
          - type: 'custom:vertical-stack-in-card'
            title: DIESELPREISE
            cards:
              - type: glance
                entities:
                  - entity: sensor.Spritt_Shell
                    name: Shell
                    icon: 'mdi:gas-station'
                  - entity: sensor.Spritt_Esso
                    name: ESSO
                    icon: 'mdi:gas-station'
                  - entity: sensor.Spritt_JET
                    name: JET
                    icon: 'mdi:gas-station'
              - type: 'custom:mini-graph-card'
                icon: 'mdi:gas-station'
                entities:
                  - entity: sensor.Spritt_Shell
                    name: Shell
                    color: orange
                  - entity: sensor.Spritt_Esso
                    name: ESSO
                    color: blue
                  - entity: sensor.Spritt_JET
                    name: JET
                    color: yellow
        badges: []
        path: default_view
        title: Übersicht
        panel: false
        icon: 'mdi:home-account'
      - cards:
          - type: entities
            entities:
              - entity: switch.WZ_Deckenlicht
                name: Deckenlicht
                icon: 'mdi:ceiling-light'
              - entity: input_number.WZ_Lampe_am_Sofa
                name: Lampe am Sofa
                icon: 'mdi:floor-lamp'
              - entity: input_number.WZ_Sideboardbeleuchtung
                name: Beleuchtung Sideboard
                icon: 'mdi:led-strip-variant'
            title: WOHNZIMMER
            show_header_toggle: false
          - type: entities
            entities:
              - entity: switch.AZ_Deckenlicht
                name: Deckenlicht
                icon: 'mdi:ceiling-light'
              - entity: input_number.AZ_Stehlampe
                name: Stehlampe
                icon: 'mdi:floor-lamp'
              - entity: input_number.AZ_Tischlampe
                name: Tischlampe
                icon: 'mdi:desk-lamp'
            title: ARBEITSZIMMER
            show_header_toggle: false
          - type: entities
            entities:
              - entity: switch.KU_Deckenlicht
                name: Deckenlicht
                icon: 'mdi:ceiling-light'
            title: KÜCHE
            show_header_toggle: false
          - type: entities
            entities:
              - entity: switch.EZ_Deckenlicht
                name: Deckenlicht
                icon: 'mdi:ceiling-light'
            title: ESSBEREICH
            show_header_toggle: false
          - type: entities
            entities:
              - entity: switch.WR_Deckenlicht
                name: Deckenlicht
                icon: 'mdi:ceiling-light'
            title: WASCHRAUM
            show_header_toggle: false
          - type: entities
            entities:
              - entity: switch.BZ_Licht
                name: Licht
            show_header_toggle: false
            title: BADEZIMMER
        badges: []
        title: Licht
        path: licht
        icon: 'mdi:lightbulb-on-outline'
      - cards:
          - type: 'custom:vertical-stack-in-card'
            title: BADEZIMMER - LÜFTER
            cards:
              - type: entities
                entities:
                  - entity: switch.BZ_Lueftung
                    name: Lüfter
                    icon: 'mdi:fan'
                  - entity: switch.BZ_Feuchtigkeitsautoamtik
                    name: Feuchtigkeitserkennung
                    icon: 'mdi:brightness-auto'
                  - entity: input_text.BZ_Feuchtigkeitswert
                    name: Feuchtigkeitsgrenze in Prozent
              - type: glance
                entities:
                  - entity: sensor.BZ_Temperatur
                    name: Temperatur
                  - entity: sensor.BZ_Feuchtigkeitssensor
                    name: Luftfeuchtigkeit
                    icon: 'mdi:coolant-temperature'
                    title: Badezimmer
                    columns: 2
                    show_icon: true
                    show_state: true
          - type: 'custom:vertical-stack-in-card'
            title: WASCHRAUM - LÜFTER
            cards:
              - type: entities
                entities:
                  - entity: switch.WR_Luefter
                    name: Lüfter
                    icon: 'mdi:fan'
                  - entity: switch.WR_Feuchtigkeitsautomatik
                    name: Feuchtigkeitserkennung
                    icon: 'mdi:brightness-auto'
                  - entity: input_text.WR_Feuchtigkeitswert
                    name: Feuchtigkeitsgrenze in Prozent
              - type: glance
                entities:
                  - entity: sensor.WR_Temperatur
                    name: Temperatur
                  - entity: sensor.WR_Feuchtigkeitssensor
                    name: Luftfeuchtigkeit
                    icon: 'mdi:coolant-temperature'
                    columns: 2
                    show_icon: true
                    show_state: true
        badges: []
        title: Waschräume
        path: lufter
        icon: 'mdi:shower'
      - cards:
          - type: 'custom:vertical-stack-in-card'
            cards:
              - type: horizontal-stack
                cards:
                  - type: gauge
                    entity: sensor.Staubsauger_Status_Brush
                    min: 0
                    max: 100
                    severity:
                      green: 0
                      yellow: 0
                      red: 0
                    theme: default
                    name: Hauptbürste
                  - type: gauge
                    entity: sensor.Staubsauger_Status_Filter
                    min: 0
                    max: 100
                    severity:
                      green: 0
                      yellow: 0
                      red: 0
                    theme: default
                    name: Filter
              - type: horizontal-stack
                cards:
                  - type: entity-button
                    tap_action:
                      action: none
                    hold_action:
                      action: none
                    show_icon: true
                    show_name: true
                    entity: switch.Staubsauger_Reset_Brush
                    icon: 'mdi:restart'
                    name: Zurücksetzen
                    icon_height: 30px
                  - type: entity-button
                    tap_action:
                      action: none
                    hold_action:
                      action: none
                    show_icon: true
                    show_name: true
                    entity: switch.Staubsauger_Reset_Filter
                    icon: 'mdi:restart'
                    name: Zurücksetzen
                    icon_height: 30px
          - type: 'custom:vertical-stack-in-card'
            cards:
              - type: horizontal-stack
                cards:
                  - type: gauge
                    entity: sensor.Staubsauger_Status_Sensor
                    min: 0
                    max: 100
                    severity:
                      green: 0
                      yellow: 0
                      red: 0
                    theme: default
                    name: Sonsoeren
                  - type: gauge
                    entity: sensor.Staubsauger_Status_SideBrush
                    min: 0
                    max: 100
                    severity:
                      green: 0
                      yellow: 0
                      red: 0
                    theme: default
                    name: Seitenbürste
              - type: horizontal-stack
                cards:
                  - type: entity-button
                    tap_action:
                      action: none
                    hold_action:
                      action: none
                    show_icon: true
                    show_name: true
                    entity: switch.Staubsauger_Reset_Sensor
                    icon: 'mdi:restart'
                    name: Zurücksetzen
                    icon_height: 30px
                  - type: entity-button
                    tap_action:
                      action: none
                    hold_action:
                      action: none
                    show_icon: true
                    show_name: true
                    entity: switch.Staubsauger_Reset_SideBrush
                    icon: 'mdi:restart'
                    name: Zurücksetzen
                    icon_height: 30px
          - type: 'custom:vertical-stack-in-card'
            cards:
              - type: 'custom:button-card'
                name: ZONENREINIGUNG
                icon: 'mdi:floor-plan'
                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
                    - font-size: x-large
              - type: divider
                style:
                  height: 1px
                  margin-left: 10px
                  margin-right: 10px
                  background: white
              - type: entities
                entities:
                  - entity: switch.Staubsauger_WZ
                    name: Wohnzimmer
                    icon: 'mdi:sofa'
                  - entity: switch.Staubsauger_EZ
                    name: Esszimmer
                    icon: 'mdi:table-chair'
                  - entity: switch.Staubsauger_KU
                    name: Küche
                    icon: 'mdi:chef-hat'
                  - entity: switch.Staubsauger_Flur
                    name: Flur
                    icon: 'mdi:shoe-print'
                  - entity: switch.Staubsauger_WC
                    name: Gäste-WC
                    icon: 'mdi:paper-roll'
              - type: divider
                style:
                  height: 2px
                  margin-left: 10px
                  margin-right: 10px
                  background: white
              - type: horizontal-stack
                cards:
                  - type: entity-button
                    tap_action:
                      action: toggle
                    hold_action:
                      action: none
                    show_icon: true
                    show_name: true
                    entity: switch.Staubsauger_Start
                    icon: 'mdi:play-circle-outline'
                    name: Start
                    icon_height: 50px
                  - type: entity-button
                    tap_action:
                      action: toggle
                    hold_action:
                      action: none
                    show_icon: true
                    show_name: true
                    entity: switch.Staubsauger_Pause
                    icon: 'mdi:pause-circle-outline'
                    name: Pause
                    icon_height: 50px
                  - type: entity-button
                    tap_action:
                      action: toggle
                    hold_action:
                      action: none
                    show_icon: true
                    show_name: true
                    entity: switch.Staubsauger_GoHome
                    icon: 'mdi:stop-circle-outline'
                    name: Go Home
                    icon_height: 50px
          - type: 'custom:vertical-stack-in-card'
            cards:
              - type: 'custom:button-card'
                name: INFOS
                icon: 'mdi:robot-vacuum'
                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
                    - font-size: x-large
              - type: divider
                style:
                  height: 1px
                  margin-left: 10px
                  margin-right: 10px
                  background: white
              - type: entities
                entities:
                  - entity: input_number.Staubsauger_Saugstufe
                    name: Saugstufe
                  - entity: input_number.Staubsauger_Lautstaerke
                    name: Lautstärke
                    icon: 'mdi:volume-high'
                  - entity: sensor.Staubsauger_Battery
                    name: Batterie
                    icon: 'mdi:battery'
                  - entity: sensor.Staubsauger_letzteTime
                    icon: 'mdi:clock'
                    name: Letzte Reiniung - Dauer
                  - entity: sensor.Staubsauger_letzteArea
                    icon: 'mdi:floor-plan'
                    name: Letzte Reinigung - Fläche
                  - entity: sensor.Staubsauger_Cleanups
                    icon: 'mdi:counter'
                    name: Gesamt - Reinigungen
                  - entity: sensor.Staubsauger_CleaningArea
                    icon: 'mdi:floor-plan'
                    name: Gesamt - Fläche
                  - entity: sensor.Staubsauger_Time
                    name: Gesamt - Zeit
                    icon: 'mdi:clock'
        badges: []
        icon: 'mdi:robot-vacuum'
      - cards:
          - type: gauge
            entity: sensor.SYS_Speicher
            min: 0
            max: 100
            severity:
              green: 0
              yellow: 0
              red: 0
            theme: default
            name: SPEICHER
          - type: 'custom:mini-graph-card'
            name: SPEICHER - VERLAUF
            icon: 'mdi:memory'
            entities:
              - entity: sensor.SYS_Speicher
          - type: gauge
            entity: sensor.SYS_CPU
            min: 0
            max: 100
            severity:
              green: 0
              yellow: 0
              red: 0
            theme: default
            name: CPU
          - type: 'custom:mini-graph-card'
            name: CPU - VERLAUF
            icon: 'mdi:cpu-64-bit'
            entities:
              - entity: sensor.SYS_CPU
          - type: 'custom:vertical-stack-in-card'
            cards:
              - type: 'custom:button-card'
                name: ADAPTER - STATUS
                icon: 'mdi:tune'
                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
                    - font-size: x-large
              - type: divider
                style:
                  height: 1px
                  margin-left: 10px
                  margin-right: 10px
                  background: white
              - type: 'custom:button-card'
                entity: sensor.AD_Adamin_Status
                name: Admin
                show_icon: true
                show_state: false
                show_label: true
                icon: 'mdi:circle'
                label: |
                  [[[ if (entity.state == false) 
                         return "inaktiv"; 
                        else 
                         return "aktiv";
                     ]]]
                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 'red';
                         ]]]
              - type: 'custom:button-card'
                entity: sensor.AD_Backitup
                name: Backitup
                show_icon: true
                show_state: false
                show_label: true
                icon: 'mdi:circle'
                label: |
                  [[[ if (entity.state == false) 
                         return "inaktiv"; 
                        else 
                         return "aktiv";
                     ]]]
                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 'red';
                         ]]]        
              - type: 'custom:button-card'
                entity: sensor.AD_Cloud
                name: Cloud
                show_icon: true
                show_state: false
                show_label: true
                icon: 'mdi:circle'
                label: |
                  [[[ if (entity.state == false) 
                         return "inaktiv"; 
                        else 
                         return "aktiv";
                     ]]]
                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 'red';
                         ]]]        
              - type: 'custom:button-card'
                entity: sensor.AD_Discovery
                name: Discovery
                show_icon: true
                show_state: false
                show_label: true
                icon: 'mdi:circle'
                label: |
                  [[[ if (entity.state == false) 
                         return "inaktiv"; 
                        else 
                         return "aktiv";
                     ]]]
                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 'red';
                         ]]]        
              - type: 'custom:button-card'
                entity: sensor.AD_History
                name: History
                show_icon: true
                show_state: false
                show_label: true
                icon: 'mdi:circle'
                label: |
                  [[[ if (entity.state == false) 
                         return "inaktiv"; 
                        else 
                         return "aktiv";
                     ]]]
                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 'red';
                         ]]]        
              - type: 'custom:button-card'
                entity: sensor.AD_Hue
                name: Philips Hue
                show_icon: true
                show_state: false
                show_label: true
                icon: 'mdi:circle'
                label: |
                  [[[ if (entity.state == false) 
                         return "inaktiv"; 
                        else 
                         return "aktiv";
                     ]]]
                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 're';
                         ]]]        
              - type: 'custom:button-card'
                entity: sensor.AD_Lovelace
                name: Lovelace
                show_icon: true
                show_state: false
                show_label: true
                icon: 'mdi:circle'
                label: |
                  [[[ if (entity.state == false) 
                         return "inaktiv"; 
                        else 
                         return "aktiv";
                     ]]]
                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 'red';
                         ]]]        
              - type: 'custom:button-card'
                entity: sensor.AD_Mihome_Vacuum
                name: Mihome Vacuum
                show_icon: true
                show_state: false
                show_label: true
                icon: 'mdi:circle'
                label: |
                  [[[ if (entity.state == false) 
                         return "inaktiv"; 
                        else 
                         return "aktiv";
                     ]]]
                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 're';
                         ]]]        
              - type: 'custom:button-card'
                entity: sensor.AD_Proxmox
                name: Proxmox
                show_icon: true
                show_state: false
                show_label: true
                icon: 'mdi:circle'
                label: |
                  [[[ if (entity.state == false) 
                         return "inaktiv"; 
                        else 
                         return "aktiv";
                     ]]]
                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 're';
                         ]]]        
              - type: 'custom:button-card'
                entity: sensor.AD_Scenes
                name: Scenes
                show_icon: true
                show_state: false
                show_label: true
                icon: 'mdi:circle'
                label: |
                  [[[ if (entity.state == false) 
                         return "inaktiv"; 
                        else 
                         return "aktiv";
                     ]]]
                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 'red';
                         ]]]        
              - type: 'custom:button-card'
                entity: sensor.AD_Shelly
                name: Shelly
                show_icon: true
                show_state: false
                show_label: true
                icon: 'mdi:circle'
                label: |
                  [[[ if (entity.state == false) 
                         return "inaktiv"; 
                        else 
                         return "aktiv";
                     ]]]
                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 'red';
                         ]]]        
              - type: 'custom:button-card'
                entity: sensor.AD_Sonoff
                name: Sonoff
                show_icon: true
                show_state: false
                show_label: true
                icon: 'mdi:circle'
                label: |
                  [[[ if (entity.state == false) 
                         return "inaktiv"; 
                        else 
                         return "aktiv";
                     ]]]
                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 'red';
                         ]]]        
              - type: 'custom:button-card'
                entity: sensor.AD_Tankerkoenig
                name: Tankerkönig
                show_icon: true
                show_state: false
                show_label: true
                icon: 'mdi:circle'
                label: |
                  [[[ if (entity.state == false) 
                         return "inaktiv"; 
                        else 
                         return "aktiv";
                     ]]]
                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 'red';
                         ]]]        
              - type: 'custom:button-card'
                entity: sensor.AD_Terminal
                name: Terminal
                show_icon: true
                show_state: false
                show_label: true
                icon: 'mdi:circle'
                label: |
                  [[[ if (entity.state == false) 
                         return "inaktiv"; 
                        else 
                         return "aktiv";
                     ]]]
                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 'red';
                         ]]]        
              - type: 'custom:button-card'
                entity: sensor.AD_Web
                name: Web
                show_icon: true
                show_state: false
                show_label: true
                icon: 'mdi:circle'
                label: |
                  [[[ if (entity.state == false) 
                         return "inaktiv"; 
                        else 
                         return "aktiv";
                     ]]]
                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 'red';
                         ]]]        
              - type: 'custom:button-card'
                entity: sensor.AD_Yahka
                name: Yahka (Homekit)
                show_icon: true
                show_state: false
                show_label: true
                icon: 'mdi:circle'
                label: |
                  [[[ if (entity.state == false) 
                         return "inaktiv"; 
                        else 
                         return "aktiv";
                     ]]]
                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 'red';
                         ]]]        
              - type: 'custom:button-card'
                entity: sensor.AD_Zigbee
                name: Zigbee
                show_icon: true
                show_state: false
                show_label: true
                icon: 'mdi:circle'
                label: |
                  [[[ if (entity.state == false) 
                         return "inaktiv"; 
                        else 
                         return "aktiv";
                     ]]]
                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 'red';
                         ]]]        
          - type: 'custom:vertical-stack-in-card'
            cards:
              - type: 'custom:button-card'
                name: ADAPTER - UPDATES
                icon: 'mdi:update'
                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
                    - font-size: x-large
              - type: divider
                style:
                  height: 1px
                  margin-left: 10px
                  margin-right: 10px
                  background: white
              - type: 'custom:button-card'
                entity: sensor.AD_Info_neuUpdate
                name: Updates verfügbar
                show_icon: false
                show_state: false
                show_label: true
                icon: 'mdi:circle'
                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: 4% 1fr 19%
                  name:
                    - justify-self: start
                    - margin: 0px
                  label:
                    - justify-self: end
                    - padding-right: 20px
              - type: 'custom:button-card'
                entity: sensor.AD_Info_updatesNumber
                name: Anzahl verfügbarer Updates
                show_icon: false
                show_state: false
                show_label: true
                icon: 'mdi:circle'
                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: 4% 1fr 19%
                  name:
                    - justify-self: start
                    - margin: 0px
                  label:
                    - justify-self: end
                    - padding-right: 20px
              - type: 'custom:button-card'
                entity: sensor.AD_Info_updatesList
                name: Updates für Adapter
                show_icon: false
                show_state: true
                show_label: true
                icon: 'mdi:circle'
                styles:
                  card:
                    - padding-top: 10px
                    - padding-bottom: 10px
                  grid:
                    - grid-template-areas: '"i n l"'
                    - grid-template-columns: 4% 1fr 19%
                  name:
                    - justify-self: start
                    - margin: 0px
                  label:
                    - justify-self: end
                    - padding-right: 20px
          - type: 'custom:vertical-stack-in-card'
            cards:
              - type: 'custom:button-card'
                name: BACKUP
                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
                    - font-size: x-large
              - type: divider
                style:
                  height: 1px
                  margin-left: 10px
                  margin-right: 10px
                  background: white
              - type: 'custom:button-card'
                entity: sensor.SYS_StatusBackup_klein
                layout: icon_name
                name: Klein
                show_icon: false
                show_state: true
                show_label: false
                icon: 'mdi:content-save'
                label: |
                  [[[ if (entity.state == false) 
                        return "nein"; 
                      else 
                        return entity.state;
                  ]]]
                styles:
                  card:
                    - padding-top: 10px
                    - padding-bottom: 10px
                  grid:
                    - grid-template-areas: '"i n l"'
                    - grid-template-columns: 4% 1fr 19%
                  name:
                    - justify-self: start
                    - margin: 0px
                  show_state:
                    - font-size: x-large
                  label:
                    - justify-self: end
                    - padding-right: 20px
              - type: 'custom:button-card'
                entity: sensor.SYS_Backup_komplett
                layout: icon_name
                name: Vollständig
                show_icon: false
                show_state: true
                show_label: false
                icon: 'mdi:content-save'
                label: |
                  [[[ if (entity.state == false) 
                        return "nein"; 
                      else 
                        return entity.state;
                  ]]]
                styles:
                  card:
                    - padding-top: 10px
                    - padding-bottom: 10px
                  grid:
                    - grid-template-areas: '"i n l"'
                    - grid-template-columns: 4% 1fr 19%
                  name:
                    - justify-self: start
                    - margin: 0px
                  label:
                    - justify-self: end
                    - padding-right: 20px
              - type: divider
                style:
                  height: 1px
                  margin-left: 10px
                  margin-right: 10px
                  background: white
              - type: entities
                entities:
                  - entity: switch.SYS_Backup_klein
                    name: Backup - klein
                    icon: 'mdi:content-save'
                  - entity: switch.SYS_Backup_komplett
                    icon: 'mdi:content-save'
                    name: Backup - vollständig
                title: Backup - durchführen
                show_header_toggle: false
        badges: []
        title: Systeminfos
        path: systeminfos
        icon: 'mdi:chip'
    hideToolbar: false
    background: center / cover no-repeat url("/cards/background.jpg") fixed
    resources:
      - type: jpg
        url: /cards/background.jpg
      - type: module
        url: /cards/button-card.js
      - type: module
        url: /cards/calendar-card.js
      - type: module
        url: /cards/compact-custom-header.js
      - type: module
        url: /cards/light-entity-card.js
      - type: module
        url: /cards/mini-graph-card-bundle.js
      - type: module
        url: /cards/more-info-card.js
      - type: module
        url: /cards/text-divider-row.js
      - type: module
        url: /cards/vertical-stack-in-card.js
    
    
    1 Antwort Letzte Antwort
    3
    • W WW1983

      Weiß zufällig jemand in welcher Datei der Link für die Wettericons hinterlegt ist? Bei mir Zeit der keine Icons an:
      1569614887077-anmerkung-2019-09-27-220653.png

      W Offline
      W Offline
      WW1983
      schrieb am zuletzt editiert von
      #246

      Hat jemand die Wetter-Card zum laufen gebracht? Bei mir werden keine Icons angezeigt. Das war aber nicht immer so.

      BBTownB G 2 Antworten Letzte Antwort
      0
      • W WW1983

        @marcuskl
        das ist das Theme. Habe nur den Hintergrund dunkler gemacht:
        https://techleech.com/2019/04/11/diy-smart-home-bonus-content-home-assistant-theme/

        marcusklM Offline
        marcusklM Offline
        marcuskl
        schrieb am zuletzt editiert von
        #247

        @WW1983 Danke dir :blush:

        Host: Intel Nuc6cayh (16GB Ram, 240GB SSD) mit Proxmox.

        Iobroker VM, InfluxDB LXC, Pihole LXC, Tasmoadmin LXC, Easy2connect VM

        1 Antwort Letzte Antwort
        0
        • W WW1983

          Hat jemand die Wetter-Card zum laufen gebracht? Bei mir werden keine Icons angezeigt. Das war aber nicht immer so.

          BBTownB Offline
          BBTownB Offline
          BBTown
          schrieb am zuletzt editiert von BBTown
          #248

          @WW1983 sagte in Test Adapter lovelace v0.2.x:

          Hat jemand die Wetter-Card zum laufen gebracht? Bei mir werden keine Icons angezeigt. Das war aber nicht immer so.

          Hast Du die Icon irgendwann mal selbst kopiert/hochgeladen und kann es sein dass dies erst seit der Aktualisierung auf js-controller v2.x so ist?, dann könnte es mit den Hinweisen hier zu tun haben.

          Weiterhin wird der ioBroke-Eigene-Dateibereich (im Normalfall bisher unter <ioBroker-Verzeichnis>/iobroker-data/files/...) nun strikter behandelt und manuell oder per Skript (fs.write) dort direkt abgelegte/hinkopierte Dateien sind ggf. nicht mehr in Visualisierungen anzeigbar!
          Skripte müssen angepasst werden (Nutzung von writeFile) bzw. die Dateien müssen in offiziell definierte Adpater-Basisverzeichnisse (z.B. vis.0, iqontrol.meta u.ä.) abgelegt werden. Nutzt am besten auch die offiziellen Uploader via Vis oder iqontrol, damit diese Dateien korrekt registriert sind. Diese Änderung wurde auch zur Erhöhung der Sicherheit umgesetzt! Der positive Nebeneffekt ist auch das die Files dann mit im Backup landen, was bisher nicht gegeben war!
          

          ioBroker auf NUC (VM debian v13 (Trixie ), node v22.21.0 npm v10.9.4, js-controller v7.0.7 jsonl/jsonl / HomeMatic CCU-2 (Wired und Funk) / Philips HUE / echo.DOT / Broadlink RM pro / SONOS

          W 1 Antwort Letzte Antwort
          0
          • W WW1983

            @marcuskl
            das ist das Theme. Habe nur den Hintergrund dunkler gemacht:
            https://techleech.com/2019/04/11/diy-smart-home-bonus-content-home-assistant-theme/

            X Offline
            X Offline
            xADDRx
            schrieb am zuletzt editiert von
            #249

            @WW1983 Ich habe den Code kopiert, jedoch ändert sich nicht am Theme.

            # Main colors
            primary-color: '#5294E2'                                                        # Header
            accent-color: '#E45E65'                                                         # Accent color
            dark-primary-color: 'var(--accent-color)'                                       # Hyperlinks                                         
            light-primary-color: 'var(--accent-color)'                                      # Horizontal line in about
            ha-card-border-radius: '20px'   
            ha-card-background: 'rgba(150, 150, 150, 0.1)'
                                                                                       
            # Text colors                                                                  
            primary-text-color: '#FFFFFF'                                                   # Primary text colour, here is referencing dark-primary-color
            text-primary-color: 'var(--primary-text-color)'                                 # Primary text colour
            secondary-text-color: '#5294E2'                                                 # For secondary titles in more info boxes etc.
            disabled-text-color: '#7F848E'                                                  # Disabled text colour
            label-badge-border-color: 'green'                                               # Label badge border, just a reference value   
            
            # Background colors                                                            
            primary-background-color: '#383C45'                                             # Settings background
            secondary-background-color: '#383C45'                                           # Main card UI background  
            divider-color: 'rgba(0, 0, 0, .12)'                                             # Divider 
            
            # Table rows                                                                   
            table-row-background-color: '#353840'                                           # Table row
            table-row-alternative-background-color: '#3E424B'                               # Table row alternative
                                                                                       
            # Nav Menu                                                                   
            paper-listbox-color: 'var(--primary-color)'                                     # Navigation menu selection hoover
            paper-listbox-background-color: '#2E333A'                                       # Navigation menu background
            paper-grey-50: 'var(--primary-text-color)'                                   
            paper-grey-200: '#414A59'                                                       # Navigation menu selection
                                                                                       
            # Paper card                                                               
            paper-card-header-color: 'var(--accent-color)'                                  # Card header text colour
            paper-card-background-color: 'rgba(150, 150, 150, 0.1)'                         # Card background colour
            paper-dialog-background-color: '#434954'                                        # Card dialog background colour
            paper-item-icon-color: 'var(--primary-text-color)'                              # Icon color
            paper-item-icon-active-color: '#F9C536'                                         # Icon color active
            paper-item-icon_-_color: 'green'           
            paper-item-selected_-_background-color: '#434954'                               # Popup item select                      
            paper-tabs-selection-bar-color: 'green'
            
            # Labels 
            label-badge-red: 'var(--accent-color)'                                          # References the brand colour label badge border
            label-badge-text-color: 'var(--primary-text-color)'                             # Now same as label badge border but that's a matter of taste
            label-badge-background-color: '#2E333A'                                         # Same, but can also be set to transparent here
            label-badge-background: 'rgba(255, 255, 255, 0.1)'
            
            # Switches
            paper-toggle-button-checked-button-color: 'var(--accent-color)'
            paper-toggle-button-checked-bar-color: 'var(--accent-color)'
            paper-toggle-button-checked-ink-color: 'var(--accent-color)'
            paper-toggle-button-unchecked-button-color: 'var(--disabled-text-color)'
            paper-toggle-button-unchecked-bar-color: 'var(--disabled-text-color)'
            paper-toggle-button-unchecked-ink-color: 'var(--disabled-text-color)'  
            
            # Sliders
            paper-slider-knob-color: 'var(--accent-color)'
            paper-slider-knob-start-color: 'var(--accent-color)'
            paper-slider-pin-color: 'var(--accent-color)'
            paper-slider-active-color: 'var(--accent-color)'
            paper-slider-container-color: 'linear-gradient(var(--primary-background-color), var(--secondary-background-color)) no-repeat'
            paper-slider-secondary-color: 'var(--secondary-background-color)'
            paper-slider-disabled-active-color: 'var(--disabled-text-color)'
            paper-slider-disabled-secondary-color: 'var(--disabled-text-color)'
            
            # Google colors
            google-red-500: '#E45E65'
            google-green-500: '#39E949'
            
            

            Sonos, Intel Nuc, Iobroker Pro, Proxmox, IPad Air (Wand), Vis, Xiaomi, Devolo, Bose, Philips Hue, Instar, Synology

            marcusklM W 2 Antworten Letzte Antwort
            0
            • W WW1983

              Hat jemand die Wetter-Card zum laufen gebracht? Bei mir werden keine Icons angezeigt. Das war aber nicht immer so.

              G Offline
              G Offline
              g.polat
              schrieb am zuletzt editiert von
              #250

              @WW1983 sagte in Test Adapter lovelace v0.2.x:

              Hat jemand die Wetter-Card zum laufen gebracht? Bei mir werden keine Icons angezeigt. Das war aber nicht immer so.

              Hier das gleiche, hast du eine Lösung gefunden?

              W 1 Antwort Letzte Antwort
              0
              • ScroungerS Scrounger

                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
                anwesenheit.png

                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: FireBrick
                

                Fenster
                windows.png

                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: false
                
                

                Licht - Schalter
                light_switch.gif

                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: smaller
                

                Licht - Dimmer
                light_dimmer.gif

                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: smaller
                

                Geräte
                devices.png

                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
                

                system.png

                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
                

                raspi.png

                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: 6px
                
                

                Bar-Chart
                graph.png

                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
                
                

                G Offline
                G Offline
                g.polat
                schrieb am zuletzt editiert von
                #251

                @Scrounger sagte in Test Adapter lovelace v0.2.x:

                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
                anwesenheit.png

                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: FireBrick
                

                Fenster
                windows.png

                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: false
                
                

                Licht - Schalter
                light_switch.gif

                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: smaller
                

                Licht - Dimmer
                light_dimmer.gif

                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: smaller
                

                Geräte
                devices.png

                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
                

                system.png

                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
                

                raspi.png

                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: 6px
                
                

                Bar-Chart
                graph.png

                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
                
                

                tolle arbeit, wie hast u das mit den Pictures gelöst. Wie lautet der Pfad im Iobroker?
                Gruß

                ScroungerS 1 Antwort Letzte Antwort
                2
                • X xADDRx

                  @WW1983 Ich habe den Code kopiert, jedoch ändert sich nicht am Theme.

                  # Main colors
                  primary-color: '#5294E2'                                                        # Header
                  accent-color: '#E45E65'                                                         # Accent color
                  dark-primary-color: 'var(--accent-color)'                                       # Hyperlinks                                         
                  light-primary-color: 'var(--accent-color)'                                      # Horizontal line in about
                  ha-card-border-radius: '20px'   
                  ha-card-background: 'rgba(150, 150, 150, 0.1)'
                                                                                             
                  # Text colors                                                                  
                  primary-text-color: '#FFFFFF'                                                   # Primary text colour, here is referencing dark-primary-color
                  text-primary-color: 'var(--primary-text-color)'                                 # Primary text colour
                  secondary-text-color: '#5294E2'                                                 # For secondary titles in more info boxes etc.
                  disabled-text-color: '#7F848E'                                                  # Disabled text colour
                  label-badge-border-color: 'green'                                               # Label badge border, just a reference value   
                  
                  # Background colors                                                            
                  primary-background-color: '#383C45'                                             # Settings background
                  secondary-background-color: '#383C45'                                           # Main card UI background  
                  divider-color: 'rgba(0, 0, 0, .12)'                                             # Divider 
                  
                  # Table rows                                                                   
                  table-row-background-color: '#353840'                                           # Table row
                  table-row-alternative-background-color: '#3E424B'                               # Table row alternative
                                                                                             
                  # Nav Menu                                                                   
                  paper-listbox-color: 'var(--primary-color)'                                     # Navigation menu selection hoover
                  paper-listbox-background-color: '#2E333A'                                       # Navigation menu background
                  paper-grey-50: 'var(--primary-text-color)'                                   
                  paper-grey-200: '#414A59'                                                       # Navigation menu selection
                                                                                             
                  # Paper card                                                               
                  paper-card-header-color: 'var(--accent-color)'                                  # Card header text colour
                  paper-card-background-color: 'rgba(150, 150, 150, 0.1)'                         # Card background colour
                  paper-dialog-background-color: '#434954'                                        # Card dialog background colour
                  paper-item-icon-color: 'var(--primary-text-color)'                              # Icon color
                  paper-item-icon-active-color: '#F9C536'                                         # Icon color active
                  paper-item-icon_-_color: 'green'           
                  paper-item-selected_-_background-color: '#434954'                               # Popup item select                      
                  paper-tabs-selection-bar-color: 'green'
                  
                  # Labels 
                  label-badge-red: 'var(--accent-color)'                                          # References the brand colour label badge border
                  label-badge-text-color: 'var(--primary-text-color)'                             # Now same as label badge border but that's a matter of taste
                  label-badge-background-color: '#2E333A'                                         # Same, but can also be set to transparent here
                  label-badge-background: 'rgba(255, 255, 255, 0.1)'
                  
                  # Switches
                  paper-toggle-button-checked-button-color: 'var(--accent-color)'
                  paper-toggle-button-checked-bar-color: 'var(--accent-color)'
                  paper-toggle-button-checked-ink-color: 'var(--accent-color)'
                  paper-toggle-button-unchecked-button-color: 'var(--disabled-text-color)'
                  paper-toggle-button-unchecked-bar-color: 'var(--disabled-text-color)'
                  paper-toggle-button-unchecked-ink-color: 'var(--disabled-text-color)'  
                  
                  # Sliders
                  paper-slider-knob-color: 'var(--accent-color)'
                  paper-slider-knob-start-color: 'var(--accent-color)'
                  paper-slider-pin-color: 'var(--accent-color)'
                  paper-slider-active-color: 'var(--accent-color)'
                  paper-slider-container-color: 'linear-gradient(var(--primary-background-color), var(--secondary-background-color)) no-repeat'
                  paper-slider-secondary-color: 'var(--secondary-background-color)'
                  paper-slider-disabled-active-color: 'var(--disabled-text-color)'
                  paper-slider-disabled-secondary-color: 'var(--disabled-text-color)'
                  
                  # Google colors
                  google-red-500: '#E45E65'
                  google-green-500: '#39E949'
                  
                  
                  marcusklM Offline
                  marcusklM Offline
                  marcuskl
                  schrieb am zuletzt editiert von
                  #252

                  @xADDRx

                  Hat bei mir auch nicht so funktioniert.
                  Du musst vorher "transparent:" hinzufügen, so:

                  transparent:
                     # Main colors
                     primary-color: '#5294E2'                                                        # Header
                     accent-color: '#E45E65'                                                         # Accent color
                     dark-primary-color: 'var(--accent-color)'                                       # Hyperlinks                                         
                  ........
                  

                  dann funktioniert es.

                  Ich habe noch das Hintergrund Bild bei den Cards hochgeladen und die Zeile Backround image hinzugefügt.

                  #Background images
                  background: center / cover no-repeat url("/cards/background.jpg") fixed
                  

                  Host: Intel Nuc6cayh (16GB Ram, 240GB SSD) mit Proxmox.

                  Iobroker VM, InfluxDB LXC, Pihole LXC, Tasmoadmin LXC, Easy2connect VM

                  X marcusklM 2 Antworten Letzte Antwort
                  2
                  • BBTownB BBTown

                    @WW1983 sagte in Test Adapter lovelace v0.2.x:

                    Hat jemand die Wetter-Card zum laufen gebracht? Bei mir werden keine Icons angezeigt. Das war aber nicht immer so.

                    Hast Du die Icon irgendwann mal selbst kopiert/hochgeladen und kann es sein dass dies erst seit der Aktualisierung auf js-controller v2.x so ist?, dann könnte es mit den Hinweisen hier zu tun haben.

                    Weiterhin wird der ioBroke-Eigene-Dateibereich (im Normalfall bisher unter <ioBroker-Verzeichnis>/iobroker-data/files/...) nun strikter behandelt und manuell oder per Skript (fs.write) dort direkt abgelegte/hinkopierte Dateien sind ggf. nicht mehr in Visualisierungen anzeigbar!
                    Skripte müssen angepasst werden (Nutzung von writeFile) bzw. die Dateien müssen in offiziell definierte Adpater-Basisverzeichnisse (z.B. vis.0, iqontrol.meta u.ä.) abgelegt werden. Nutzt am besten auch die offiziellen Uploader via Vis oder iqontrol, damit diese Dateien korrekt registriert sind. Diese Änderung wurde auch zur Erhöhung der Sicherheit umgesetzt! Der positive Nebeneffekt ist auch das die Files dann mit im Backup landen, was bisher nicht gegeben war!
                    
                    W Offline
                    W Offline
                    WW1983
                    schrieb am zuletzt editiert von
                    #253

                    @BBTown
                    Habe eigentlich nichts selbst kopiert / hochgeladen. Sind die Icons von DasWetter

                    1 Antwort Letzte Antwort
                    0
                    • G g.polat

                      @WW1983 sagte in Test Adapter lovelace v0.2.x:

                      Hat jemand die Wetter-Card zum laufen gebracht? Bei mir werden keine Icons angezeigt. Das war aber nicht immer so.

                      Hier das gleiche, hast du eine Lösung gefunden?

                      W Offline
                      W Offline
                      WW1983
                      schrieb am zuletzt editiert von
                      #254

                      @g-polat
                      Leider nein

                      1 Antwort Letzte Antwort
                      0
                      • X xADDRx

                        @WW1983 Ich habe den Code kopiert, jedoch ändert sich nicht am Theme.

                        # Main colors
                        primary-color: '#5294E2'                                                        # Header
                        accent-color: '#E45E65'                                                         # Accent color
                        dark-primary-color: 'var(--accent-color)'                                       # Hyperlinks                                         
                        light-primary-color: 'var(--accent-color)'                                      # Horizontal line in about
                        ha-card-border-radius: '20px'   
                        ha-card-background: 'rgba(150, 150, 150, 0.1)'
                                                                                                   
                        # Text colors                                                                  
                        primary-text-color: '#FFFFFF'                                                   # Primary text colour, here is referencing dark-primary-color
                        text-primary-color: 'var(--primary-text-color)'                                 # Primary text colour
                        secondary-text-color: '#5294E2'                                                 # For secondary titles in more info boxes etc.
                        disabled-text-color: '#7F848E'                                                  # Disabled text colour
                        label-badge-border-color: 'green'                                               # Label badge border, just a reference value   
                        
                        # Background colors                                                            
                        primary-background-color: '#383C45'                                             # Settings background
                        secondary-background-color: '#383C45'                                           # Main card UI background  
                        divider-color: 'rgba(0, 0, 0, .12)'                                             # Divider 
                        
                        # Table rows                                                                   
                        table-row-background-color: '#353840'                                           # Table row
                        table-row-alternative-background-color: '#3E424B'                               # Table row alternative
                                                                                                   
                        # Nav Menu                                                                   
                        paper-listbox-color: 'var(--primary-color)'                                     # Navigation menu selection hoover
                        paper-listbox-background-color: '#2E333A'                                       # Navigation menu background
                        paper-grey-50: 'var(--primary-text-color)'                                   
                        paper-grey-200: '#414A59'                                                       # Navigation menu selection
                                                                                                   
                        # Paper card                                                               
                        paper-card-header-color: 'var(--accent-color)'                                  # Card header text colour
                        paper-card-background-color: 'rgba(150, 150, 150, 0.1)'                         # Card background colour
                        paper-dialog-background-color: '#434954'                                        # Card dialog background colour
                        paper-item-icon-color: 'var(--primary-text-color)'                              # Icon color
                        paper-item-icon-active-color: '#F9C536'                                         # Icon color active
                        paper-item-icon_-_color: 'green'           
                        paper-item-selected_-_background-color: '#434954'                               # Popup item select                      
                        paper-tabs-selection-bar-color: 'green'
                        
                        # Labels 
                        label-badge-red: 'var(--accent-color)'                                          # References the brand colour label badge border
                        label-badge-text-color: 'var(--primary-text-color)'                             # Now same as label badge border but that's a matter of taste
                        label-badge-background-color: '#2E333A'                                         # Same, but can also be set to transparent here
                        label-badge-background: 'rgba(255, 255, 255, 0.1)'
                        
                        # Switches
                        paper-toggle-button-checked-button-color: 'var(--accent-color)'
                        paper-toggle-button-checked-bar-color: 'var(--accent-color)'
                        paper-toggle-button-checked-ink-color: 'var(--accent-color)'
                        paper-toggle-button-unchecked-button-color: 'var(--disabled-text-color)'
                        paper-toggle-button-unchecked-bar-color: 'var(--disabled-text-color)'
                        paper-toggle-button-unchecked-ink-color: 'var(--disabled-text-color)'  
                        
                        # Sliders
                        paper-slider-knob-color: 'var(--accent-color)'
                        paper-slider-knob-start-color: 'var(--accent-color)'
                        paper-slider-pin-color: 'var(--accent-color)'
                        paper-slider-active-color: 'var(--accent-color)'
                        paper-slider-container-color: 'linear-gradient(var(--primary-background-color), var(--secondary-background-color)) no-repeat'
                        paper-slider-secondary-color: 'var(--secondary-background-color)'
                        paper-slider-disabled-active-color: 'var(--disabled-text-color)'
                        paper-slider-disabled-secondary-color: 'var(--disabled-text-color)'
                        
                        # Google colors
                        google-red-500: '#E45E65'
                        google-green-500: '#39E949'
                        
                        
                        W Offline
                        W Offline
                        WW1983
                        schrieb am zuletzt editiert von WW1983
                        #255

                        @xADDRx
                        Das Theme musst du manuell hinzufügen. In den Einstellungen von Lovelace gibt es einen Extra Reiter "Theme". Dort habe ich die Theme Einstellungen hineinkopiert. Kann gerne mal den Theme "Code" heute Abend hier rein stellen.

                        Edit: Sehe gerade dass @marcuskl es schon gepostet hat

                        marcusklM 1 Antwort Letzte Antwort
                        0
                        • W WW1983

                          @xADDRx
                          Das Theme musst du manuell hinzufügen. In den Einstellungen von Lovelace gibt es einen Extra Reiter "Theme". Dort habe ich die Theme Einstellungen hineinkopiert. Kann gerne mal den Theme "Code" heute Abend hier rein stellen.

                          Edit: Sehe gerade dass @marcuskl es schon gepostet hat

                          marcusklM Offline
                          marcusklM Offline
                          marcuskl
                          schrieb am zuletzt editiert von
                          #256

                          @WW1983 hast du es hinbekommen den header transparent zu bekommen mit der compact-custom-header card ?

                          Host: Intel Nuc6cayh (16GB Ram, 240GB SSD) mit Proxmox.

                          Iobroker VM, InfluxDB LXC, Pihole LXC, Tasmoadmin LXC, Easy2connect VM

                          W 1 Antwort Letzte Antwort
                          0
                          • marcusklM marcuskl

                            @WW1983 hast du es hinbekommen den header transparent zu bekommen mit der compact-custom-header card ?

                            W Offline
                            W Offline
                            WW1983
                            schrieb am zuletzt editiert von
                            #257

                            @marcuskl

                            Nein. Leider nicht. Habe nicht wirklich verstanden wo und wie man es einstellen kann. Deshalb habe ich den Header einfach farblich halbwegs angepasst

                            1 Antwort Letzte Antwort
                            0
                            • marcusklM Offline
                              marcusklM Offline
                              marcuskl
                              schrieb am zuletzt editiert von
                              #258

                              @WW1983
                              Ich habe alles mögliche versucht aber die Card hat nicht funktioniert.
                              Ich habe es auch nur dunkler gemacht

                              Host: Intel Nuc6cayh (16GB Ram, 240GB SSD) mit Proxmox.

                              Iobroker VM, InfluxDB LXC, Pihole LXC, Tasmoadmin LXC, Easy2connect VM

                              W 1 Antwort Letzte Antwort
                              0
                              • marcusklM marcuskl

                                @WW1983
                                Ich habe alles mögliche versucht aber die Card hat nicht funktioniert.
                                Ich habe es auch nur dunkler gemacht

                                W Offline
                                W Offline
                                WW1983
                                schrieb am zuletzt editiert von
                                #259

                                @marcuskl
                                es funktionieren derzeit so einige Cards nicht. Ich hoffe das wird irgendwann noch behoben.

                                Man kann zwar jetzt schon was brauchbares basteln. Aber schade das noch so vieles nicht funktioniert. Auch die "Standard-Entitys"

                                marcusklM 1 Antwort Letzte Antwort
                                0
                                • W WW1983

                                  @marcuskl
                                  es funktionieren derzeit so einige Cards nicht. Ich hoffe das wird irgendwann noch behoben.

                                  Man kann zwar jetzt schon was brauchbares basteln. Aber schade das noch so vieles nicht funktioniert. Auch die "Standard-Entitys"

                                  marcusklM Offline
                                  marcusklM Offline
                                  marcuskl
                                  schrieb am zuletzt editiert von
                                  #260

                                  @WW1983 Ja des stimmt.
                                  Ich würde gerne mal meine RGB Beleuchtungen einbinden, aber die light entiy card funktioniert auch noch nicht.
                                  https://github.com/ljmerza/light-entity-card

                                  Host: Intel Nuc6cayh (16GB Ram, 240GB SSD) mit Proxmox.

                                  Iobroker VM, InfluxDB LXC, Pihole LXC, Tasmoadmin LXC, Easy2connect VM

                                  W 1 Antwort Letzte Antwort
                                  0
                                  • marcusklM marcuskl

                                    @WW1983 Ja des stimmt.
                                    Ich würde gerne mal meine RGB Beleuchtungen einbinden, aber die light entiy card funktioniert auch noch nicht.
                                    https://github.com/ljmerza/light-entity-card

                                    W Offline
                                    W Offline
                                    WW1983
                                    schrieb am zuletzt editiert von
                                    #261

                                    @marcuskl
                                    Habe die auch schon getestet. Bei mir funktioniert die auch nicht. Aber auch die integrierte Light Card funktioniert bei mir nicht. Kann nur licht an und aus machen, aber mit der Card nicht die Dimmfunktion nutzen.

                                    N 1 Antwort Letzte Antwort
                                    1
                                    • marcusklM marcuskl

                                      @xADDRx

                                      Hat bei mir auch nicht so funktioniert.
                                      Du musst vorher "transparent:" hinzufügen, so:

                                      transparent:
                                         # Main colors
                                         primary-color: '#5294E2'                                                        # Header
                                         accent-color: '#E45E65'                                                         # Accent color
                                         dark-primary-color: 'var(--accent-color)'                                       # Hyperlinks                                         
                                      ........
                                      

                                      dann funktioniert es.

                                      Ich habe noch das Hintergrund Bild bei den Cards hochgeladen und die Zeile Backround image hinzugefügt.

                                      #Background images
                                      background: center / cover no-repeat url("/cards/background.jpg") fixed
                                      
                                      X Offline
                                      X Offline
                                      xADDRx
                                      schrieb am zuletzt editiert von xADDRx
                                      #262

                                      @marcuskl danke

                                      transparent:
                                         # Main colors
                                         primary-color: '#5294E2'                                                        # Header
                                         accent-color: '#E45E65'                                                         # Accent color
                                         dark-primary-color: 'var(--accent-color)'                                       # Hyperlinks                                         
                                         light-primary-color: 'var(--accent-color)'                                      # Horizontal line in about
                                         ha-card-border-radius: '20px'   
                                         ha-card-background: 'rgba(150, 150, 150, 0.1)'
                                      
                                                                                                                 
                                      
                                         # Text colors                                                                  
                                         primary-text-color: '#FFFFFF'                                                   # Primary text colour, here is referencing dark-primary-color
                                         text-primary-color: 'var(--primary-text-color)'                                 # Primary text colour
                                         secondary-text-color: '#5294E2'                                                 # For secondary titles in more info boxes etc.
                                         disabled-text-color: '#7F848E'                                                  # Disabled text colour
                                         label-badge-border-color: 'green'                                               # Label badge border, just a reference value   
                                      
                                       
                                      
                                         # Background colors                                                            
                                         primary-background-color: '#383C45'                                             # Settings background
                                         secondary-background-color: '#383C45'                                           # Main card UI background  
                                         divider-color: 'rgba(0, 0, 0, .12)'                                             # Divider 
                                      
                                       
                                      
                                         # Table rows                                                                   
                                         table-row-background-color: '#353840'                                           # Table row
                                         table-row-alternative-background-color: '#3E424B'                               # Table row alternative
                                      
                                                                                                                 
                                      
                                         # Nav Menu                                                                   
                                         paper-listbox-color: 'var(--primary-color)'                                     # Navigation menu selection hoover
                                         paper-listbox-background-color: '#2E333A'                                       # Navigation menu background
                                         paper-grey-50: 'var(--primary-text-color)'                                   
                                         paper-grey-200: '#414A59'                                                       # Navigation menu selection
                                      
                                                                                                                 
                                      
                                         # Paper card                                                               
                                         paper-card-header-color: 'var(--accent-color)'                                  # Card header text colour
                                         paper-card-background-color: 'rgba(150, 150, 150, 0.1)'                         # Card background colour
                                         paper-dialog-background-color: '#434954'                                        # Card dialog background colour
                                         paper-item-icon-color: 'var(--primary-text-color)'                              # Icon color
                                         paper-item-icon-active-color: '#F9C536'                                         # Icon color active
                                         paper-item-icon_-_color: 'green'           
                                         paper-item-selected_-_background-color: '#434954'                               # Popup item select                      
                                         paper-tabs-selection-bar-color: 'green'
                                      
                                       
                                      
                                         # Labels 
                                         label-badge-red: 'var(--accent-color)'                                          # References the brand colour label badge border
                                         label-badge-text-color: 'var(--primary-text-color)'                             # Now same as label badge border but that's a matter of taste
                                         label-badge-background-color: '#2E333A'                                         # Same, but can also be set to transparent here
                                         label-badge-background: 'rgba(255, 255, 255, 0.1)'
                                      
                                       
                                      
                                         # Switches
                                         paper-toggle-button-checked-button-color: 'var(--accent-color)'
                                         paper-toggle-button-checked-bar-color: 'var(--accent-color)'
                                         paper-toggle-button-checked-ink-color: 'var(--accent-color)'
                                         paper-toggle-button-unchecked-button-color: 'var(--disabled-text-color)'
                                         paper-toggle-button-unchecked-bar-color: 'var(--disabled-text-color)'
                                         paper-toggle-button-unchecked-ink-color: 'var(--disabled-text-color)'  
                                      
                                       
                                      
                                         # Sliders
                                         paper-slider-knob-color: 'var(--accent-color)'
                                         paper-slider-knob-start-color: 'var(--accent-color)'
                                         paper-slider-pin-color: 'var(--accent-color)'
                                         paper-slider-active-color: 'var(--accent-color)'
                                         paper-slider-container-color: 'linear-gradient(var(--primary-background-color), var(--secondary-background-color)) no-repeat'
                                         paper-slider-secondary-color: 'var(--secondary-background-color)'
                                         paper-slider-disabled-active-color: 'var(--disabled-text-color)'
                                         paper-slider-disabled-secondary-color: 'var(--disabled-text-color)'
                                      
                                       
                                      
                                         # Google colors
                                         google-red-500: '#E45E65'
                                         google-green-500: '#39E949'
                                      
                                      
                                      
                                         # Background images
                                         background: center / cover no-repeat url("/cards/background.jpg") fixed
                                      

                                      Sonos, Intel Nuc, Iobroker Pro, Proxmox, IPad Air (Wand), Vis, Xiaomi, Devolo, Bose, Philips Hue, Instar, Synology

                                      1 Antwort Letzte Antwort
                                      0
                                      • S Offline
                                        S Offline
                                        schittl
                                        schrieb am zuletzt editiert von
                                        #263

                                        Hi,

                                        mal was zum Einstieg ehe ich mich tief darin verliere ;). Sollte man ebenfalls pro verschiedene Auflösung (z.B. Tablet & Smartphone) am besten 2 Views erstellen oder kann man das out of the box mit einer View bewerkstelligen.

                                        Ansonsten klingt der Adapter sehr interessant und ich bin schon fleißig am rumprobieren. Guter Ansatz bzw. Umsetzung.

                                        vg
                                        Falk

                                        HW: Lenovo M920q (Proxmox, ioBroker, RaspMatic & Z2M), QNAP (Docker, Influx), Arduino Mega 2560 R3 (I2C DS18B20 + LED)

                                        SW: CT IoBroker, VM RaspMatic(v3.79.6.20241122)

                                        1 Antwort Letzte Antwort
                                        0
                                        • G g.polat

                                          @Scrounger sagte in Test Adapter lovelace v0.2.x:

                                          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
                                          anwesenheit.png

                                          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: FireBrick
                                          

                                          Fenster
                                          windows.png

                                          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: false
                                          
                                          

                                          Licht - Schalter
                                          light_switch.gif

                                          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: smaller
                                          

                                          Licht - Dimmer
                                          light_dimmer.gif

                                          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: smaller
                                          

                                          Geräte
                                          devices.png

                                          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
                                          

                                          system.png

                                          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
                                          

                                          raspi.png

                                          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: 6px
                                          
                                          

                                          Bar-Chart
                                          graph.png

                                          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
                                          
                                          

                                          tolle arbeit, wie hast u das mit den Pictures gelöst. Wie lautet der Pfad im Iobroker?
                                          Gruß

                                          ScroungerS Offline
                                          ScroungerS Offline
                                          Scrounger
                                          Developer
                                          schrieb am zuletzt editiert von Scrounger
                                          #264

                                          @g-polat
                                          Glaub node-modules/lovelace/hass-irgendwa/static/
                                          Bin Grad nicht am Rechner.

                                          Und da dann reinkopiert. Achtung nach Adapter Update sind die Bilder dann weg!

                                          <a href="https://github.com/Scrounger/ioBroker.linkeddevices">LinkedDevices Adapter</a>

                                          <a href="https://github.com/Scrounger/ioBroker.vis-materialdesign">Material Design Widgets</a>

                                          W 1 Antwort Letzte Antwort
                                          0
                                          Antworten
                                          • In einem neuen Thema antworten
                                          Anmelden zum Antworten
                                          • Älteste zuerst
                                          • Neuste zuerst
                                          • Meiste Stimmen


                                          Support us

                                          ioBroker
                                          Community Adapters
                                          Donate

                                          543

                                          Online

                                          32.4k

                                          Benutzer

                                          81.5k

                                          Themen

                                          1.3m

                                          Beiträge
                                          Community
                                          Impressum | Datenschutz-Bestimmungen | Nutzungsbedingungen | Einwilligungseinstellungen
                                          ioBroker Community 2014-2025
                                          logo
                                          • Anmelden

                                          • Du hast noch kein Konto? Registrieren

                                          • Anmelden oder registrieren, um zu suchen
                                          • Erster Beitrag
                                            Letzter Beitrag
                                          0
                                          • Home
                                          • Aktuell
                                          • Tags
                                          • Ungelesen 0
                                          • Kategorien
                                          • Unreplied
                                          • Beliebt
                                          • GitHub
                                          • Docu
                                          • Hilfe