Navigation

    Logo
    • Register
    • Login
    • Search
    • Recent
    • Tags
    • Unread
    • Categories
    • Unreplied
    • Popular
    • GitHub
    • Docu
    • Hilfe
    1. Home
    2. Deutsch
    3. Tester
    4. Test Adapter lovelace v0.2.x

    NEWS

    • Neuer Blog: Fotos und Eindrücke aus Solingen

    • ioBroker@Smart Living Forum Solingen, 14.06. - Agenda added

    • ioBroker goes Matter ... Matter Adapter in Stable

    Test Adapter lovelace v0.2.x

    This topic has been deleted. Only users with topic management privileges can see it.
    • W
      WW1983 @ak1 last edited by

      @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 Reply Last reply Reply Quote 3
      • W
        WW1983 @WW1983 last edited by

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

        BBTown G 2 Replies Last reply Reply Quote 0
        • marcuskl
          marcuskl @WW1983 last edited by

          @WW1983 Danke dir 😊

          1 Reply Last reply Reply Quote 0
          • BBTown
            BBTown @WW1983 last edited by 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 1 Reply Last reply Reply Quote 0
            • X
              xADDRx @WW1983 last edited by

              @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'
              
              
              marcuskl W 2 Replies Last reply Reply Quote 0
              • G
                g.polat @WW1983 last edited by

                @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 Reply Last reply Reply Quote 0
                • G
                  g.polat @Scrounger last edited by

                  @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ß

                  Scrounger 1 Reply Last reply Reply Quote 2
                  • marcuskl
                    marcuskl @xADDRx last edited by

                    @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 marcuskl 2 Replies Last reply Reply Quote 2
                    • W
                      WW1983 @BBTown last edited by

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

                      1 Reply Last reply Reply Quote 0
                      • W
                        WW1983 @g.polat last edited by

                        @g-polat
                        Leider nein

                        1 Reply Last reply Reply Quote 0
                        • W
                          WW1983 @xADDRx last edited by 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

                          marcuskl 1 Reply Last reply Reply Quote 0
                          • marcuskl
                            marcuskl @WW1983 last edited by

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

                            W 1 Reply Last reply Reply Quote 0
                            • W
                              WW1983 @marcuskl last edited by

                              @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 Reply Last reply Reply Quote 0
                              • marcuskl
                                marcuskl last edited by

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

                                W 1 Reply Last reply Reply Quote 0
                                • W
                                  WW1983 @marcuskl last edited by

                                  @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"

                                  marcuskl 1 Reply Last reply Reply Quote 0
                                  • marcuskl
                                    marcuskl @WW1983 last edited by

                                    @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 1 Reply Last reply Reply Quote 0
                                    • W
                                      WW1983 @marcuskl last edited by

                                      @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 Reply Last reply Reply Quote 1
                                      • X
                                        xADDRx @marcuskl last edited by xADDRx

                                        @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
                                        
                                        1 Reply Last reply Reply Quote 0
                                        • S
                                          schittl last edited by

                                          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

                                          1 Reply Last reply Reply Quote 0
                                          • Scrounger
                                            Scrounger Developer @g.polat last edited by Scrounger

                                            @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!

                                            W 1 Reply Last reply Reply Quote 0
                                            • First post
                                              Last post

                                            Support us

                                            ioBroker
                                            Community Adapters
                                            Donate

                                            844
                                            Online

                                            31.9k
                                            Users

                                            80.1k
                                            Topics

                                            1.3m
                                            Posts

                                            call for action lovelace test visualisierung
                                            131
                                            1051
                                            328714
                                            Loading More Posts
                                            • Oldest to Newest
                                            • Newest to Oldest
                                            • Most Votes
                                            Reply
                                            • Reply as topic
                                            Log in to reply
                                            Community
                                            Impressum | Datenschutz-Bestimmungen | Nutzungsbedingungen
                                            The ioBroker Community 2014-2023
                                            logo