Colorize character matches in the command palette

[simurai]

Before

Only happened when switching themes, see https://github.com/atom/one-light-ui/issues/70#issuecomment-261812610.

After

Fixes https://github.com/atom/one-light-ui/issues/70

[jerone]

Have you considered a (yellow) background-color?

[thomasjo]

Have you considered a (yellow) background-color?

We don't pick colors, since that breaks the whole adaptive accent scheme. The colors are always based on the syntax theme.

Using a background color would likely look really odd, especially given that font widths are not uniform, so you'd have non-uniform width "boxes" all over the place.

[jerone]

A yellow background-color for search results is probably used most often. Sure this can conflict with some themes, but they can always override.

We don't pick colors, since that breaks the whole adaptive accent scheme. The colors are always based on the syntax theme.

Isn't accent-color part of this theme...

I can always use my own in styles.less:

.command-palette .list-group .character-match,
.fuzzy-finder .list-group .character-match {
  background-color: #ffff22;
}

[thomasjo]

If you look at the stylesheet you linked more closely, you'll notice the .ui-hue() function a few lines higher up, which ends up being computed based on @syntax-background-color.

[simurai]

Have you considered a (yellow) background-color?

For light backgrounds that would work well. It's like those yellow markers..

but yeah.. For dark maybe a bit too strong.

Could be faded, but that could also look too muddy?

Ooooor... underlines!!!

Hmmm.. So many options.. :see_no_evil:

[simurai]

ok, how about we keep the accent color so that it matches with the border color of the input. I 🎻 fiddled a bit more with the contrast.

@jerone I can always use my own in styles.less:

Yeah, feel free to customize it even further.

[simurai]

And while we're at it, let's also change the keybindings to: