theme: add starlight

[eemilhaa]

Hi! This is a higher contrast, usability-focused theme. It uses the colors of the Starlight ansi color palette that is designed with accessibility and usability as a priority.

My use case with this theme is to have a dark theme that still maintains readability in brighter ambient light and allows for less monitor brightness.

Below are a couple design choices I've made that differ from many other bright themes already in Helix:

• Fewer highlighting scopes: Keep scopes (and colors) distinguishable
• Even brightness: I've avoided big differences in brightness to keep all scopes readable even in bright light
• UI should be readable too: All selections and cursors are very visible, and differentiating between primary and secondary selections should be easy

[saccarosium]

I would suggest to make whitespace color the same as the indent guide to make it less intrusive on the eyes.

"ui.virtual"                = "dark-fg"
"ui.virtual.ruler"          = { bg = "medium-bg" }
+ "ui.virtual.whitespace"   = "indent"
"ui.virtual.indent-guide"   = "indent"

Before	After

[eemilhaa]

Thanks for testing this! I do agree that aesthetically the dim whitespace looks better. However, I would not want to decrease its brightness, since the point of this theme is readability. My thought process is that If a UI element is enabled, it should be clearly visible (within reason, of course).

Also, the current relative brightness of whitespace is pretty much in line with some other brighter themes (for example dark plus, monokai, molokai) so I don't think it's exceedingly bright.

[saccarosium]

However, I would not want to decrease its brightness, since the point of this theme is readability

I get your point but, readability is about make stand out more the important stuff. Currently the whitespace color is very similar, in brightness and shade, to the foreground color. This makes the two the same level of importance, in terms of visual hierarchy. And this is a bad thing since we are trying to make the code stand out more and not the whitespace. Also in a file tents to be a lot of whitespaces; that will produce a lot of visual noise, that will hurt readability.

To prove this, set your display to black and white (commonly used tactic to test the accessibility of a design) and open whatever file you want.

Result

or simply open a markdown file.

Result

My eyes, as they are parsing throw the text, do a lot of work to try distinguish what to focus on.

My thought process is that If a UI element is enabled, it should be clearly visible (within reason, of course).

Yes, but not all UI elements have the same weight and whitespaces aren't as important as the text itself.

Also, the current relative brightness of whitespace is pretty much in line with some other brighter themes (for example dark plus, monokai, molokai) so I don't think it's exceedingly bright.

Ok, but those theme don't have the goal of readability and accessibility. Also I've open a PR to change the dark_plus whitespace color for the same reason.

[eemilhaa]

I agree on the visual noise.

With my testing, whitespace characters become impossible to see in bright conditions if they are much dimmer. But, if their brightness hurts usability, then I agree that's a larger issue.

I personally never use whitespace rendering, so feedback from others is very welcome on this. As you obviously do use the feature, I think your input is valid.

If someone has opinions on this, feel free to comment! If no one else feels strongly about this, I'll dim the whitespace.

I'll convert this pr into a draft for a couple of days.

[mlemesle]

Hey there @eemilhaa !
Very nice theme ! What do you think about adding one more color, like light purple or something to nuance a bit more some elements like enum variants, macros, builtin constants etc ?

[eemilhaa]

@mlemesle Hi! I'm pretty set on the syntax scopes as they are. I'd rather not add more colors since I'm already using all of the colors in the starlight palette (well technically I don't use red in syntax, but I've made that choice due to its lower brightness).

[mlemesle]

@eemilhaa I undersand, thanks !

[eemilhaa]

Whitespace is now dimmer (uses the indent color instead of dark foreground). Also tweaked the indent color to be the exact dark-gray from starlight.