Add theming to custom state color cards

This commit is contained in:
2025-07-17 22:35:54 -04:00
parent 008b500b74
commit 2f3bab52b2

View File

@@ -509,6 +509,19 @@ views:
!important;
transition: background-color 1s !important;
}
.bubble-icon {
color:
{% set feeding_reminders = states('counter.rabbit_feeding_reminder_count') | int %}
{% set cleaning_reminders = states('counter.rabbit_hutch_cleaning_reminder_count') | int %}
{% if feeding_reminders == 0 and cleaning_reminders == 0 %}
var(--bubble-main-icon-color)
{% elif feeding_reminders < 3 and cleaning_reminders < 3 %}
var(--warning-color)
{% else %}
var(--error-color)
{% endif %}
!important;
transition: color 1s !important;
- type: custom:streamline-card
template: main_button_name
variables:
@@ -624,6 +637,24 @@ views:
!important;
transition: background-color 1s !important;
}
.bubble-icon {
color:
{% set counters = states.counter
| selectattr('entity_id','contains','tony')
| selectattr('entity_id','contains','meds')
| map(attribute='state')
| max
| int %}
{% if counters == 0 %}
var(--bubble-main-icon-color)
{% elif counters < 3 %}
var(--warning-color)
{% else %}
var(--error-color)
{% endif %}
!important;
transition: color 1s !important;
}
visibility:
- condition: user
users:
@@ -667,6 +698,24 @@ views:
!important;
transition: background-color 1s !important;
}
.bubble-icon {
color:
{% set counters = states.counter
| selectattr('entity_id','contains','tina')
| selectattr('entity_id','contains','meds')
| map(attribute='state')
| max
| int %}
{% if counters == 0 %}
var(--bubble-main-icon-color)
{% elif counters < 3 %}
var(--warning-color)
{% else %}
var(--error-color)
{% endif %}
!important;
transition: color 1s !important;
}
visibility:
- condition: user
users:
@@ -718,6 +767,24 @@ views:
!important;
transition: background-color 1s !important;
}
.bubble-icon {
color:
{% set counters = states.counter
| selectattr('entity_id','contains','kallen')
| selectattr('entity_id','contains','meds')
| map(attribute='state')
| max
| int %}
{% if counters == 0 %}
var(--bubble-main-icon-color)
{% elif counters < 3 %}
var(--warning-color)
{% else %}
var(--error-color)
{% endif %}
!important;
transition: color 1s !important;
}
- type: custom:bubble-card
card_type: button
button_type: name