Homeassistant darkmode: icons invisible

[sanderlv]

I have:

• platform: afvalbeheer
  wastecollector: Avalex
  resources:
  • restafval
  • gft
  • papier
  • pmd
    postcode: XXXYY
    streetnumber: XX
    upcomingsensor: 1
    dateformat: '%d-%m-%Y'
    dateonly: 0
    name: "Avalex"
    nameprefix: 0
    builtinicons: 1
    dutch: 1

I get:

in dark mode...

[pippyn]

The icons are dark. Use
builtinicons: 0
to disable the icons. Or provide your own

[MrTheoW]

I noticed this too..
Are the icons you used in the screenshot no longer around?
Because that would be awesome for darkmode.

p.s.
You did an awesome job here! Well Done!

[sfstar]

Perhaps it's the easiest for dark mode to create an negative of the current dark icons.
In other words make the dark lines in the icons white and either:
1. Add an optional parameter that allows users to specify dark vs light mode icons.
darkmodeicons: 0/1
or
2. Detect whether the user is running dark or light mode and automatically select the correct icon color.

Although i'm not sure whether the 2nd option is even possible with the current state of frontend / core.
If either of these options are agreable I would be willing to look into creating an PR to adres this issue.
So please let me know (pippyn) if this "functionality" is something that has an chance (code quality etc willing) of being merged.

[sanderlv]

yes please that sounds nice!

[pippyn]

@sfstar The better way to go IMO (and what I have been trying) would be to implement dark/light mode independant icons, just like the mdi icons in HA. But so far I haven't found the solution to include these kind of icons in a custom component. If anyone can find me a working example that would be so great!

The second best option would be to automatically detect the current theme state and adjust the icons. I guess it would be possible to detect the current theme state on boot up, but what if the user changes the theme while running? I'm not sure we could detect that in a custom component.

And by far the least optimal solution (as you described in point 1) would be an extra option. I'm really hesitant to implement that. I've been thinking about this for quite some while now and I think we should only go this route if no other option is found.

So in conclusion: I'm always open to PR's and most of the ones I received in the past I've merged, but we should think about the best solution first.

[vikdb]

Any update on the icons?

Or any good icons to use? MDI doesn't seem to have a whole lot for garbage..

[MrTheoW]

Being the impatient a-hole that I always am. (sorry ADHD) I've created some icons as a workaround.
You can find them over here.
I'll probably add more colors or something but for now this is it.

This is how I implemented it in my Home Assistant.

type: glance
entities:
  - entity: sensor.mijnafvalwijzer_restafval
    image: https://raw.githubusercontent.com/MrTheoW/Iconstash/main/MijnAfvalWijzer/restafval-gray.png
  - entity: sensor.mijnafvalwijzer_gft
    image: https://raw.githubusercontent.com/MrTheoW/Iconstash/main/MijnAfvalWijzer/gft-gray.png
  - entity: sensor.mijnafvalwijzer_papier
    image: https://raw.githubusercontent.com/MrTheoW/Iconstash/main/MijnAfvalWijzer/papier-gray.png
  - entity: sensor.mijnafvalwijzer_pmd
    image: https://raw.githubusercontent.com/MrTheoW/Iconstash/main/MijnAfvalWijzer/pmd-gray.png
show_name: false
state_color: false

[MrTheoW]

I have changed the URL to match it's destination. Should work again now.