Custom-card "Waste collection"¶
This is a custom-card
to show the next waste collection date. It uses the data from the custom_component
"Waste Collection Framework".
Credits¶
Author: Paddy0174 - 2021 Version: 1.0.0
Changelog¶
1.0.0
Initial release1.0.1
Fix for UI Minimalist v1.0.1.1.0.2
Fixed the bug where card doesn't show at allUsage¶
- type: custom:button-card
template:
- custom_card_paddy_waste_collection
entity: sensor.waste_collection_paper
Requirements¶
This card needs the following to function correctly:
Component / card | required | Link |
---|---|---|
Waste Collection Schedule Framework | yes | more info |
Variables¶
Variable | Example | Required | Explanation |
---|---|---|---|
entity | sensor.waste_collection_paper | yes | Your waste collection sensor. See HA example on how to configure. | ulm_card_generic_swap_name | Paper | no | ulm_card_generic_swap_icon | mdi:trash-can | no |
Template code¶
Template Code
custom_card_paddy_waste_collection.yaml
---
custom_card_paddy_waste_collection:
template:
- "card_generic_swap"
variables:
ulm_card_generic_swap_name: "[[[ return entity.name; ]]]"
ulm_card_generic_swap_icon: "[[[ return entity.icon; ]]]"
state:
- operator: "template"
value: "[[[ return states[entity.entity_id].attributes.daysTo == 0; ]]]"
styles:
custom_fields:
notification:
- border-radius: "50%"
- position: "absolute"
- left: "38px"
- top: "8px"
- height: "16px"
- width: "16px"
- border: "2px solid var(--card-background-color)"
- font-size: "12px"
- line-height: "14px"
- z-index: "1"
- background-color: >
[[[
return "rgba(var(--color-red),1)";
]]]
- operator: "template"
value: "[[[ return states[entity.entity_id].attributes.daysTo == 1; ]]]"
styles:
custom_fields:
notification:
- border-radius: "50%"
- position: "absolute"
- left: "38px"
- top: "8px"
- height: "16px"
- width: "16px"
- border: "2px solid var(--card-background-color)"
- font-size: "12px"
- line-height: "14px"
- z-index: "1"
- background-color: >
[[[
return "rgba(var(--color-red),1)";
]]]
- value: "unavailable"
styles:
custom_fields:
notification:
- border-radius: "50%"
- position: "absolute"
- left: "38px"
- top: "8px"
- height: "16px"
- width: "16px"
- border: "2px solid var(--card-background-color)"
- font-size: "12px"
- line-height: "14px"
- z-index: "1"
- background-color: >
[[[
return "rgba(var(--color-red),1)";
]]]
custom_fields:
item1:
card:
type: "custom:button-card"
template:
- "icon_more_info"
custom_fields:
item1:
card:
type: "custom:button-card"
entity: "[[[ return entity.entity_id ]]]"
state:
- operator: "template"
value: "[[[ return states[entity.entity_id].attributes.daysTo == 0; ]]]"
styles:
img_cell:
- background-color: "rgba(var(--color-red),0.5)"
icon:
- color: "rgba(var(--color-red),1)"
- operator: "template"
value: "[[[ return states[entity.entity_id].attributes.daysTo == 1; ]]]"
styles:
img_cell:
- background-color: "rgba(var(--color-red),0.05)"
icon:
- color: "rgba(var(--color-red),1)"
item2:
card:
type: "custom:button-card"
entity: "[[[ return entity.entity_id ]]]"
notification: >
[[[
if (entity.state == 'unavailable' || states[entity.entity_id].attributes.daysTo == 0 || states[entity.entity_id].attributes.daysTo == 1){
return '<ha-icon icon="mdi:exclamation" style="width: 12px; height: 12px; color: var(--primary-background-color);"></ha-icon>'
}
]]]
HomeAssistant¶
This is my sensor
setup in HA. I do the change from "days" to "friendly days" in my template sensor.
Note¶
- Don't forget to set
add_days_to
in yoursensor
config- "HEUTE" is german for today or aujourd'hui
- "MORGEN" is german for tomorrow or demain
sensor:
- platform: waste_collection_schedule
name: waste_collection_paper
details_format: upcoming
add_days_to: true # this line is important
value_template: >-
{% if value.daysTo == 0 %}
HEUTE
{% elif value.daysTo == 1 %}
MORGEN
{% else %}
in {{value.daysTo}} Tagen
{% endif %}
types:
- Papiertonne
Notes¶
n/a