Based on the code from @xirixiz I changed the naming of the icons, added “christmastrees” and overall reworked the icon set a bit to be a bit more consistent. This is the last I am doing on these icons 
For any one who might be interested in dutch notation on the dates I have made the stuf below.
Not really small in code but does the job 
And of course thx for this nice add on 
- platform: template
sensors:
trash_first_next_date_formatted:
entity_id: sensor.trash_first_next_date
value_template: >
{%- set tracker_timestamp = as_timestamp(strptime(states.sensor.trash_first_next_date.state, "%d-%m-%Y")) %}
{% set months = ["Jan", "Feb", "Mrt", "Apr", "Mei", "Jun", "Jul", "Aug", "Sep", "Okt", "Nov", "Dec"] %}
{%- set wdays = ["Zo", "Ma", "Di", "Wo", "Do", "Vr", "Za"] %}
{%- set wday = tracker_timestamp | timestamp_custom('%w') | int %}
{%- set month = tracker_timestamp | timestamp_custom('%m') | int %}
{{ tracker_timestamp | timestamp_custom(wdays[wday] + ' ' '%d' ' ' + months[month-1] ) }}
nice indeed, thanks.
one small but significant edit: have it use the states() notation/function, to guard against ‘unknown’ issues:
{%- set tracker_timestamp = as_timestamp(strptime(states('sensor.trash_first_next_date'), '%d-%m-%Y')) %}
Hi! I got the sensors to work, and am able to display the ‘basic’ the UI. Great stuff!
On the GitHub page (https://github.com/xirixiz/Home-Assistant-Sensor-Afvalwijzer) I found an image that I found to be the best overview I’ve seen. Based on much of the discussion in this thread, I tried to replicate it, but I wasn’t successful. I installed all the custom components. Is the code for the layout of this image available somewhere?
‘this image’ is a stack of elements 
you can try mine, Ive updated it yesterday to use @thomasloven 's new hui-element custom-card, so you can use an entities card as main card, and be done with the stack-in-card or vertical-stack-in-card custom cards, which all have their specific needs.
type: entities
entities:
- type: custom:hui-element
card_type: markdown
style: |
ha-card {
box-shadow: none;
margin: -16px -16px 0px -16px;
}
content: >
# <font color = {{states('sensor.trash_color')}}>Afvalwijzer</font>
<ha-icon icon= {{'mdi:delete-alert' if states('sensor.saver_trash_today') != 'Geen' else 'mdi:delete-outline'}}> </ha-icon> Vandaag, {{states('sensor.vandaag')}}: <font color= {{states('sensor.trash_color')}}>**{{states('sensor.saver_trash_today')|capitalize}}</font>**
<ha-icon icon= {{states('sensor.trash_next_icon')}}> </ha-icon> Volgende afval-ophaal over **<font color={{states('sensor.trash_next_color')}}>{{states('sensor.saver_trash_first_next_in_days')}}</font>** {{'dag' if states('sensor.saver_trash_first_next_in_days') == '1' else 'dagen'}} op:
<ha-icon icon= 'mdi:delete-alert'> </ha-icon> {{states('sensor.trash_first_next_date_formatted')}}: **<font color={{states('sensor.trash_next_color')}}>{{states('sensor.saver_trash_first_next_item')|capitalize}}</font>**
- type: custom:hui-element
card_type: horizontal-stack
cards:
- type: picture-entity
style: |
ha-card {
box-shadow: none;
margin: 0px -16px 0px -16px;
animation: {% if is_state('persistent_notification.trash_notification', 'notifying') and
states('sensor.saver_trash_today') != 'Geen' %} blink 2s linear infinite;
{% else %} none
{% endif %}
}
@keyframes blink {
100% {opacity: 0;}
}
entity: sensor.saver_trash_today
name: Vandaag
show_state: false
state_image:
'gft': /local/mijnafvalwijzer/gft3.png
'papier': /local/mijnafvalwijzer/papier3.png
'restafval': /local/mijnafvalwijzer/restafval3.png
'plastic verpakkingsafval': /local/mijnafvalwijzer/plastic3.png
'Geen': /local/mijnafvalwijzer/kliko_geen.png
- type: picture-entity
style: |
ha-card {
box-shadow: none;
margin: 0px -16px 0px -16px;
animation: {% if is_state('persistent_notification.trash_notification', 'notifying') and
states('sensor.saver_trash_tomorrow') != 'Geen' %} blink 2s linear infinite;
{% else %} none
{% endif %}
}
@keyframes blink {
100% {opacity: 0;}
}
entity: sensor.saver_trash_tomorrow
name: Morgen
show_state: false
state_image:
'gft': /local/mijnafvalwijzer/gft3.png
'papier': /local/mijnafvalwijzer/papier3.png
'restafval': /local/mijnafvalwijzer/restafval3.png
'plastic verpakkingsafval': /local/mijnafvalwijzer/plastic3.png
'Geen': /local/mijnafvalwijzer/kliko_geen.png
- type: picture-entity
style: |
ha-card {
box-shadow: none;
margin: 0px -16px 0px -16px;
}
entity: sensor.saver_trash_day_after_tomorrow
name: Overmorgen
show_state: false
state_image:
'gft': /local/mijnafvalwijzer/gft3.png
'papier': /local/mijnafvalwijzer/papier3.png
'restafval': /local/mijnafvalwijzer/restafval3.png
'plastic verpakkingsafval': /local/mijnafvalwijzer/plastic3.png
'Geen': /local/mijnafvalwijzer/kliko_geen.png
- type: custom:hui-element
card_type: custom:auto-entities
card:
type: glance
style: |
ha-card {
box-shadow: none;
margin: 0px -16px 0px -16px;
}
title: Next pickups
filter:
include:
- attributes:
next_pickup_in_days: '! none'
sort:
attribute: next_pickup_in_days
method: attribute
numeric: true
- type: divider
# style: |
# div {
# margin: 0 -16px;
# border-style: solid;
# border-width: thin;
# border-color: red;
# }
- type: custom:hui-element
card_type: custom:auto-entities
card:
type: entities
style: |
ha-card {
box-shadow: none;
margin: 0px -16px 0px -16px;
}
filter:
include:
- entity_id: sensor.*_trash_timestamp
options:
type: custom:template-entity-row
state: >
{{state_attr(config.entity,'date')}}
sort:
method: state
- type: custom:hui-element
card_type: entities
style: |
ha-card {
box-shadow: none;
margin: -16px -16px -16px -16px;
background: url('/local/mijnafvalwijzer/background.png');
background-size: cover;
}
show_header_toggle: false
entities:
- entity: automation.afval_vandaag
name: Notify vandaag
- entity: automation.afval_morgen
name: Notify morgen
- entity: input_boolean.trash_reminder
- entity: input_boolean.trash_outside
Note I do use some custom sensors and templates, but you can have a look how it is done.
Also, I use 3 pictures adding ‘Overmorgen’
didnt notice it when I posted above, but now that I did:
because of the change to the entities card listing entities, among these the horizontal stack with picture entities, the formatting went off… If you look closely you see the right picture to be larger than the other 2, the middle being smallest.
Ive tried to take out the style formatting for the 3 picture elements, and bring that 1 level up to the horizontal stack, but that doesnt work.
what does work (almost) is changing the styling to:
left image: margin: 0px 0px 0px -16px;
middle: margin: 0px -8px 0px -8px;
right image: margin: 0px -16px 0px 0px;
but even with that, there s a tiny scratch of separation visible, which I find very annoying. Especially since that wasnt the case before, so I’ll return to the previous setup.
second thing I noticed: my afvalwijzer apparently stopped ending plastic, but now does pbd… no issue of course, but just explaining why the above image shows an mdi icon (and ‘none’ ) instead of the nice button image…
nice plugin! i’am new to Home Assistant…Is it possible to add two addresses? I created a second trash.yaml (inside /packages)
changed all sensor.trash_xxx to sensor.trash_xxx_2 but that unfortunately doesnt work.
I added the top part of your code with the new hui-element but getting the following message. Any ideas?
Expected a value of type {entity,name,icon} | entity-id for entities.0.type but received "custom:hui-element".
no idea, without the full section. Note I described why I stopped the entities card using custom:ui-element cards for this setup. Couldn’t get the style for the images correct.
this it what I use:
type: custom:stack-in-card
keep:
background: 'true'
cards:
- type: custom:hui-element
card_type: markdown
content: >
# <font color = {{states('sensor.trash_color')}}>Afvalwijzer</font>
<ha-icon icon= {{'mdi:delete-alert' if states('sensor.saver_trash_today') != 'Geen' else 'mdi:delete-outline'}}> </ha-icon> Vandaag, {{states('sensor.vandaag')}}: <font color= {{states('sensor.trash_color')}}>**{{states('sensor.saver_trash_today')|capitalize}}</font>**
<ha-icon icon= {{states('sensor.trash_next_icon')}}> </ha-icon> Volgende afval-ophaal over **<font color={{states('sensor.trash_next_color')}}>{{states('sensor.saver_trash_first_next_in_days')}}</font>** {{'dag' if states('sensor.saver_trash_first_next_in_days') == '1' else 'dagen'}} op:
<ha-icon icon= 'mdi:delete-alert'> </ha-icon> {{states('sensor.trash_first_next_date_formatted')}}: **<font color={{states('sensor.trash_next_color')}}>{{states('sensor.saver_trash_first_next_item')|capitalize}}</font>**
Got someone a idea?
Hi Bert, this is not possible at the moment.
I dont know if you have managed to get it any further with auto sorting it.
I did the following :
I gave the formatted date an attribute with the date as Y M D and then sort them numeric on attribute
Example code of the template sensor:
kerstbomen_formatted:
entity_id: sensor.trash_kerstbomen
friendly_name: Kerstbomen
value_template: >
{%- set tracker_timestamp = as_timestamp(strptime(states('sensor.trash_kerstbomen'), "%d-%m-%Y")) %}
{% set months = ["Jan", "Feb", "Mrt", "Apr", "Mei", "Jun", "Jul", "Aug", "Sep", "Okt", "Nov", "Dec"] %}
{%- set wdays = ["Zo", "Ma", "Di", "Wo", "Do", "Vr", "Za"] %}
{%- set wday = tracker_timestamp | timestamp_custom('%w') | int %}
{%- set month = tracker_timestamp | timestamp_custom('%m') | int %}
{{ tracker_timestamp | timestamp_custom(wdays[wday] + ' ' '%d' ' ' + months[month-1] ) }}
attribute_templates:
Afval datum: >-
{{ as_timestamp(strptime(states('sensor.trash_kerstbomen'), "%d-%m-%Y")) | timestamp_custom("%Y%m%d") }}
ha, yes, clever! keep forgetting about the power of attribute_templates, and this certainly is a good example.
I use it like this:
restafval_trash_timestamp:
friendly_name: 'Restafval'
value_template: >
{{as_timestamp(strptime(states('sensor.saver_trash_restafval'),'%d-%m-%Y'))}}
attribute_templates:
date: >
{{as_timestamp(strptime(states('sensor.saver_trash_restafval'),'%d-%m-%Y'))|timestamp_custom('%a %d %b')}}
device_class: timestamp
only thing I still feel this integration or setup should do is leave out the ‘today’s pickup’ of the next pickups.
- type: custom:hui-element
card_type: custom:auto-entities
card:
type: glance
title: Next pickups
filter:
include:
- attributes:
next_pickup_in_days: '! none'
sort:
attribute: next_pickup_in_days
method: attribute
numeric: true
- type: custom:hui-element
card_type: custom:auto-entities
card:
type: entities
filter:
include:
- entity_id: sensor.*_trash_timestamp
options:
type: custom:template-entity-row
state: >
{{state_attr(config.entity,'date')}}
sort:
method: state
rephrase: If today has a pickup, the group of next pickups, should begin with the pickup following today’s pickup, and not include it. There’s no way I can get it to do that unfortunately. Or is there. I could maybe exclude it from the Lovelace config…? not sure if there are 4 sensors available though in the case of a pickup on the current day…
Yes that’s what I noticed yesterday on the pick up of GFT.
It was also shown in the next upcoming days of pick ups.
I’ll also have a think about this with you. When I might be on the something I will share it here ofcourse
we probably cant do it with the attribute next_pickup_in_days, but we could do it if we had the full list of pickup days, which Saver provides, but the integration doesn’t yet import.
@xirixiz would that be a FR you could allow? so we have more than the first 4 next dates created by the integration?
Of course, if the integration would import more than the first 4 dates, it could also calculate the next_pickup_in_days attribute for those. And then we could again use it in the auto-entities 
Correct the only thing now possible is to really exclude the “todays pickup type”
Meaning you would only see 2 type in the next pick up days part.
Edit:
Alho we do have trash_first_next_date and sensor.trash_first_next_item
But that would be really hard putting it altogether in the auto sorting part
the only thing now is the configuration option count_today: true but this doesn’t do what I seek.
Or really excluding the today’s date in the auto-sorting entity part in lovelace.
That would mean you would end up with missing the today's pickup type for one day completely.
That’s still an option but not a perfect one
yes that’s what I meant here:
and no, that isnt really an option since it would have to be conditional for having a todays’ pickup. And would require yet again an extra binary_sensor on which we could do that. Even so, if we had it, we wouldn’t have the next 4 dates for the various trash-types.