Circle controls don't play nice with white accent color
Opened this issue · 2 comments
Fluidd Version
v1.27.1
Browser
Chrome
Device
Desktop PC
Operating System
Linux
What happened
With a white accent color, parts of the circle controls are unreadable.
Homed:
Not homed:
What did you expect to happen
All elements of the controls remain readable
How to reproduce
- Set color scheme to
rgb(255, 255, 255) - Enable circle controls
Additional information
Setting the font to black if the background is bright enough might be an option.
Not entirely sure how to implement this - maybe by converting the background color to HSL, and setting a threshold for the lightness value at which the text color is changed?
edit: seems like this can be done purely in CSS - cool!
Hi @NyxCode, thank you for reporting this issue.
I can indeed reproduce the problem and will try to somehow improve the situation; however, I have a feeling this will always be a bit of a problem when using colors near white or black...
@pedrolamas Yeah, no pressure, this is not a dealbreaker for me.
I did attempt to fix it, but I got a bit overwhelmed by all the vuetify classes. Any css-only approach wont work, since they rely on having the colors in HSL. One approach might be to calculate the text color for a background of the accent color, store that in a css variable in JS, and use it in the styling.