Thanks! Just noticed by replicating it in a dev-environment that the icon is not loaded properly due to some rework done in the latest release to the pills. I have found a solution and will push it to the PR I mentioned earlier 
I have another question guys.
In the card_light.yaml i cannot decide to use a “none” tap_action.
Even if i place this code:
- type: "custom:button-card"
template: card_light
entity: group.luci_sala_cucina
tap_action:
action: none
variables:
ulm_card_light_name: Sala
ulm_card_light_icon: phu:bulb-group
ulm_card_light_enable_slider: false
ulm_card_light_enable_color: true
ulm_card_light_force_background_color: true
If I tap it will always toggle the light.
How can I solve it?
The card is constructed of multiple layers(items). Each item needs its’ own tap_action to be clickable. Otherwise some parts will do nothing like the icon or the name and other parts will toggle.
Doing this will only set the tap_action for the outer part of the card.
To disable all tap_actions it’s best to make a custom light card by copying the original template and change the name to custom_card_light and set all tap_actions to “none”
I’m looking to do something similar to this but the opposite. I’m looking to use the tap_action to open the cards popup (light or media player). I see that mostly all that cards have it set to hold_action to open the popups and the tap_action displays the normal more info page. How can I change to a tap_action to open the popup? I tried modifying the card-templates but nothing seemed to work.
I just noticed my wife on the iPhone does have the weather chip in the welcome card. So somehow it’s related to Android app and web. 
The android-app uses the same engine as chrome to convert css and javascript. This engine is somewhat different than the ones from apple (safari) and mozilla (firefox) 
But as stated here I have found a workaround. So it will be fixed with release v0.0.7 
1 Like
This goes the same way. Make a customcard from the original one and alter the tap/holdactions just by changing each tap_action into hold_action and vice versa without changing the actions underneath.
Can’t wait for the next release already!
Hoping @madir could help (or anyone for that matter):
I made some modifications to your fabulous room card but am having trouble getting the light percentage to show without decimals. Here’s the snippit from the custom card:
label: |-
[[[
if (variables.room_card_label) {
return '<ha-icon icon="mdi:thermometer" style="width: 16px; height: 16px;"></ha-icon>' + (entity.attributes.current_temperature || entity.attributes.temperature || entity.state || '-') + '°C' + ' | '
+ '<ha-icon icon="mdi:lightbulb-outline" style="width: 18px; height: 18px;"></ha-icon>' + (states[variables.lighting].attributes.brightness / 2.55 || '-') + '%' + ' | '
+ '<ha-icon icon="mdi:ph" style="width: 16px; height: 16px;"></ha-icon>' + (states[variables.ph].state || '-') + ' | '
+ '<ha-icon icon="mdi:flask" style="width: 16px; height: 16px;"></ha-icon>' + (states[variables.salinity].state || '-') + ' | '
+ '<ha-icon icon="mdi:flash" style="width: 16px; height: 16px;"></ha-icon>' + (states[variables.power_consumption].state) + 'W';
} else if (entity.state == "on") {
return variables.ulm_on
} else if (entity.state == "off") {
return variables.ulm_off
} else {
return entity.state
}
]]]
I pass a “lighting” variable to the card, and it’s the line here with the calculation that gives me trouble:
states[variables.lighting].attributes.brightness / 2.55
As soon as I add brackets around this first part and then try to round the number off with round(0), it breaks everything.
(states[variables.lighting].attributes.brightness / 2.55) | round(0)
Any suggestions?
1 Like
Here is my work in progress, inspired by Minimalist! Moved from “chips” to a “chip bar” to show notifications for the relevant screen, and a swipe card and conditional cards to select rooms.
22 Likes
Can you share the raspberry card? Thx.
Can you share your setup?
Really nice work you have made 
Wow! Just wow! Would love if you shared your yaml 
1 Like
Sure thing, but only in return for fixing it up for me A few things don’t work:
- I can’t pass the color variables to the radial graph entities, currently using static hex values but would like to pass rgb.
- I would like the radial graph to take up a little more space in the card, not as a % of the overall card but larger within the 60% it is currently allocated.
template:
radial_icon_info:
variables:
entity_1: ""
entity_1_name: ""
entity_1_color: ""
entity_2: ""
entity_2_name: ""
entity_2_color: ""
entity_3: ""
entity_3_name: ""
entity_3_color: ""
triggers_update: "all"
color: auto
variable: spin
spin: false
show_name: false
show_state: false
show_label: false
show_icon: false
show_last_changed: false
show_entity_picture: false
tap_action:
action: none
aspect_ratio: 2/1
styles:
grid:
- grid-template-areas: '"entity_1_card radial" "entity_2_card radial" "entity_3_card radial"'
- grid-template-columns: "40% 60%"
- grid-template-rows: "1fr 1fr 1fr"
card:
- border-radius: "var(--border-radius)"
- box-shadow: "var(--box-shadow)"
- padding: "2px"
custom_fields:
radial:
card:
type: custom:apexcharts-card
chart_type: radialBar
style: |
ha-card {
border-radius: "var(--border-radius)";
box-shadow: none;
padding-bottom: 0px;
padding-top: 0px;
}
header:
show: false
apex_config:
title:
floating: false
align: top
style:
fontSize: 2px
fontWeight: bold
chart:
foreColor: rgb(148,148,148)
offsetY: 5
legend:
show: false
series:
- entity: "[[[ return variables.entity_1 ]]]"
name: "[[[ return variables.entity_1_name ]]]"
color: "#01C852"
- entity: "[[[ return variables.entity_2 ]]]"
name: "[[[ return variables.entity_2_name ]]]"
color: "#E91E63"
- entity: "[[[ return variables.entity_3 ]]]"
name: "[[[ return variables.entity_3_name ]]]"
color: "#FF9101"
entity_1_card:
card:
type: "custom:button-card"
styles:
card:
- box-shadow: "none"
- border-radius: "none"
- padding-top: "1px"
- padding-bottom: "1px"
template:
- "card_generic_swap"
- "[[[ return variables.entity_1_color + '_no_state' ]]]"
entity: "[[[ return variables.entity_1 ]]]"
name: "[[[ return variables.entity_1_name ]]]"
entity_2_card:
card:
type: "custom:button-card"
styles:
card:
- box-shadow: "none"
- border-radius: "none"
- padding-top: "1px"
- padding-bottom: "1px"
template:
- "card_generic_swap"
- "[[[ return variables.entity_2_color + '_no_state' ]]]"
entity: "[[[ return variables.entity_2 ]]]"
name: "[[[ return variables.entity_2_name ]]]"
entity_3_card:
card:
type: "custom:button-card"
styles:
card:
- box-shadow: "none"
- border-radius: "none"
- padding-top: "1px"
- padding-bottom: "1px"
template:
- "card_generic_swap"
- "[[[ return variables.entity_3_color + '_no_state' ]]]"
entity: "[[[ return variables.entity_3 ]]]"
name: "[[[ return variables.entity_3_name ]]]"
card:
- type: 'custom:button-card'
template: radial_icon_info
variables:
entity_1: sensor.disk_use_percent_home
entity_1_name: "Disk"
entity_1_color: green
entity_2: sensor.processor_use
entity_2_name: "CPU"
entity_2_color: pink
entity_3: sensor.memory_use_percent
entity_3_name: "Memory"
entity_3_color: yellow
2 Likes
Sure, give me a week or so to finish off a few more views and will then share. My code is likely very inefficient though, lots of custom cards when I doubt I really need them, but its as good as my knowledge allows me
3 Likes
Sure thing, going to look at it this weekend.
1 Like
Thanks a lot for your reply, I will give that a try!!!
Appreciate your help and contributions!!
Hi @massaquah ,
I have to send all kudos to @madir , who shared his configs earlier in this topic.
He built a great looking card, that I have taken and only slightly adapted to my liking.
I am sure if you take a look at his post that you will be able to built a similar view to mine.
Thanks to you @madir !!
hi,
thanks.
I am not a coder, just learning!
I don’t see if you have light entity? or variable in you code…
this may be of help:
} else if (entity.state == "on"){
if (entity.attributes.brightness != null){
var bri = Math.round(entity.attributes.brightness / 2.55);
return variables.ulm_card_light_area + " | " + (bri ? bri : "0") + "%" ;
