View profile: clock icon for last seen is not clearly visible in dark mode

[Simon-Laux]

I think it should become white or inverted in darkmode. maybe there is a way to just give it the text color (the css variable which gets set by the theme).

[Duesenberg]

Hello,

Would it be viable to use an @if statement in the _icons.scss file?

Example, using the condition for the dark theme when lightness is less than 50. If condition is fulfilled invert the icon:

@if lightness(var(--bgPrimary)) < 50 {
img.material-icon {
filter: #{"invert()"};
}
}

If this is a good suggestion, can I add this contribution?

[Simon-Laux]

would not work, because this is run at compile time on the base styles. the themes are css files that basically set css vars, so maybe it could work inside of _themebase.scss instead.

But since it is a svg file there could be a better way to set the fill color via css, which would be more flexible, but maybe then it needs to be displayed as background with the svg as mask instead. _status-icon.scss uses this technique, although it might need additional code changes I think it would be worth it to set the color instead of inverting it.

[r10s]

svg has "currentcolor" for that, https://developer.mozilla.org/en-US/docs/Web/SVG/Attribute/color

we're using that in practise in the calendar, https://codeberg.org/webxdc/calendar/src/branch/main/index.html