🌻 Lovelace UI • Minimalist

[Maxcodesthings]

The colors are in the custom component’s directory.
custom_components/ui_lovelace_minimalist/ulm_templates/card_templates/colors

I actually make my own using the documentation on custom button card and place them in there too. The templating is the same engine that custom button card uses, in fact this ui uses mostly just a ton of fancy button cards

EDIT:
Took me forever to figure this out since the docs dont tell you, but the correct place for custom colors templates is: config/ui_lovelace_minimalist/custom_cards/card_templates/colors and cards is config/ui_lovelace_minimalist/card_templates/. Then when u restart HA it will copy to custom_components directory. I usually edit the file in the custom_components directory and when im done copy it to ui_lovelace_minimalist because of having to restart all the time otherwise

I know u didnt ask all this, but you or someone else might find this useful searching. Hope it helps

[Maxcodesthings]

You will have to make your own template for the side icon. I have the same on my HVAC its off, head, heat_cool, and cool for the state. The actual state i wanted was attirbute hvac_action on the entity so i pointed the style like icon or color to react to that instead

climate:
  state:
    - operator: template
      value: |
        [[[
          return (entity.state != "off" && entity.attributes.hvac_action == "cooling")
        ]]]
      icon: mdi:thermometer-chevron-down
      styles:
        icon:
          - color: rgba(var(--color-blue),1)
        img_cell:
          - background-color: rgba(var(--color-blue),0.2)
        card:
          - background-color: rgba(var(--color-background-blue), var(--opacity-bg))
        label:
          - color: rgba(var(--color-blue-text),1)
        name:
          - color: rgba(var(--color-blue-text),1)
    - operator: template
      value: |
        [[[
          return (entity.state != "off" && entity.attributes.hvac_action == "heating")
        ]]]
      icon: mdi:thermometer-chevron-up
      styles:
        icon:
          - color: "rgba(var(--color-red),1)"
        label:
          - color: "rgba(var(--color-red-text),1)"
        name:
          - color: "rgba(var(--color-red-text),1)"
        img_cell:
          - background-color: "rgba(var(--color-red), 0.2)"
    - operator: template
      value: |
        [[[
          return entity.state == "off"
        ]]]
      icon: mdi:thermometer-off
    - operator: default
      icon: mdi:thermometer

Hope this helps

[Maxcodesthings]

I mean, here you see the actual card lights up, but not the little icon

The side icon lights up by using templates. There are three right there you will need a color template to changes its color for state on and state off, something like red_on or blue_no_state. Entities might have other states and if u want the color to react to that you will need to make a custom template

[spamsal]

I have it literally set up as you have described as you can see in the snippet I provided in my previous comment.

This section, for example is how I’ve set up one of the entities with a custom template for playing/paused/unavailable:

entity_1:
  entity_id: media_player.sonos_kitchen
  template:
    - custom_cards_media_playing
    - custom_cards_media_paused
    - custom_cards_media_unavailable

I know they work because I’ve tested them with the entire room card, but the icons simply refuse to play ball for whatever reason. I’m not sure if there’s another step I’m missing, but according to the documentation, I don’t think I have. They don’t even work with the state colours that come with the theme when used it with an entity with on/off states. I’m a bit out of ideas.

[Maxcodesthings]

I think you might not have understood my reply. The template field on the sub entity needs a color template assigned.

Example:

entity_1:
  entity_id: media_player.sonos_kitchen
  template:
    - custom_cards_media_playing
    - custom_cards_media_paused
    - custom_cards_media_unavailable
    - red_no_state
    - blue_off

I see a grey_no_state on the main card entity, but no color template on the sub entities (entity_1)
custom_cards_media_playing and the others, sound like a custom card and doesnt apply a color, but i could be wrong i dont have the yaml.

The default color templates will only work if the entity’s state is on or off. Some entities have other strings for their state and since u are using a media player, you will have to make your own color template for these. I showed an example of this for a climate entity a few replies up where i use an attribute of the thermostat to control its color and icon.

[dacorn (Dave Acorn)]

Yes this is perfect thank you I will follow your instructions.

[fahr (Aaron)]

I’ve modified the room card to show data from the plaato keg management integration.

More details:

• The 1st (top right) sensor will be filled with color to match the percent left in the keg.
• The 2nd sensor showing gallons of beer left will also be filled with color to match the percent left in the keg.
• The 3rd icon is for the binary leak detection sensor. It will turn red and change the icon if it detects a leak.

I apologize for a ton of repeated yaml for each scale, haven’t spent any time looking into making it a configurable custom card. Hopefully it inspires someone else.

cards:
  - type: 'custom:button-card'
    template:
      - card_room
      - grey_no_state
    name: >
      [[[
        return entity.attributes.beer_name
      ]]]
    label: >
      [[[
        var current = Date.now();
        var previous = Date.parse(entity.attributes.keg_date);
        var msPerMinute = 60 * 1000;
        var msPerHour = msPerMinute * 60;
        var msPerDay = msPerHour * 24;
        var msPerMonth = msPerDay * 30;
        var msPerYear = msPerDay * 365;

        var elapsed = current - previous;
        var relativeTime = '';

        if (elapsed < msPerMinute) {
             relativeTime = Math.round(elapsed/1000) + ' seconds';
        }

        else if (elapsed < msPerHour) {
             relativeTime = Math.round(elapsed/msPerMinute) + ' minutes';
        }

        else if (elapsed < msPerDay ) {
             relativeTime = Math.round(elapsed/msPerHour ) + ' hours';
        }

        else if (elapsed < msPerMonth) {
            relativeTime = Math.round(elapsed/msPerDay) + ' days';
        }

        else if (elapsed < msPerYear) {
            relativeTime = Math.round(elapsed/msPerMonth) + ' months';
        }

        else {
            relativeTime = Math.round(elapsed/msPerYear ) + ' years';
        }

        return "Connected on " + new Date(previous).toDateString() + "<br />Serving gas for " + relativeTime
      ]]]
    icon: mdi:molecule-co2
    entity: sensor.plaato_keg_co2_tank_percent_beer_left
    styles:
      label:
        - font-size: 18px
        - text-align: left
      name:
        - font-size: 30px
      custom_fields:
        i1:
          - border-radius: "10%"
          - width: "80%"
          - height: "80%"
          - line-height: 0
    variables:
      entity_1:
        color: yellow
        entity_id: sensor.plaato_keg_co2_tank_percent_beer_left
        tap_action:
          action: more-info
      entity_2:
        color: yellow
        entity_id: sensor.plaato_keg_co2_tank_beer_left
        tap_action:
          action: more-info
    custom_fields:
      i1:
        card:
          type: "custom:button-card"
          show_icon: false
          show_name: true
          entity: >
            [[[
              if (variables.entity_1.entity_id) {
                return variables.entity_1.entity_id;
              }
            ]]]
          state:
             - name: >
                [[[
                  return states[variables.entity_1.entity_id].state + "% <br />remaining"
                ]]]
               operator: default
          styles:
            card:
              - background: >
                  [[[
                    return "linear-gradient(to top, rgba(var(--color-" + variables.entity_1.color + "),0.6) " +  entity.state + "%, rgba(45, 45, 45, 0.9) " + entity.state + "%)"
                  ]]]
            name:
              - font-weight: bold
              - grid-area: initial
              - color: white
      i2:
        card:
          type: "custom:button-card"
          show_icon: false
          show_name: true
          entity: >
            [[[
              if (variables.entity_2.entity_id) {
                return variables.entity_2.entity_id;
              }
            ]]]
          state:
             - name: >
                [[[
                  return states[variables.entity_2.entity_id].state + " " + states[variables.entity_2.entity_id].attributes.unit_of_measurement + " <br />remaining"
                ]]]
               operator: default
          styles:
            card:
              - background: >
                  [[[
                    return "linear-gradient(to top, rgba(var(--color-" + variables.entity_2.color + "),0.6) " +  entity.state + "%, rgba(45, 45, 45, 0.9) " + entity.state + "%)"
                  ]]]
            name:
              - font-weight: bold
              - grid-area: initial
              - color: white

  - type: 'custom:button-card'
    template:
      - card_room
      - blue_no_state
    name: >
      [[[
        return entity.attributes.beer_name
      ]]]
    label: >
      [[[
        var current = Date.now();
        var previous = Date.parse(entity.attributes.keg_date);
        var msPerMinute = 60 * 1000;
        var msPerHour = msPerMinute * 60;
        var msPerDay = msPerHour * 24;
        var msPerMonth = msPerDay * 30;
        var msPerYear = msPerDay * 365;

        var elapsed = current - previous;
        var relativeTime = '';

        if (elapsed < msPerMinute) {
             relativeTime = Math.round(elapsed/1000) + ' seconds';
        }

        else if (elapsed < msPerHour) {
             relativeTime = Math.round(elapsed/msPerMinute) + ' minutes';
        }

        else if (elapsed < msPerDay ) {
             relativeTime = Math.round(elapsed/msPerHour ) + ' hours';
        }

        else if (elapsed < msPerMonth) {
            relativeTime = Math.round(elapsed/msPerDay) + ' days';
        }

        else if (elapsed < msPerYear) {
            relativeTime = Math.round(elapsed/msPerMonth) + ' months';
        }

        else {
            relativeTime = Math.round(elapsed/msPerYear ) + ' years';
        }

        return "Kegged on " + new Date(previous).toDateString() + "<br />On tap for " + relativeTime
      ]]]
    icon: mdi:water
    entity: sensor.plaato_keg_water_keg_percent_beer_left
    styles:
      label:
        - font-size: 18px
        - text-align: left
      name:
        - font-size: 30px
      custom_fields:
        i1:
          - border-radius: "10%"
          - width: "80%"
          - height: "80%"
          - line-height: 0
    variables:
      entity_1:
        color: blue
        entity_id: sensor.plaato_keg_water_keg_percent_beer_left
        tap_action:
          action: more-info
      entity_2:
        color: blue
        entity_id: sensor.plaato_keg_water_keg_beer_left
        tap_action:
          action: more-info
      entity_3:
        color: green
        entity_id: binary_sensor.plaato_keg_water_keg_leaking
        templates:
          - red_on
          - green_off
        tap_action:
          action: more-info
      entity_4:
        color: green
        entity_id: sensor.plaato_keg_water_keg_last_pour_amount
        templates:
          - red_on
          - green_off
        tap_action:
          action: more-info
    custom_fields:
      i1:
        card:
          type: "custom:button-card"
          show_icon: false
          show_name: true
          entity: >
            [[[
              if (variables.entity_1.entity_id) {
                return variables.entity_1.entity_id;
              }
            ]]]
          state:
             - name: >
                [[[
                  return states[variables.entity_1.entity_id].state + "% <br />remaining"
                ]]]
               operator: default
          styles:
            card:
              - background: >
                  [[[
                    return "linear-gradient(to top, rgba(var(--color-" + variables.entity_1.color + "),0.6) " +  entity.state + "%, rgba(45, 45, 45, 0.9) " + entity.state + "%)"
                  ]]]
            name:
              - font-weight: bold
              - grid-area: initial
              - color: white
      i2:
        card:
          type: "custom:button-card"
          show_icon: false
          show_name: true
          entity: >
            [[[
              if (variables.entity_2.entity_id) {
                return variables.entity_2.entity_id;
              }
            ]]]
          state:
             - name: >
                [[[
                  return states[variables.entity_2.entity_id].state + " " + states[variables.entity_2.entity_id].attributes.unit_of_measurement + " <br />remaining"
                ]]]
               operator: default
          styles:
            card:
              - background: >
                  [[[
                    return "linear-gradient(to top, rgba(var(--color-" + variables.entity_2.color + "),0.6) " +  entity.state + "%, rgba(45, 45, 45, 0.9) " + entity.state + "%)"
                  ]]]
            name:
              - font-weight: bold
              - grid-area: initial
              - color: white
      i3:
        card:
          icon: >
            [[[
              if (states[variables.entity_3.entity_id].state === "on") {
                return "mdi:water-alert"
              }
              return "mdi:water-check"
            ]]]
      i4:
        card:
          type: "custom:button-card"
          show_icon: false
          show_name: true
          entity: >
            [[[
              if (variables.entity_4.entity_id) {
                return variables.entity_4.entity_id;
              }
            ]]]
          state:
             - name: >
                [[[
                  return "Last pour:<br />" + states[variables.entity_4.entity_id].state + " " + states[variables.entity_4.entity_id].attributes.unit_of_measurement
                ]]]
               operator: default
          styles:
            card:
              - background: >
                  [[[
                    return "var(--color-" + variables.entity_4.color + ")"
                  ]]]
            name:
              - font-weight: bold
              - grid-area: initial
              - color: var(--color-primary-text)

  - type: 'custom:button-card'
    template:
      - card_room
      - yellow_no_state
    name: >
      [[[
        return entity.attributes.beer_name
      ]]]
    label: >
      [[[
        var current = Date.now();
        var previous = Date.parse(entity.attributes.keg_date);
        var msPerMinute = 60 * 1000;
        var msPerHour = msPerMinute * 60;
        var msPerDay = msPerHour * 24;
        var msPerMonth = msPerDay * 30;
        var msPerYear = msPerDay * 365;

        var elapsed = current - previous;
        var relativeTime = '';

        if (elapsed < msPerMinute) {
             relativeTime = Math.round(elapsed/1000) + ' seconds';
        }

        else if (elapsed < msPerHour) {
             relativeTime = Math.round(elapsed/msPerMinute) + ' minutes';
        }

        else if (elapsed < msPerDay ) {
             relativeTime = Math.round(elapsed/msPerHour ) + ' hours';
        }

        else if (elapsed < msPerMonth) {
            relativeTime = Math.round(elapsed/msPerDay) + ' days';
        }

        else if (elapsed < msPerYear) {
            relativeTime = Math.round(elapsed/msPerMonth) + ' months';
        }

        else {
            relativeTime = Math.round(elapsed/msPerYear ) + ' years';
        }

        return "Kegged on " + new Date(previous).toDateString() + "<br />On tap for " + relativeTime
      ]]]
    icon: mdi:beer
    entity: sensor.plaato_keg_keg_2_percent_beer_left
    styles:
      label:
        - font-size: 18px
        - text-align: left
      name:
        - font-size: 30px
      custom_fields:
        i1:
          - border-radius: "10%"
          - width: "80%"
          - height: "80%"
          - line-height: 0
    variables:
      entity_1:
        color: yellow
        entity_id: sensor.plaato_keg_keg_2_percent_beer_left
        tap_action:
          action: more-info
      entity_2:
        color: yellow
        entity_id: sensor.plaato_keg_keg_2_beer_left
        tap_action:
          action: more-info
      entity_3:
        color: green
        entity_id: binary_sensor.plaato_keg_keg_2_leaking
        templates:
          - red_on
          - green_off
        tap_action:
          action: more-info
      entity_4:
        color: green
        entity_id: sensor.plaato_keg_keg_2_last_pour_amount
        tap_action:
          action: more-info
    custom_fields:
      i1:
        card:
          type: "custom:button-card"
          show_icon: false
          show_name: true
          entity: >
            [[[
              if (variables.entity_1.entity_id) {
                return variables.entity_1.entity_id;
              }
            ]]]
          state:
             - name: >
                [[[
                  return states[variables.entity_1.entity_id].state + "% <br />remaining"
                ]]]
               operator: default
          styles:
            card:
              - background: >
                  [[[
                    return "linear-gradient(to top, rgba(var(--color-" + variables.entity_1.color + "),0.6) " +  entity.state + "%, rgba(45, 45, 45, 0.9) " + entity.state + "%)"
                  ]]]
            name:
              - font-weight: bold
              - grid-area: initial
              - color: white
      i2:
        card:
          type: "custom:button-card"
          show_icon: false
          show_name: true
          entity: >
            [[[
              if (variables.entity_2.entity_id) {
                return variables.entity_2.entity_id;
              }
            ]]]
          state:
             - name: >
                [[[
                  return states[variables.entity_2.entity_id].state + " " + states[variables.entity_2.entity_id].attributes.unit_of_measurement + " <br />remaining"
                ]]]
               operator: default
          styles:
            card:
              - background: >
                  [[[
                    return "linear-gradient(to top, rgba(var(--color-" + variables.entity_2.color + "),0.6) " +  entity.state + "%, rgba(45, 45, 45, 0.9) " + entity.state + "%)"
                  ]]]
            name:
              - font-weight: bold
              - grid-area: initial
              - color: white
      i3:
        card:
          icon: >
            [[[
              if (states[variables.entity_3.entity_id].state === "on") {
                return "mdi:water-alert"
              }
              return "mdi:water-check"
            ]]]
      i4:
        card:
          type: "custom:button-card"
          show_icon: false
          show_name: true
          entity: >
            [[[
              if (variables.entity_4.entity_id) {
                return variables.entity_4.entity_id;
              }
            ]]]
          state:
             - name: >
                [[[
                  return "Last pour:<br />" + states[variables.entity_4.entity_id].state + " " + states[variables.entity_4.entity_id].attributes.unit_of_measurement
                ]]]
               operator: default
          styles:
            card:
              - background: >
                  [[[
                    return "var(--color-" + variables.entity_4.color + ")"
                  ]]]
            name:
              - font-weight: bold
              - grid-area: initial
              - color: var(--color-primary-text)

  - type: 'custom:button-card'
    template:
      - card_room
      - yellow_no_state
    name: >
      [[[
        return entity.attributes.beer_name
      ]]]
    label: >
      [[[
        var current = Date.now();
        var previous = Date.parse(entity.attributes.keg_date);
        var msPerMinute = 60 * 1000;
        var msPerHour = msPerMinute * 60;
        var msPerDay = msPerHour * 24;
        var msPerMonth = msPerDay * 30;
        var msPerYear = msPerDay * 365;

        var elapsed = current - previous;
        var relativeTime = '';

        if (elapsed < msPerMinute) {
             relativeTime = Math.round(elapsed/1000) + ' seconds';
        }

        else if (elapsed < msPerHour) {
             relativeTime = Math.round(elapsed/msPerMinute) + ' minutes';
        }

        else if (elapsed < msPerDay ) {
             relativeTime = Math.round(elapsed/msPerHour ) + ' hours';
        }

        else if (elapsed < msPerMonth) {
            relativeTime = Math.round(elapsed/msPerDay) + ' days';
        }

        else if (elapsed < msPerYear) {
            relativeTime = Math.round(elapsed/msPerMonth) + ' months';
        }

        else {
            relativeTime = Math.round(elapsed/msPerYear ) + ' years';
        }

        return "Kegged on " + new Date(previous).toDateString() + "<br />On tap for " + relativeTime
      ]]]
    icon: mdi:beer
    entity: sensor.plaato_keg_keg_3_percent_beer_left
    styles:
      label:
        - font-size: 18px
        - text-align: left
      name:
        - font-size: 30px
      custom_fields:
        i1:
          - border-radius: "10%"
          - width: "80%"
          - height: "80%"
          - line-height: 0
    variables:
      entity_1:
        color: yellow
        entity_id: sensor.plaato_keg_keg_3_percent_beer_left
        tap_action:
          action: more-info
      entity_2:
        color: yellow
        entity_id: sensor.plaato_keg_keg_3_beer_left
        tap_action:
          action: more-info
      entity_3:
        color: green
        entity_id: binary_sensor.plaato_keg_keg_3_leaking
        templates:
          - red_on
          - green_off
        tap_action:
          action: more-info
      entity_4:
        color: green
        entity_id: sensor.plaato_keg_keg_3_last_pour_amount
        tap_action:
          action: more-info
    custom_fields:
      i1:
        card:
          type: "custom:button-card"
          show_icon: false
          show_name: true
          entity: >
            [[[
              if (variables.entity_1.entity_id) {
                return variables.entity_1.entity_id;
              }
            ]]]
          state:
             - name: >
                [[[
                  return states[variables.entity_1.entity_id].state + "% <br />remaining"
                ]]]
               operator: default
          styles:
            card:
              - background: >
                  [[[
                    return "linear-gradient(to top, rgba(var(--color-" + variables.entity_1.color + "),0.6) " +  entity.state + "%, rgba(45, 45, 45, 0.9) " + entity.state + "%)"
                  ]]]
            name:
              - font-weight: bold
              - grid-area: initial
              - color: white
      i2:
        card:
          type: "custom:button-card"
          show_icon: false
          show_name: true
          entity: >
            [[[
              if (variables.entity_2.entity_id) {
                return variables.entity_2.entity_id;
              }
            ]]]
          state:
             - name: >
                [[[
                  return states[variables.entity_2.entity_id].state + " " + states[variables.entity_2.entity_id].attributes.unit_of_measurement + " <br />remaining"
                ]]]
               operator: default
          styles:
            card:
              - background: >
                  [[[
                    return "linear-gradient(to top, rgba(var(--color-" + variables.entity_2.color + "),0.6) " +  entity.state + "%, rgba(45, 45, 45, 0.9) " + entity.state + "%)"
                  ]]]
            name:
              - font-weight: bold
              - grid-area: initial
              - color: white
      i3:
        card:
          icon: >
            [[[
              if (states[variables.entity_3.entity_id].state === "on") {
                return "mdi:water-alert"
              }
              return "mdi:water-check"
            ]]]
      i4:
        card:
          type: "custom:button-card"
          show_icon: false
          show_name: true
          entity: >
            [[[
              if (variables.entity_4.entity_id) {
                return variables.entity_4.entity_id;
              }
            ]]]
          state:
             - name: >
                [[[
                  return "Last pour:<br />" + states[variables.entity_4.entity_id].state + " " + states[variables.entity_4.entity_id].attributes.unit_of_measurement
                ]]]
               operator: default
          styles:
            card:
              - background: >
                  [[[
                    return "var(--color-" + variables.entity_4.color + ")"
                  ]]]
            name:
              - font-weight: bold
              - grid-area: initial
              - color: var(--color-primary-text)

[spamsal]

I think that I’ve confused you with my naming convention . When I created those templates, I had just gotten started with the theme and I was under the impression that any custom template needed to be named “custom_cards_[whatever you want]” regardless of whether it was an actual template or a colour template. Sorry for the confusion.

custom_cards_media_playing is just a modified version of green_on that comes with the theme. It’s essentially what you’re talking about.

Just to clarify; Here’s another example where I don’t use any custom colour templates, but I still have no luck with it working:

entity_1:
  entity_id: light.bedroom_lamp
  template:
    - yellow_on
    - grey_off
    - red_no_state
  tap_action:
    action: toggle

[sjofel]

Have you solved this issue?

[thebradleysanders (Brad Sanders)]

How are you displaying the Spotify playlist cards? That’s pretty cool.

[bdubsw (Bryce)]

@thebradleysanders i use the Spotify Sonos card.

GitHub - ChrisK91/sonos-playlist-card

I modified it a bit with css

[benm7 (Ben M)]

This might be a dumb question! When I update Minimalist it doesn’t seem to update my custom_cards folder. Am I doing something wrong when updating? I also have my own cards in this folder in a separate folder, could this be causing the issue?

Or am I using the wrong folder altogether? This is the folder I am looking at:

config → ui_lovelace_minimalist → custom_cards

[basbrus (Bas)]

Custom cards are not part of the HACS install and should be updated/downloaded manually. They can also receive bugfixes/updates before a new release goes live.
This is done to prevent an update overrides all your personal custom cards/alterations

[Yeyo53 (Sergio)]

So which is the way-to-go to add this?
Just download the folder and copy-paste it in hassio?

[basbrus (Bas)]

Just download the custom_cards you want or want to update. Place them in the ui_lovelace_minimalist/custom_cards folder. Reload the integration and dashboard.
It is also described on our wiki Configuration - UI Lovelace Minimalist

[Yeyo53 (Sergio)]

At first, thank you for your help, but I have read that documentation a few times, I have read this thread and still is not working so I’m probably missing something.

1. I install the theme using HACS
2. I install all the lovelace resourcer using HACS (button-card…)
3. I put this into the configuration.yaml

    browser_mod:

    frontend:
          themes: !include_dir_merge_named themes

4. I reboot Hassio
5. Add an UI-Minimalist integration with English, Enable the creation of side panel, theme minimalist-desktop, ‘‘themes/’’, enable include custom cards
6. I copy all the custom_cards into config/ui_lovelace_minimalist/custom_cards
7. Reboot

Still gettin the message: Custom element doesn’t exist: button_card
I have specifically added:

resources:
  - url: /hacsfiles/button-card/button-card.js
    type: module

to my config/ui_lovelace_minimalist/dashboard/ui-lovelace.yaml with no luck

[Maxcodesthings]

Strangely, i have had some colors for on not working lately on some of my cards as well but works on others… I dont really have a answer.

One thing i might try is making one card with all states and their colors. Maybe the styles are overriding eachother somehow

[crampes2]

Thank you for the answer but coul you please explain more for a newbie
If I want to add a color, what is the right process to do ?

[majorhector]

I’ve found an error in the card_thermostat. I don’t know if it was reported before…
In line 784 I found this:

service: "climate.set_hvac_mode]"

instead:

service: "climate.set_hvac_mode"

under fan_only. That square braket prevent me from invoking hvac mode in a climate entity

[Andras]

I hope you guys can help me. I started to build my own dashboard with this beautiful theme. Basically everything is working, except 3 things:

• I use the custom person card, and the popup is not working if I switch to mobile data (when I’m on Wi-Fi, everything is ok)
• map is not loaded when I frst open the popup, after closing and reopening, it is there (I have 2 person cards, no matter which one I open first, it won’t show the map, opening the first one for the second time or the second for the first time will be always fine)
• I couldn’t find the find my phone script (I have Android devices, if this matters)
  Can you point me in the right direction? Thanks and congratulations to all the contributors.