Instead of state: > change it to value_template:>
Example below
- platform: template
sensors:
lights_on_livingroom:
unit_of_measurement: "on"
value_template: >
{% set lights = [
states.switch.sonoff_100136948d_1,
states.switch.sonoff_100136948d_2,
states.switch.sonoff_100136948d_3,
] %}
{{ lights | selectattr('state','eq','on') | list | count }}
Or you can try this one, this doesn’t require to list your lights (dynamic):
{% set lights = states.light
| selectattr('state', 'eq', 'on')
| rejectattr('domain', 'eq', 'group')
| map(attribute='state') %}
{{ lights | list | count }}
this work perfectly! I did not try the other two ways as I want it dynamic. Thanks Andras
hi benm7,
nice work 
the header looks nice, can u share some codes of it? 
thx
Nice layout! Would you please share the code of this two include yaml pages?
/config/dashboards/template/popup_layout_template.yaml
/config/dashboards/template/popup_layout_setup.yaml
Thank you for all your hard work.
Figured this out, missing grid: 
Here is the button for anyone interested, also have set it up to conditionally change the header colours based on the state of the system.
Disarmed:
Armed:
Template:
---
custom_alarm:
styles:
card:
- border-radius: 'var(--border-radius)'
- box-shadow: 'var(--box-shadow)'
- padding: 12px
grid:
- grid-template-areas: "'item1' 'item2'"
- grid-template-columns: "1fr"
- grid-template-rows: "min-content min-content"
- row-gap: 12px
custom_fields:
item1:
card:
type: custom:button-card
template:
- "icon_info"
entity: '[[[ return variables.ulm_custom_alarm_grid_state ]]]'
tap_action:
action: more-info
label: '[[[ return states[variables.ulm_custom_alarm_grid_state].state ]]]'
styles:
card:
- background-color: 'rgba(0,0,0,0)'
state:
- value: 'disarmed'
label: 'Disarmed'
icon: "mdi:shield-off"
styles:
icon:
- color: 'rgba(var(--color-green), 1)'
img_cell:
- background-color: 'rgba(var(--color-green-bg), 1.0)'
- value: 'armed_away'
label: 'Armed'
icon: "mdi:shield-lock"
styles:
icon:
- color: 'rgba(var(--color-red), 1)'
img_cell:
- background-color: 'rgba(var(--color-red-bg), 1.0)'
- value: 'armed_home'
label: 'Home'
icon: "mdi:shield-home"
styles:
icon:
- color: 'rgba(var(--color-green), 1)'
img_cell:
- background-color: 'rgba(var(--color-green-bg), 1.0)'
item2:
card:
type: custom:button-card
template: custom_alarm_state_grid_item_list
custom_fields:
disarm:
card:
type: custom:button-card
icon: mdi:shield-off
template: custom_alarm_state_grid_job_state_item_list_items
entity: '[[[ return variables.ulm_custom_alarm_grid_state ]]]'
state:
- value: 'disarmed'
icon: "mdi:shield-off"
styles:
icon:
- color: 'var(--google-green)'
card:
- background-color: 'rgba(0,0,0,0)'
- border-radius: 'var(--border-radius-bar)'
tap_action:
action: call-service
service: alarm_control_panel.alarm_disarm
service_data:
entity_id: '[[[ return variables.ulm_custom_alarm_grid_state ]]]'
haptic: success
away:
card:
type: custom:button-card
icon: mdi:shield-lock
template: custom_alarm_state_grid_job_state_item_list_items
entity: '[[[ return variables.ulm_custom_alarm_grid_state ]]]'
state:
- value: 'armed_away'
icon: "mdi:shield-lock"
styles:
icon:
- color: 'var(--google-red)'
card:
- background-color: 'rgba(0,0,0,0)'
- border-radius: '14px'
tap_action:
action: call-service
service: alarm_control_panel.alarm_arm_away
service_data:
entity_id: '[[[ return variables.ulm_custom_alarm_grid_state ]]]'
haptic: success
home:
card:
type: custom:button-card
icon: mdi:shield-home
template: custom_alarm_state_grid_job_state_item_list_items
entity: '[[[ return variables.ulm_custom_alarm_grid_state ]]]'
state:
- value: 'armed_home'
icon: "mdi:shield-home"
styles:
icon:
- color: 'var(--google-green)'
card:
- background-color: 'rgba(0,0,0,0)'
- border-radius: '14px'
tap_action:
action: call-service
service: alarm_control_panel.alarm_arm_home
service_data:
entity_id: '[[[ return variables.ulm_custom_alarm_grid_state ]]]'
haptic: success
custom_alarm_state_grid_item_list:
styles:
card:
- box-shadow: none
- padding: 0px
- border-radius: 'var(--border-radius-bar)'
- pointer-events: none
- background-color: 'rgba(var(--color-theme), 0.05)'
- justify-items: center
grid:
- grid-template-areas: "'disarm away home'"
- grid-template-columns: "1fr 1fr 1fr"
- grid-template-rows: "min-content"
- column-gap: 9px
- justify-items: center
img_cell:
- justify-items: center
custom_alarm_state_grid_job_state_item_list_items:
show_icon: true
show_name: false
size: 24px
tap_action:
action: none
styles:
card:
- box-shadow: none
- padding: 2px
- border-radius: 'var(--border-radius)'
- place-self: center
- height: 40px
- width: 80px
- pointer-events: auto
- background-color: transparent
grid:
- grid-template-areas: '"i"'
icon:
- color: var(--google-grey)
Sure thing, here you go!
card_room_wide:
template:
- "ulm_language_variables"
variables:
label_use_temperature: true
label_use_brightness: false
icon_color: green
color: "var(--google-grey-500)"
show_icon: true
show_name: true
show_label: true
size: "45%"
aspect_ratio: "2/1"
label: |-
[[[
if (variables.label_use_temperature) {
return '<ha-icon icon="mdi:thermometer" style="width: 16px; height: 18px; color:var(--main-theme);"></ha-icon>' + (entity.attributes.current_temperature || entity.attributes.temperature || entity.state || '-') + (entity.attributes.unit_of_measurement || '°C');
} else if (variables.label_use_brightness) {
if (entity.state){
if (entity.state == "off"){
return variables.ulm_off;
} else if (entity.state == "on"){
if (entity.attributes.brightness != null){
var bri = Math.round(entity.attributes.brightness / 2.55);
return (bri ? bri : "0") + "%";
} else {
return variables.ulm_on
}
}
} else {
return variables.ulm_unavailable;
}
} else if (entity.state == "on") {
return variables.ulm_on
} else if (entity.state == "off") {
return variables.ulm_off
} else {
return ""
}
]]]
state:
- styles:
custom_fields:
notification:
- border-radius: "50%"
- border: "2px solid var(--card-background-color)"
- width: "24.5px"
- height: "24.5px"
- position: "absolute"
- left: "50%"
- top: "50%"
- transform: "translate(-50%,-50%)"
- margin-top: "35%"
- margin-left: "-35%"
- line-height: 0
- display: "grid"
- background-color: >
[[[
return "rgba(var(--color-red),1)";
]]]
value: "unavailable"
styles:
card:
- border-radius: "var(--border-radius-bar)"
- box-shadow: "var(--box-shadow)"
- padding: "5px"
# return 'url('+ variables.room_card_image_path +')'
- background-image: >
[[[
return 'url('+ variables.room_card_image_path +')'
]]]
- background-position: "center"
- background-repeat: "no-repeat"
- background-size: "cover"
grid:
- grid-template-areas: "'i n n n n n' 'i l l l l l' '. i5 i4 i3 i2 i1'"
- grid-template-columns: "1fr 1fr 1fr 1fr 1fr 1fr"
- grid-template-rows: "1fr 1fr 1fr"
- justify-items: "center"
icon:
- color: "[[[ return 'rgba(var(--color-' + variables.icon_color + '),1)'; ]]]"
img_cell:
- background-color: "[[[ return 'rgba(var(--color-' + variables.icon_color + '-bg),1)'; ]]]"
- border-radius: "50%"
- width: "56px"
- height: "56px"
- max-width: "none"
- max-height: "none"
- position: "absolute"
- left: "3%"
- top: "6%"
# - transform: "translate(-50%,-50%)"
# - margin-top: "25%"
# - margin-left: "-25%"
name:
- justify-self: "start"
- align-self: "end"
- font-weight: "bold"
- font-size: "18px"
- margin-left: "22px"
- margin-top: "20px"
- margin-bottom: "24px"
- color: "[[[ return 'rgba(var(--color-' + variables.icon_color + '),1)'; ]]]"
label:
- justify-self: "start"
- align-self: "start"
- font-weight: "bold"
- font-size: "16px"
# - filter: "opacity(40%)"
- margin-left: "18px"
- margin-top: "-8%"
- color: "[[[ return 'rgba(var(--color-' + variables.icon_color + '-bg),1)'; ]]]"
state:
- justify-self: "start"
- font-weight: "bold"
- font-size: "12px"
- filter: "opacity(40%)"
- margin-left: "6px"
custom_fields:
i1:
- border-radius: "50%"
- width: "80%"
- height: "80%"
- line-height: 0
- display: "grid"
i2:
- border-radius: "50%"
- width: "80%"
- height: "80%"
- line-height: 0
- display: "grid"
i3:
- border-radius: "50%"
- width: "80%"
- height: "80%"
- line-height: 0
- display: "grid"
i4:
- border-radius: "50%"
- width: "80%"
- height: "80%"
- line-height: 0
- display: "grid"
i5:
- border-radius: "50%"
- width: "80%"
- height: "80%"
- line-height: 0
- display: "grid"
custom_fields:
notification: >
[[[
if (entity.state =='unavailable'){
return `<ha-icon icon="mdi:exclamation" style="width: 50%; height: 50%; color: var(--primary-background-color);"></ha-icon>`
}
]]]
i1:
card:
type: "custom:button-card"
template: >
[[[
var templates = ['widget_icon_room'];
if (variables?.entity_1?.templates?.length) {
return ['widget_icon_room'].concat(variables.entity_1.templates);
}
return templates;
]]]
variables: "[[[ return variables.entity_1; ]]]"
entity: >
[[[
if (variables.entity_1.entity_id) {
return variables.entity_1.entity_id;
}
]]]
state:
- operator: "template"
value: "[[[ return !variables.entity_1; ]]]"
styles:
card:
- display: "none"
i2:
card:
type: "custom:button-card"
template: >
[[[
var templates = ['widget_icon_room'];
if (variables?.entity_2?.templates?.length) {
return ['widget_icon_room'].concat(variables.entity_2.templates);
}
return templates;
]]]
variables: "[[[ return variables.entity_2; ]]]"
entity: >
[[[
if (variables?.entity_2?.entity_id) {
return variables.entity_2.entity_id;
}
]]]
state:
- operator: "template"
value: "[[[ return !variables.entity_2; ]]]"
styles:
card:
- display: "none"
i3:
card:
type: "custom:button-card"
template: >
[[[
var templates = ['widget_icon_room'];
if (variables?.entity_3?.templates?.length) {
return ['widget_icon_room'].concat(variables.entity_3.templates);
}
return templates;
]]]
variables: "[[[ return variables.entity_3; ]]]"
entity: >
[[[
if (variables?.entity_3?.entity_id) {
return variables.entity_3.entity_id;
}
]]]
state:
- operator: "template"
value: "[[[ return !variables.entity_3; ]]]"
styles:
card:
- display: "none"
i4:
card:
type: "custom:button-card"
template: >
[[[
var templates = ['widget_icon_room'];
if (variables?.entity_4?.templates?.length) {
return ['widget_icon_room'].concat(variables.entity_4.templates);
}
return templates;
]]]
variables: "[[[ return variables.entity_4; ]]]"
entity: >
[[[
if (variables?.entity_4?.entity_id) {
return variables.entity_4.entity_id;
}
]]]
state:
- operator: "template"
value: "[[[ return !variables.entity_4; ]]]"
styles:
card:
- display: "none"
i5:
card:
type: "custom:button-card"
template: >
[[[
var templates = ['widget_icon_room'];
if (variables?.entity_5?.templates?.length) {
return ['widget_icon_room'].concat(variables.entity_5.templates);
}
return templates;
]]]
variables: "[[[ return variables.entity_5; ]]]"
entity: >
[[[
if (variables?.entity_5?.entity_id) {
return variables.entity_5.entity_id;
}
]]]
state:
- operator: "template"
value: "[[[ return !variables.entity_5; ]]]"
styles:
card:
- display: "none"
widget_icon_room:
variables:
tap_action:
action: "toggle"
hold_action:
action: "none"
tap_action:
action: >
[[[ if (variables?.tap_action?.action) return variables.tap_action.action; else return 'none'; ]]]
entity: "[[[ return variables.tap_action.entity; ]]]"
navigation_path: "[[[ return variables.tap_action.navigation_path; ]]]"
url_path: "[[[ return variables.tap_action.url_path; ]]]"
service: "[[[ return variables.tap_action.service; ]]]"
service_data: "[[[ return variables.tap_action.service_data; ]]]"
hold_action:
action: >
[[[ if (variables?.hold_action?.action) return variables.hold_action.action; else return 'none'; ]]]
entity: "[[[ return variables.hold_action.entity; ]]]"
navigation_path: "[[[ return variables.hold_action.navigation_path; ]]]"
url_path: "[[[ return variables.hold_action.url_path; ]]]"
service: "[[[ return variables.hold_action.service; ]]]"
service_data: "[[[ return variables.hold_action.service_data; ]]]"
show_icon: true
show_name: false
styles:
grid:
- grid-template-areas: "'i'"
card:
- height: "100%"
- box-shadow: "none"
- padding: "0px"
- border-radius: "50%"
icon:
- width: "50%"
- height: "50%"
- line-height: "0"
- color: "rgba(var(--color-theme),0.2)"
img_cell:
- border-radius: "50%"
- background-color: "rgba(var(--color-theme),0.05)"
size: "15px"
color: "var(--google-grey)"
Button example:
- type: 'custom:button-card'
template:
- card_room_wide
name: Outdoors
entity: sensor.dark_sky_temperature
icon: mdi:tree
tap_action:
action: navigate
navigation_path: '/ui-lovelace-minimalist/outdoors'
variables:
label_use_temperature: true
label_use_brightness: false
icon_color: green
room_card_image_path: '/local/outdoors.jpeg'
entity_1:
entity_id: light.front_lights
templates:
- yellow_on
tap_action:
action: toggle
haptic: success
entity_2:
entity_id: media_player.outdoor_sonos
templates:
- blue_playing
tap_action:
action: more-info
entity_3:
entity_id: switch.pool_pump
templates:
- blue_on
tap_action:
action: toggle
haptic: success
entity_4:
entity_id: switch.vege_patch_zone
templates:
- green_on
tap_action:
action: toggle
haptic: success
Note I use my own theme colours for the solid pale backgrounds of the buttons. Will try and upload my theme tonight to git.
Will do, need to get it up on Github and cant access on the work VPN so will do later tonight
I use the Vertical Button Card for my input buttons.
Example:
- type: 'custom:button-card'
template: card_vertical_button
entity: input_button.myinputbutton
name: Some Amazing Name
show_last_changed: true
Sure,
popup_layout_template.yaml:
grid-template-columns: repeat(3, 1fr)
grid-template-areas: |
"column1 column2 column3"
mediaquery:
"(max-width: 600px)": #phone
grid-template-columns: auto
grid-template-areas: |
"column1"
"column2"
"column3"
popup_layout_setup.yaml:
.: |
:host .content {
width: calc(385px + 385px + 385px);
max-width: 100vw;
backdrop-filter: blur(30px);
background-color: var(--primary-background-color)
}
Thanks mate!
I worked it out in the end, it was about default actions for some entity types. Got it fixed in the end 
It’s been a long time, but here is finally a new release packed with a lot of features
Features
Code enhancements
Bug Fixes
Translations
Documentation
Thank you so much for helping out to keep this UI awesome@13robin37, @Eltarius, @EverythingSmartHome, @Gilganik, @MichaelBrunn3r, @Neekster, @Wesleyl89, @aomann, @basbruss, @desty2k, @finder39, @jordandrako, @oscfdezdz, @ulug79, @viseradius, @wranglatang, @yagrasdemonde and pw521312
Hi, thanks for your hard work. One question though, could you please try to list breaking changes as well? Most likely because a lot of my cards are custom ones, but ALL of them ro longer render due to missing base templates:
There are no breaking changes. This is most likely the effect of storing custom_cards in the wrong directory. See the instructions and the warning here: Configuration - UI Lovelace Minimalist
Also try resetting your browsers’ cache with CTRL + F5 to load in all the templates.
That is where they are, and flushing the front end cache was the first I tried. Reverting to the previous release did not fix it (strange, because I’m sure that was the version I was on). Reverting to the one below that did fix it. Will look into it when I got time, but something is different between these releases.
Looks way better for now: 
Hi,
The popups card not working for me 
I have tried to clear the browser cache, reinstall browser_mod
and reinstall minimalist.
with no sucsess
- type: "custom:button-card"
template: card_thermostat
entity: climate.bedroom_ac
variables:
ulm_card_thermostat_enable_collapse: true
ulm_card_thermostat_enable_controls: true
ulm_card_thermostat_enable_hvac_modes: true
ulm_card_thermostat_enable_popup: true
ulm_card_thermostat_enable_display_temperature: true
- type: "custom:button-card"
entity: light.wled_light_4
template: card_light_slider_collapse
variables:
ulm_card_light_slider_collapse_name:
ulm_card_light_enable_slider: true
ulm_card_light_enable_color: true
ulm_card_light_force_background_color: true
ulm_card_light_enable_popup: true
@Edwin_D Glad you could revert to get your custom_cards back.
All changes in the latest releases and the ones before are optional, additional, or completely new cards. They should not interfere with existing setups. My personal and dev-setup were not affected.
@RaA11 card_light_slider_collapse is deprecated and does not work with the variables you assign to it 
Rather use card_light instead.
@basbrus thank you for your response 
I have changed the temmplate to card_light - clearing the cache, restart HA and still no popup…
hello very nice dashboard & I have a question about your pollen card I think it’s very nice could you share it & your card from the cover also very nice thanks in advance!
Thanks guys! and the other devs as well, without you we would still have… vanilla HA 
