morning4coffe-dev / storylines

Storylines is a modern text editor for writing stories divided into chapters.
https://www.microsoft.com/store/apps/9PN77P9WJ3CX
MIT License
79 stars 4 forks source link

Color inconsistency by default #10

Open ghost opened 2 years ago

ghost commented 2 years ago

While using the app (especially in the dark theme), I began to notice some color inconsistencies and color accessibility issues for people with visual or color perception disabilities. By default app uses too faded accent color in the dark theme, which is probably intended for the light theme and looks good there. In the settings there is an option to choose your own accent color, but if the user wants a white or black accent color, he is deprived of the distinctive color elements.

Below I'll give a few examples that I have noticed:

Title Bar
Dialogs
Dialog Background
CheckBoxes

Thus, at least the dark theme needs improvement. Default accent color for dark theme can be changed by increasing the contrast or making it white in some places (such as text). In addition, dark text on the accent color can be left either by increasing the contrast of this color, or needs to change the color to white, because black is harder to read.

There are probably such problems elsewhere, but that's just what I saw. 👀

morning4coffe-dev commented 2 years ago

Thank you for pointing out this issue. I have noticed some of them myself just a few days ago.

About the "Title Bar": I may add an option to the setting to switch to white text.

About the "Dialogs and CheckBoxes": the issue here is that those are the default ones, so I will see what I can do with that. Maybe use a lighter SystemAccentColor in their style. (Maybe something like the in the new Clock App? - picture bellow)

Design of dialog window in the new Windows 11 Clock App

About the "Dialog background": this is a bug and I have successfully managed to replicate this issue.

ghost commented 2 years ago

I think if some elements cannot be changed because they are part of the WinUI, at least using a different accent color palette for the dark theme should improve the readability. In fact, this is exactly what you gave in the example.

Don't rush to add a setting to switch the title bar text to white, because if you change the accent color for a dark theme, it can become well readable. Needs to play around with it a little bit. 🎨