Hi! Does anyone know how to properly implement bold fonts for the Title Card’s primary font? I have tried multiple different implementations I’ve seen on this forum and none of them appear to display my desired results. Thanks!
My code looks something like this so far:
card_mod:
style: |
ha-card {
text-decoration: underline;
font-style: italic;
font-family: "Arial";
--card-primary-font-weight: 950 !important;
}
I don’t know how to do it with the title card but it’s possible with template card to only change the top primary field.
type: custom:mushroom-template-card
card_mod:
style:
mushroom-state-info$: |
.primary {
font-weight: bold;
font-variant: small-caps;
border: 1px solid blue;
}
primary: Hello, {{ user }} !
secondary: testing
like this:
type: custom:mushroom-title-card
title: Hello, {{ user }} !
subtitle: Test
card_mod:
style: |
ha-card {
--title-font-weight: 900;
--subtitle-font-weight: 900;
}
or like this:
card_mod:
style: |
.title {
font-weight: 900 !important;
}
.subtitle {
font-weight: 900 !important;
}
i always prefer to edit it directly through the element than the variable though.
font weights tend to max out at 900 btw:
Should probably be in my guide tbh. ill see if i can add it. because its not mentioned in the title card section:
(i know it says template card in the preview, but trust me title card is in the same post 
)
Something like this?
secondary: |-
{% if states('input_number.dishwasher_pod_add') | float == 0 %}
{% if states('input_number.washing_pods_add') | float == 0 %}
Aaah both are 0 what do i do!
{% else %}
Dishwasher is 0, but washing is {{states('input_number.washing_pods_add') | float}}.
{% endif %}
{% else %}
{% if states('input_number.washing_pods_add') | float != 0 %}
What!? neither are equal to 0?? dishwasher is {{states('input_number.dishwasher_pod_add') | float }} and washing is {{states('input_number.washing_pods_add') | float }}
{% else %}
Washing is 0, but dishwasher is {{states('input_number.dishwasher_pod_add') | float }}
{% endif %}
{% endif %}
Or even simpler this:
secondary: |-
{% if states('input_number.dishwasher_pod_add') | float == 0 and states('input_number.washing_pods_add') | float == 0 %}
Aaah both are 0 what do i do!
{% elif states('input_number.dishwasher_pod_add') | float != 0 and states('input_number.washing_pods_add') | float != 0 %}
What!? neither are equal to 0?? dishwasher is {{states('input_number.dishwasher_pod_add') | float }} and washing is {{states('input_number.washing_pods_add') | float }}
{% elif states('input_number.dishwasher_pod_add') | float != 0 and states('input_number.washing_pods_add') | float == 0 %}
Washing is 0, but dishwasher is {{states('input_number.dishwasher_pod_add') | float }}
{% elif states('input_number.dishwasher_pod_add') | float == 0 and states('input_number.washing_pods_add') | float != 0 %}
Dishwasher is 0, but washing is {{states('input_number.washing_pods_add') | float }}
{% endif %}
Of course these are just to illustrate the point, feel free to remove my junk commentary
Many thanks
Just one small question, I know that the
|float)|round(0)
would be used to change the decimal to want I want but I am at a loss as how to apply it to the code you very kindly provided.
I’m looking to get rid of the decimal and the zero after 371:
I really appreciate your help!
Never mind I figured it out!
{% elif states('sensor.solis_s6_solis_battery_charge_power') | float |round(0) != 0 and states('sensor.solis_s6_solis_battery_discharge_power') | float |round(0) != 0 %} W
{{states('sensor.solis_s6_solis_battery_charge_power') | float |round(0) }} W
{{states('sensor.solis_s6_solis_battery_discharge_power') | float |round(0) }} W
{% elif states('sensor.solis_s6_solis_battery_charge_power') | float |round(0) != 0 and states('sensor.solis_s6_solis_battery_discharge_power') | float |round(0) == 0 %}
{{states('sensor.solis_s6_solis_battery_charge_power') | float |round(0) }} W
{% elif states('sensor.solis_s6_solis_battery_charge_power') | float |round(0) == 0 and states('sensor.solis_s6_solis_battery_discharge_power') | float |round(0) != 0 %}
{{states('sensor.solis_s6_solis_battery_discharge_power') | float |round(0) }} W
{% endif %}
Just to add to this, you could make that better readable by using “set” in your template.
{% set charge = states('sensor.solis_s6_solis_battery_charge_power') | float | round(0) %}
{% set discharge = states('sensor.solis_s6_solis_battery_discharge_power') | float | round(0) %}
[...]
{% elif charge != 0 and discharge != 0 %} W
{{ charge }} W
{{ discharge }} W
[...]
And I’d try to use int(0) instead of float(0) | round(0), as you wouldn’t need to round that later on.
No need to do this, but it makes it much better readable.
Absolutely agree with using set.
Just keeping in mind for the second bit that:
| int(0)
Will convert a value such as 9.9 to 9. The (0) just refers to a default value you are giving if the state of the entity is not a number. Like unknown, unavailable, or None, etc.
| round(0)
Converts a value like 9.9 to 10, as it does proper rounding. But it may still display as 10.0 depending on the use. The (0) here does Not refer to a default, but rather the decimals to round to.
So IMO, one is not better than the other, it really depends on the accuracy you want.
To illustrate what i mean by the default value:
| float(0) with a default in front of the | round(0), otherwise it fails:You can also do this instead to have a default for the | round(0) without using | float(0) in front.
Is it possible to use Labels Like in badge in a Chips Card?
Hello everyone,
I’m having an issue with the animations in my Mushroom Cards. The cards display correctly, but the animations no longer work. I was using the templates from rhysb. Link to his Part
Does anyone have any idea what might be causing this or how I can fix the problem?
Thank you in advance for your help!
Hi everyone,
I am working on my first dashboard and wanted to use some features from both the mushroom light card as well as the custom room card made by Everything Smart Home for Minimalist.
Essentially what I want is to merge features from both cards. I would like the slider and brightness/temp/color slider and controls to be at the same row as the Bedroom text (like the default minimalist light card) but then also be able to add a label showing temperature and more buttons at the bottom row for things like heating etc.
I can’t seem to find any yaml templates for mushroom to use as a base for adding more items and I have no idea where to get started if I want to port the slider and temp/brightness/colour functionality over to minimalist so I’m pretty stuck.
Here’s a crappy drawing of what I want to do 
the bottom buttons are just examples of buttons.
Hello
Great work on this its fantastic,
Just a quick question, can I use these animations on Mushroom Template Badges?
I can’t get it to work.
This is my code
type: custom:mushroom-template-badge
content: |-
{% set state=states('binary_sensor.kitchen_camera_person_occupancy') %}
{% if state=='off' %}
Clear
{% elif state=='on' %}
Detected
{% endif %}
icon: |-
{% if is_state('binary_sensor.kitchen_camera_person_occupancy', 'on') %}
mdi:motion-sensor
{% else %}
mdi:motion-sensor-off
{% endif %}
color: |-
{% if is_state('binary_sensor.kitchen_camera_person_occupancy', 'on') %}
yellow
{% else %}
grey
{% endif %}
entity: binary_sensor.kitchen_camera_person_occupancy
tap_action:
action: more-info
card_mod:
style:
mushroom-shape-icon$: |
.shape {
--shape-animation: motion 2s linear infinite;
}
@keyframes motion {
0%, 100% { --shape-color: rgba(var(--rgb-blue), 0.3); }
50% { --shape-color: rgba(var(--rgb-blue), 0.2); }
}
.: |
ha-state-icon {
animation: clip 2s linear infinite;
}
@keyframes clip {
50% { clip-path: polygon(0 0, 55% 0, 100% 100%, 0 100%); }
}
thanks
I just want to have a tittle with the name of the person who is logged in
- type: custom:mushroom-template-card
primary: {{user}}
I found this on the forum, but that is not working for me. Do I miss something ?
it’s built into the standard example for a template card?
type: custom:mushroom-template-card
primary: Hello, {{user}}
secondary: ''
icon: ''
yes, I get invalid key: “{‘user’: None}”
post your full code