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.
    • 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
                                      • W
                                        WW1983 @Scrounger last edited by

                                        @Scrounger

                                        Könnte man den Ordner theoretisch mit Schreibschutz versehen, oder gibt dann ein Problem mit dem Update?

                                        1 Reply Last reply Reply Quote 0
                                        • B
                                          BobBruni @BobBruni last edited by BobBruni

                                          @BobBruni said in Test Adapter lovelace v0.2.x:

                                          Habe aber immer noch das Problem, dass die Bedienung sehr sehr träge ist. Gerade wenn das Display vom Tablet längere Zeit aus gewesen. Energiesparmodus für Fully habe ich deaktiviert. Die Motiton Detection dagegen funktioniert super.

                                          Dieses Problem hat sich zum Glück nach einer kompletten Neuinstallation von ioBroker auf neuer Hardware (RPI4) erledigt.

                                          Allerdings habe ich nun das Problem, dass nach einer gewissen Zeit (ich schätze ca. 24h), die Zustände meiner Objekte nicht mehr aktuell sind. z.B. eine Lampe deren Zustand noch als True angezeigt wird, obwohl in ioBroker auf False.
                                          In diesem Fall hilft nur ein Neustart von Lovlace. Anschließend läuft wieder alles synchron... Für eine gewisse Zeit 😞

                                          Jemand ne Idee?

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

                                            Mein Lovelace Adapter startet seit kurzen immer wieder neu?

                                            lovelace.0	2019-11-01 14:08:04.661	info	(2780) starting. Version 0.2.3 in /opt/iobroker/node_modules/iobroker.lovelace, node: v10.16.3
                                            host.iobroker	2019-11-01 14:08:01.552	info	instance system.adapter.lovelace.0 started with pid 2780
                                            host.iobroker	2019-11-01 14:08:00.537	info	Restart adapter system.adapter.lovelace.0 because enabled
                                            host.iobroker	2019-11-01 14:08:00.536	error	instance system.adapter.lovelace.0 terminated with code 156 (156)
                                            lovelace.0	2019-11-01 14:08:00.516	info	(2752) terminating
                                            lovelace.0	2019-11-01 14:08:00.017	info	(2752) Terminated (START_IMMEDIATELY_AFTER_STOP): Without reason
                                            lovelace.0	2019-11-01 14:08:00.016	info	(2752) terminating
                                            lovelace.0	2019-11-01 14:08:00.008	info	(2752) cleaned everything up...
                                            lovelace.0	2019-11-01 14:08:00.006	info	(2752) Scheduled restart.
                                            lovelace.0	2019-11-01 14:07:05.583	warn	(2752) no max value for light object 'shelly.0.SHRGBW2#5A38A7#1.color' defined -> using fallback max = 100
                                            lovelace.0	2019-11-01 14:07:04.947	info	(2752) http server listening on port 8091
                                            lovelace.0	2019-11-01 14:07:04.805	info	(2752) starting. Version 0.2.3 in /opt/iobroker/node_modules/iobroker.lovelace, node: v10.16.3
                                            host.iobroker	2019-11-01 14:07:01.552	info	instance system.adapter.lovelace.0 started with pid 2752
                                            host.iobroker	2019-11-01 14:07:00.537	info	Restart adapter system.adapter.lovelace.0 because enabled
                                            host.iobroker	2019-11-01 14:07:00.536	error	instance system.adapter.lovelace.0 terminated with code 156 (156)
                                            
                                            1 Reply Last reply Reply Quote 0
                                            • First post
                                              Last post

                                            Support us

                                            ioBroker
                                            Community Adapters
                                            Donate

                                            812
                                            Online

                                            31.7k
                                            Users

                                            79.9k
                                            Topics

                                            1.3m
                                            Posts

                                            call for action lovelace test visualisierung
                                            131
                                            1051
                                            322279
                                            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