šŸŒ» Lovelace UI ā€¢ Minimalist

hello, sorry but can you give me a card example using a bynary sensor?! thanks (move sensor), im not good with codeā€¦

After copying the template into your custom card folder you only need to add ā€œbattery_infoā€ to your card.

  template: 
    - "ulm_card_binary_sensor"
    - "ulm_show_last_changed: true"
    - "battery_info"
1 Like

Question about the use of entity_picture in the current minimalist version

I have been using the minimalist project for a while now (prior to significant changes several versions back) and am struggling with using a picture (entity_picture) in place of an icon (entitiy_icon). In earlier versions of minimalist, I was able to specify an entity_picture url that appeared in place of the icon.

This is a screen excerpt from what I previously had working:

old minimalist with entity_picture

Each of those entity_pictures is an animated.svg image (usually dependent on a state value). For example if it was night and the next sun event was sunrise at 5:06 AM it would show an animated sunrise image, the time and the name of the event (aka sunrise) as shown in the above picture.

Likewise for the next tide event. If the next tide will be high at 11:52pm it shows an animated high tide icon, the time and the type of tide it will be (high or low)

          - type: 'custom:button-card'
            entity: sensor.next_tide_type
            show_entity_picture: true
            size: 150%

            tap_action:
              action: more-info
              entity: sensor.next_tide_time

            state:
              - value: 'High'
                entity_picture: "https://<base url here>/local/tide-high.svg"
                name: 'High Tide'
              - value: 'Low'
                entity_picture: "https://<base url here>/local/tide-low.svg"
                name: 'Low Tide'

            template: 
              - icon_info_bg
              - generic
            label: |-
                [[[ 
                    return states["sensor.next_tide_time"].state; 
                ]]]

I used the above block of code (or very close to it as I have been trying to get it to work with the latest code for a while now) to produce the tide button shown above.

I canā€™t reproduce the above behavior anymore with the latest version of minimalist.

My current attempt is this:

          - type: 'custom:button-card'
            entity: sun.sun
            show_entity_picture: false
            size: 120%

            tap_action:
              action: more-info
              entity: sensor.sunevent_localtime

            state:
              - value: 'below_horizon'
                entity_picture: "https://<base url here>/local/weather-icons/fill/all/sunrise.svg"
                name: 'Sunrise'
              - value: 'above_horizon'
                entity_picture: "https://<base url here>/local/weather-icons/fill/all/sunset.svg"
                name: 'Sunset'
            template: card_generic

            variables:
              ulm_card_generic_name: |-
                [[[ 
                    return states["sensor.sunevent_localtime"].state; 
                ]]]

With show_entity_picture: false (or the whole line commented out), the following is shown:

with show_entity_picture false

With show_entity_picture: true, the following is shown:

with show_entity_picture true

Has anyone been able to figure out a way to get entity_picture images to show properly? Iā€™d really like to get the functionality back to as show in the top image again. Does anyone have any suggestions or ideas?

The template changed. That results in problems with ā€œoldā€ modifications. Just look at the new template code:

https://ui-lovelace-minimalist.github.io/UI/usage/cards/card_generic/#usage

I think my post to change icon color can help you:

Hi Together,

did anybody manage to switch between darkmode and lightmode via a service?
I want to switch to darkmode at night for my tablet but donā€™t know how.
Via normal set theme or via browser-mod I was not able to change.
Can somebody help me here please?

If your tablet runs on Android, you can set the Darkmode triggered by a timespan or sunset. Then simply open your companion app, go to your account settings and select auto. Then the OS will handle the light/dark toggle in your apps.

Otherwise simply search in the community. Here is an automation for this. Donā€™t forget to change your theme to backend selected.

If you read the rest of that topic you will see that suggestion did not work.

1 Like

So the only option using automation is to have two themes one dark one light and not a dual mode theme. Otherwise the only possibility is os managed.

So the only way is to duplicate the standard minimalist theme and set this to a dark theme? Then after every release I have to do this again, correct?

Why would you have to do that?

I would have thought, that the theme YAMLS will change with some releases?

I think I had to edit my themes once in the last year when some paper controls were replaced with MWC. Took about 3 minutes.

Anyone have any ideas how to make an icon for a media player in the room card show on/off status? Media players under developer tools ā†’ states, show

off, idle, standby, playing

But donā€™t actually show an ā€˜onā€™ state, which I believe the room card relies on an on/off state

image
https://ui-lovelace-minimalist.github.io/UI/usage/cards/card_room/

        - type: "custom:button-card"
          template:
            - card_room
            - purple_no_state
          name: Living Room
          entity: light.couch_lamp_zha_group
          icon: mdi:sofa
          tap_action:
            action: navigate
            navigation_path: "living_room"
          variables:
            label_use_temperature: false
            label_use_brightness: false
            entity_1:
              entity_id: light.couch_lamp_zha_group
              templates:
                - yellow_on
              tap_action:
                action: toggle
            entity_2:
              entity_id: media_player.living_room_nvidia_shield
              templates:
                - blue_on
              tap_action:
                action: call-service
                service: media_player.turn_on
                service_data:
                  entity_id: media_player.living_room_nvidia_shield
              hold_action:
                action: call-service
                service: media_player.turn_off
                service_data:
                  entity_id: media_player.living_room_nvidia_shield

Any tips would be appreciated, Iā€™ve tried searching and am coming up dry.

EDIT:
I tried adding a template state - which also didnā€™t work

            entity_2:
              state: >
                     {% set lrs = states('media_player.living_room_nvidia_shield') %}
                     {{ 'on' if lrs != 'off' else 'off' }}
              entity_id: media_player.living_room_nvidia_shield
              templates:
                - blue_not_off
              tap_action:
                action: call-service
                service: media_player.turn_on
                service_data:
                  entity_id: media_player.living_room_nvidia_shield
              hold_action:
                action: call-service
                service: media_player.turn_off
                service_data:
                  entity_id: media_player.living_room_nvidia_shield

So I ended up going to here and making ā€™blue_not_off.yamlā€™ template as well as one for green, yellow, pink, red, and purple

/config/custom_components/ui_lovelace_minimalist/__ui_minimalist__/ulm_templates/card_templates/colors/

example template

---
blue_not_off:
  state:
    - styles:
        icon:
          - color: "rgba(var(--color-blue),1)"
        label:
          - color: "rgba(var(--color-blue-text),1)"
        name:
          - color: "rgba(var(--color-blue-text),1)"
        img_cell:
          - background-color: "rgba(var(--color-blue), 0.2)"
        card:
          - background-color: "rgba(var(--color-background-blue), var(--opacity-bg))"
      id: "not_off"
      operator: template
      value: >
             [[[
               return (entity.state != "off" )
             ]]]
# Legacy
blue:
  template: "blue_not_off"

Hi guys,

been using the theme for a while now, but was wondering if anybody already implemented some nice solution for using a vacuum map??

Dennsi

First: Never edit cards in the custom_components directory!

Try this:

  1. Go to your config/ui_lovelace_minimalist/custom_cards directory
  2. create a directory, e.g. my_templates
  3. create a blue_not_off.yaml
blue_not_off:
  state:
    - styles:
        icon:
          - color: "rgba(var(--color-blue),1)"
        label:
          - color: "rgba(var(--color-blue-text),1)"
        name:
          - color: "rgba(var(--color-blue-text),1)"
        img_cell:
          - background-color: "rgba(var(--color-blue), 0.2)"
        card:
          - background-color: "rgba(var(--color-background-blue), var(--opacity-bg))"
      value: "off"
      operator: '!='
  1. apply the template to your card
  2. go to developer settings and hit the ui lovelace minimalist button
  3. refresh your dashboard
1 Like

I know not to edit the cards as theyā€™ll get overwritten with updates.

Didnā€™t think cards that donā€™t exist in the repo have an issue of being overwritten, as thereā€™s nothing to overwrite them from the repo?

Iā€™ll move them, but it shouldnā€™t matter with templates that donā€™t exist.

Just follow the instructions in my post. Thats the way to add custom cards. Dont know if they are persistent if you add it directly.

Yea, that doesnā€™t work, the dashboards are setup with.

---
button_card_templates: !include_dir_merge_named "../../custom_components/ui_lovelace_minimalist/__ui_minimalist__/ulm_templates/"

Which is where all of the templates live.

https://ui-lovelace-minimalist.github.io/UI/setup/configuration/#custom-cards
https://ui-lovelace-minimalist.github.io/UI/setup/custom_cards/#custom-cards

Your instructions and the above documentation, are for custom_cards. Why would I want color templates under custom_cards, when they clearly go in card_templates/colors/

Cleaner and maintains directory structure :point_down:

configuration.yaml

# Include Shell Commands
shell_command: !include shell_commands.yaml

Automation

alias: COPY - UI Minimalist Templates
description: Copy Template files to custom_components directory
trigger:
  - platform: time_pattern
    hours: /23
condition: []
action:
  - service: shell_command.copy_custom_card_templates
  - service: shell_command.copy_custom_actions_templates
  - service: shell_Command.copy_custom_popup_template
mode: single

/config/shell_commands.yaml

copy_card_templates: >-
  cp -R /config/ui_lovelace_minimalist/custom_card_templates/*
  /config/custom_components/ui_lovelace_minimalist/__ui_minimalist__/ulm_templates/custom_card_templates/
  
copy_custom_actions: >-
  cp -R /config/ui_lovelace_minimalist/custom_actions/*
  /config/custom_components/ui_lovelace_minimalist/__ui_minimalist__/ulm_templates/custom_actions/
  
copy_custom_popup_templates: >-
  cp -R /config/ui_lovelace_minimalist/custom_popup_templates/*
  /config/custom_components/ui_lovelace_minimalist/__ui_minimalist__/ulm_templates/custom_popup_templates/

Skipped ā€˜custom_cardsā€™ directory as its the only automatic one.

It is a custom card. If you want it to be part of the project branch it, add the card and do a pull request. :wink:

It doesnt matter where the card is locates. In the end all cards and templates become one big yaml file. My custom cards and templates are all in the same directory together with the official custom cards.

Seems messy. especially when the actual ulm_templates directory is nicely manicured structure.