🌻 Lovelace UI • Minimalist

Abeksis · January 1, 2022, 4:18pm

I copied the code. It should be noted that I already have a robot-vacuum connected to the smart home - in another code. I’m just trying the minimalist.

I constantly get an error … and do not clear to me why.

Here’s the error:

Screen Shot 2022-01-01 at 18.15.51

And this information on the Vacuum:

the code:

    vacuum_info:
    tap_action:
      action: none
    icon: mdi:robot-vacuum
    label: |-
      [[[ 
        if (entity.state.toUpperCase() == 'DOCKED' && entity.attributes.battery_level == '100'){
            return 'On its base';
        }
        else if (entity.attributes.status.toUpperCase() == 'CHARGING'){
            return 'In charge';
        }
        else if (entity.state.toUpperCase() == 'CLEANING'){
            return 'Cleaning in progress';
        }
        else if (entity.attributes.status.toUpperCase() == 'RETURNING HOME'){
            return 'Back to its base';
        }
        else if (entity.attributes.status.toUpperCase() == 'PAUSED'){
            return 'On break';
        }
        else{
          return '❓ Unknown ❓' ;
        }
      ]]]
    styles:
      icon:
        - color: |-
            [[[ 
              if (entity.state.toUpperCase() == 'DOCKED' && entity.attributes.battery_level == '100'){
                  return 'rgba(var(--couleur-gris),1)';
              }
              else if (entity.attributes.status.toUpperCase() == 'CHARGING'){
                  return  'rgba(var(--couleur-vert),1)';
              }
              else if (entity.state.toUpperCase() == 'CLEANING'){
                  return  'rgba(var(--couleur-jaune),1)';
              }
              else if (entity.attributes.status.toUpperCase() == 'RETURNING HOME'){
                  return  'rgba(var(--couleur-violet),1)';
              }
              else if (entity.attributes.status.toUpperCase() == 'PAUSED'){
                  return  'rgba(var(--couleur-bleu),1)';
              }
              else{
                  return 'rgba(var(--couleur-gris),1)';
              }
            ]]]
      img_cell:
        - background-color: |-
            [[[ 
              if (entity.state.toUpperCase() == 'DOCKED' && entity.attributes.battery_level == '100'){
                  return 'rgba(var(--couleur-gris),0.2)';
              }
              else if (entity.attributes.status.toUpperCase() == 'CHARGING'){
                  return  'rgba(var(--couleur-vert),0.2)';
              }
              else if (entity.state.toUpperCase() == 'CLEANING'){
                  return  'rgba(var(--couleur-jaune),0.2)';
              }
              else if (entity.attributes.status.toUpperCase() == 'RETURNING HOME'){
                  return  'rgba(var(--couleur-violet),0.2)';
              }
              else if (entity.attributes.status.toUpperCase() == 'PAUSED'){
                  return  'rgba(var(--couleur-bleu),0.2)';
              }
              else{
                  return 'rgba(var(--couleur-gris),0.2)';
              }
            ]]]

pedolsky · January 1, 2022, 4:27pm

Seems that you have not defined the entity.

Abeksis · January 1, 2022, 4:38pm

I also think so, just I do not know what I’m supposed to do, you can give an example.

thanks

pedolsky · January 1, 2022, 4:48pm

How did you define your custom:button-card? Could you please post its code?

http_edo13 · January 1, 2022, 4:59pm

I see that the temperatures are there, so it’s a problem with the icon templates. Both normal and collapse cards work in my home assistant, so I can’t understand why this happens in your configuration

Abeksis · January 1, 2022, 5:12pm

I tried two codes:
a:

          - type: custom:button-card
            template: vacuum
            variables:
              entity: vacuum.vacuum
              name: vacuum abeksis

b:

           - type: custom:stack-in-card
             mode: vertical
             style: |
               ha-card{
                 border-radius: 21px;
               }
             cards:
               - type: custom:button-card
                 template: vacuum
                 variables:
                   entity:  vacuum.vacuum
                   name: Aspiro
               - type: custom:button-card
                 template: card_1_line_4_actions_select_vacuum_fan_speed
                 triggers_update:
                   - sensor.aspiro_fan
                 variables:
                   item1_background_entity: sensor.aspiro_fan
                   item1_background_state: GENTLE
                   item1_icon: mdi:water
                   item2_background_entity: sensor.aspiro_fan
                   item2_background_state: SILENT
                   item2_icon: mdi:fan
                   item2_icon_scale: 0.75
                   item3_background_entity: sensor.aspiro_fan
                   item3_background_state: STANDARD
                   item3_icon: mdi:fan
                   item3_icon_scale: 1.3
                   item4_background_entity: sensor.aspiro_fan
                   item4_background_state: TURBO
                   item4_icon: mdi:fan
                   item4_icon_scale: 2

pedolsky · January 1, 2022, 6:54pm

Your entity vacuum.vacuum has no states in capital letters. Try it with


label: |-
      [[[ 
        if (entity.state == 'docked' && entity.attributes.battery_level == '100'){
            return 'On its base';
        }

Is vacuum_info: correctly indented?

flave · January 2, 2022, 1:36am

wow, thats awesome. Will have a detailled look at it! Thank you very much for all your configs!

Abeksis · January 2, 2022, 3:59am

Thanks for the help,

I changed according to what you said - and unfortunately I still get an error.

code:

    vacuum_info:
    tap_action:
      action: none
    icon: mdi:robot-vacuum
    label: |-
      [[[ 
        if (entity.state.toUpperCase() == 'docked' && entity.attributes.battery_level == '100'){
            return 'On its base';
        }
        else if (entity.attributes.status.toUpperCase() == 'charging'){
            return 'In charge';
        }
        else if (entity.state.toUpperCase() == 'cleaning'){
            return 'Cleaning in progress';
        }
        else if (entity.attributes.status.toUpperCase() == 'retuning home'){
            return 'Back to its base';
        }
        else if (entity.attributes.status.toUpperCase() == 'pause'){
            return 'On break';
        }
        else{
          return '❓ Unknown ❓' ;
        }
      ]]]
    styles:
      icon:
        - color: |-
            [[[ 
              if (entity.state.toUpperCase() == 'docked' && entity.attributes.battery_level == '100'){
                  return 'rgba(var(--couleur-gris),1)';
              }
              else if (entity.attributes.status.toUpperCase() == 'charging'){
                  return  'rgba(var(--couleur-vert),1)';
              }
              else if (entity.state.toUpperCase() == 'cleaning'){
                  return  'rgba(var(--couleur-jaune),1)';
              }
              else if (entity.attributes.status.toUpperCase() == 'retuning home'){
                  return  'rgba(var(--couleur-violet),1)';
              }
              else if (entity.attributes.status.toUpperCase() == 'pause'){
                  return  'rgba(var(--couleur-bleu),1)';
              }
              else{
                  return 'rgba(var(--couleur-gris),1)';
              }
            ]]]
      img_cell:
        - background-color: |-
            [[[ 
              if (entity.state.toUpperCase() == 'docked' && entity.attributes.battery_level == '100'){
                  return 'rgba(var(--couleur-gris),0.2)';
              }
              else if (entity.attributes.status.toUpperCase() == 'charging'){
                  return  'rgba(var(--couleur-vert),0.2)';
              }
              else if (entity.state.toUpperCase() == 'cleaning'){
                  return  'rgba(var(--couleur-jaune),0.2)';
              }
              else if (entity.attributes.status.toUpperCase() == 'retuning home'){
                  return  'rgba(var(--couleur-violet),0.2)';
              }
              else if (entity.attributes.status.toUpperCase() == 'pause'){
                  return  'rgba(var(--couleur-bleu),0.2)';
              }
              else{
                  return 'rgba(var(--couleur-gris),0.2)';
              }
            ]]]

manuel_R · January 2, 2022, 7:58am

hello can you tell me if there is a model for the card in the picture? thank you

Abeksis · January 2, 2022, 8:39am

in the file button_card_templates.yaml
Look for:

### VERTICAL BUTTONS (fka SCENES) ###

pedolsky · January 2, 2022, 9:56am

Please compare what I suggested with your code.

Abeksis · January 2, 2022, 10:00am

Sorry, I did not see this part. I’m just working on it now and updates

max5962 · January 2, 2022, 10:22am

nice !

the theme seems be to very popular. All custom card should be post on github in order to have an “database”

Abeksis · January 2, 2022, 10:26am

I tried like this:

    vacuum_info:
    tap_action:
      action: none
    icon: mdi:robot-vacuum
    label: |-
      [[[ 
        if (entity.state == 'docked' && entity.attributes.battery_level == '100'){
            return 'on its base';
        }
        else if (entity.state == 'charging'){
            return 'in charge';
        }
        else if (entity.state == 'cleaning'){
            return 'cleaning in progress';
        }
        else if (entity.state == 'docked' && 'retuning home'){
            return 'back to its base';
        }
        else if (entity.state == 'pause'){
            return 'on break';
        }
        else{
          return '❓ unknown ❓' ;
        }
      ]]]
    styles:
      icon:
        - color: |-
            [[[ 
              if (entity.state == 'docked' && entity.attributes.battery_level == '100'){
                  return 'rgba(var(--couleur-gris),1)';
              }
              else if (entity.state == 'charging'){
                  return  'rgba(var(--couleur-vert),1)';
              }
              else if (entity.state == 'cleaning'){
                  return  'rgba(var(--couleur-jaune),1)';
              }
              else if (entity.state == 'retuning home'){
                  return  'rgba(var(--couleur-violet),1)';
              }
              else if (entity.state == 'pause'){
                  return  'rgba(var(--couleur-bleu),1)';
              }
              else{
                  return 'rgba(var(--couleur-gris),1)';
              }
            ]]]
      img_cell:
        - background-color: |-
            [[[ 
              if (entity.state == 'docked' && entity.attributes.battery_level == '100'){
                  return 'rgba(var(--couleur-gris),0.2)';
              }
              else if (entity.state == 'charging'){
                  return  'rgba(var(--couleur-vert),0.2)';
              }
              else if (entity.state == 'cleaning'){
                  return  'rgba(var(--couleur-jaune),0.2)';
              }
              else if (entity.state == 'retuning home'){
                  return  'rgba(var(--couleur-violet),0.2)';
              }
              else if (entity.state == 'pause'){
                  return  'rgba(var(--couleur-bleu),0.2)';
              }
              else{
                  return 'rgba(var(--couleur-gris),0.2)';
              }
            ]]]

And so: Unfortunately it does not work.

    vacuum_info:
    tap_action:
      action: none
    icon: mdi:robot-vacuum
    label: |-
      [[[ 
        if (entity.state == 'docked' && entity.attributes.battery_level == '100'){
            return 'on its base';
        }
        else if (entity.attributes.status.toUpperCase() == 'charging'){
            return 'in charge';
        }
        else if (entity.state.toUpperCase() == 'cleaning'){
            return 'cleaning in progress';
        }
        else if (entity.state == 'docked' && 'retuning home'){
            return 'back to its base';
        }
        else if (entity.attributes.status.toUpperCase() == 'pause'){
            return 'on break';
        }
        else{
          return '❓ unknown ❓' ;
        }
      ]]]
    styles:
      icon:
        - color: |-
            [[[ 
              if (entity.state == 'docked' && entity.attributes.battery_level == '100'){
                  return 'rgba(var(--couleur-gris),1)';
              }
              else if (entity.attributes.status.toUpperCase() == 'charging'){
                  return  'rgba(var(--couleur-vert),1)';
              }
              else if (entity.state.toUpperCase() == 'cleaning'){
                  return  'rgba(var(--couleur-jaune),1)';
              }
              else if (entity.attributes.status.toUpperCase() == 'retuning home'){
                  return  'rgba(var(--couleur-violet),1)';
              }
              else if (entity.attributes.status.toUpperCase() == 'pause'){
                  return  'rgba(var(--couleur-bleu),1)';
              }
              else{
                  return 'rgba(var(--couleur-gris),1)';
              }
            ]]]
      img_cell:
        - background-color: |-
            [[[ 
              if (entity.state == 'docked' && entity.attributes.battery_level == '100'){
                  return 'rgba(var(--couleur-gris),0.2)';
              }
              else if (entity.attributes.status.toUpperCase() == 'charging'){
                  return  'rgba(var(--couleur-vert),0.2)';
              }
              else if (entity.state.toUpperCase() == 'cleaning'){
                  return  'rgba(var(--couleur-jaune),0.2)';
              }
              else if (entity.attributes.status.toUpperCase() == 'retuning home'){
                  return  'rgba(var(--couleur-violet),0.2)';
              }
              else if (entity.attributes.status.toUpperCase() == 'pause'){
                  return  'rgba(var(--couleur-bleu),0.2)';
              }
              else{
                  return 'rgba(var(--couleur-gris),0.2)';
              }
            ]]]

pedolsky · January 2, 2022, 10:30am

You are using a template called „vacuum“ in your button-card. But in your template I can see „vacuum_info“ (which is not indented properly I think).

CM000n · January 2, 2022, 12:47pm

v1.0.0-beta.11

Hi guys, we hope all of you have had a good start to the new year.
Over the holidays it was also a bit quieter for us, which is why we have a pre-release with bug fixes and new translations for you at the beginning of the year.

But also a few new cards from @mp-se have made it into this release. Try them out: New custom cards and update of existing ones by mp-se · Pull Request #154 · UI-Lovelace-Minimalist/UI · GitHub

As you may have noticed, @Paddy0174 has also reported back in the discussion area of the repo: Relocation of the repo · Discussion #158 · UI-Lovelace-Minimalist/UI · GitHub
This makes us very happy and means that the repo can stay where it is. Paddy still needs a little time to recover and get up to speed, and then hopefully he’ll be back in full swing.

@stokkie90 has also been busy in the meantime and has continued to work on the HACS support for the Minimalist UI. You can follow the current state of work here WIP: Hacs Support by stokkie90 · Pull Request #168 · UI-Lovelace-Minimalist/UI · GitHub
If you like, you can also help us to find a new logo for the HACS release. Of course we are also grateful for further feedback. Just have a look at the discussions on the Github repo or our Discord server.

see you soon

Features

#154 New custom cards and update of existing ones @mp-se

Code enhancements

#149 Update button_card_templates.yaml 13robin37
#170 armed_away state for alarm chip @denes44

Bug Fixes

#155 Update card_light_icon_info.yaml basbruss
#156 Fix custom_card_saxel blue style card @saxel
#153 Fix battery_card icon color when state is unavailable @saxel
#146 fix Card “card_media_player_with_controls” (missing variable “ulm_card_media_player_with_controls_entity”) vncnt-dev
#183 Light Slider unavailable color @schumijo
#182 Update chips_icon_label to use base chips template @schumijo

Translations

#163 Add Polish translations for cards desty2k
#176 Portuguese Translation kaphwor
#181 Missing variables in new language files @denes44
#184 Update ES.yaml revin34

Documentation

#169 Update README_popups.md @KaherdinTristan
#173 Update README_popups.md @schumijo

Thank you so much for helping out to keep this UI awesome

pedolsky · January 2, 2022, 1:23pm

Awesome work again! Love your excellent Wiki.
Also kudos, love and warmth to Paddie

CM000n · January 2, 2022, 1:46pm

Thank you very much. You should take the wiki with a grain of salt though. During @paddy0174 's absence it is practically not updated and therefore currently quite outdated. We still have some catching up to do here

pedolsky · January 2, 2022, 1:56pm

Tell us where we can help