search

openscopeproject / TrguiNG

Remote GUI for Transmission torrent daemon
GNU Affero General Public License v3.0
265 stars 32 forks source link

Improve light theme setting menu elements to improve contrast and thus visibility + typo #188

Open Pentaphon opened 2 months ago

Pentaphon commented 2 months ago

A few tweak suggestions that I got from people I recommended TrguiNG to and I happen to agree with these. Some of these people use smaller screens and 1 person has somewhat poor eyesight so these tweaks would be very helpful to them. I also would find them helpful for my 13 inch laptop that I sometimes use. I don't have these issues on the dark theme which has noticeably better contrast than the light theme so I consider these tweaks an attempt to make both themes closer together in terms of contrast.

The main reason the dark theme has better contrast is because the light theme has checkboxes and textbox outlines that are filled in with a different shade so hopefully these tweaks to the light theme will make the light theme easier to read even though the light theme doesn't have checkboxes and textbox outlines that are filled in with a different shade. There might be a better solution but these seem to work fine considering it would be hard to fill in checkboxes and textboxes with another shade on a light theme.

The light theme's settings menu needs a few tweaks:

1) The tab line that shows which tab is selected should be darkened to improve contrast to show which tab is being selected in light theme. If you actually zoom into the screenshot as I show below, the "selected" tab line seems to only fill in the bottom half of the main line so perhaps filling in 100% of the main line is sufficient? Or maybe it needs to be filled in 100% and darkened? See pic.

halfline

2) The checkbox and text box outlines could be darkened to improve contrast to make them easier to see on the light theme. 3) The update blocklist button has a typo.

Here's an image to show what I mean.

settings

qu1ck commented 2 months ago
  1. Fixed. It is supposed to have contrasting blue underline for active tab but I accidentally overrode it when I was customizing tabs for other components.
  2. This would be too invasive to change all outlines of all inputs of the UI lib I use. Contrast could be better but it's not bad. Maybe I'll revisit this when I migrate to mantine v7 which I plan to do in this release cycle.
  3. Fixed. Not a typo, just a label too wide for the space and your system font.