#I have some code that will clean up your

1 messages · Page 1 of 1 (latest)

sick mirage
#

@dusk garden What's nice about this code, it will determine the appropriate icon for power level and charging type and color (green-to-red) for you without having to hardcode everything.```yaml
type: custom:mushroom-template-card
entity: sensor.s22_ultra_battery_level
primary: '{{ state_attr(entity, "friendly_name").title() }}'
secondary: '{{ states(entity) + "%" }}'
layout: vertical
icon: |-
{% set battery_level = states(entity) | int // 10 * 10 %}
{% set charging_state = states('sensor.s22_ultra_charger_type') %}
{% set is_charging = is_state('binary_sensor.s22_ultra_is_charging', 'on') | iif(True,False) %}
{% set map ={"none":"","ac":"charging-","wireless":"charging-wireless-"} %}
{% set charging = map[states('sensor.s22_ultra_charger_type')] %}
{% if battery_level == 100 and is_charging == True %} mdi:battery-charging
{% elif battery_level == 100 %} mdi:battery
{% elif battery_level >= 10 %} mdi:battery-{{charging}}{{battery_level}}
{% elif battery_level >= 0 %} mdi:battery-{{charging}}outline
{% else %} mdi:battery-unknown
{% endif %}
icon_color: |-
{% set percentage = states(entity) | int %}
{% set r, g, b = 0, 0, 0 %}
{% if (percentage <= 51) %}
{% set r = 255 %}
{% set g = (5.0 * percentage) | round | int %}
{% else %}
{% set g = 255 %}
{% set r = (505 - 4.89 * percentage) | round | int %}
{% endif %}
{{ "#%0x" | format( r * 0x10000 + g * 0x100 + b * 0x1 ) }}

Note: For some reason the Editor UI will condense the icon code so it is not as pretty even though the **|-** is used to try to tell it to leave it alone. Icon color will remain untouched.
#

Also note that the custom:button-card does a lot of this on its own but the Mushroom Template Card needs every little thing defined.