Coordinated datalist and highlight colors for search, effects, appear…

[DivyaPrabhakar]

Refers to issue #3628 and #3739

All the dialogs should have the same background colors and outlines:

Final datalist dialog:

Final keyboard shortcut dialog:

Final export dialog:

Final introduction screen dialog:

[placegraphichere]

So the var we're using is for "text highlighting". But in this instance we are trying to set the color of the text itself. I think we need a new color for the text: color.

The contrast for the background color on datalists is also problematic trying to find a color that suits the darker color but is useful elsewhere in the app for that color theme.

I'll add some more info on this shortly.

[DivyaPrabhakar]

@placegraphichere When you hover over datalist options, isn't that highlighting the text? I am confused about what you mean by we are "setting the color of the text" -- can you explain?

[iwehrman]

I think this is on @placegraphichere's plate currently, so assigning to him.

[iwehrman]

The main blocker is that the search bar is not correctly positioned in this branch. It seems to be positioned in the middle of the screen instead of in the middle of the canvas:

[iwehrman]

Colors look great. Back to @DivyaPrabhakar to fix the positioning issue.

[iwehrman]

I've amended the commit to fix the positioning problem, which I think was due to repeated transform rules. I think this is ready to merge, but I'm unassigning myself so that someone else can double-check it.

[placegraphichere]

I'm still seeing the gap between the bar and edge of the hovered item and the search input. I thought we got this sorted, but it's still not. I believe this is due to the overall dialog positioning being on a half px.

It'd be great to just round this position to a whole px. Otherwise, this is all great stuff.

[placegraphichere]

So on a retina, if you just resize the app frame to be slightly smaller on an odd pixel (1907x 1178 was what I resized it to), usually you'll see this occur. If it's full screen, it will look correct.

[iwehrman]

AFAICT this is back in @DivyaPrabhakar's court.

[iwehrman]

FWIW, I can't repro this issue. I tried to get the window as close as possible to the resolution that @placegraphichere suggested, but it still looks good to me.

[ktaki]

Tried with various resolutions and app windows sizes on MacBook Pro retina. I do not see the gap @placegraphichere mentioned either.

[DivyaPrabhakar]

@placegraphichere Can you can sign off on the changes to the keyboard shortcut dialog? After that, I can offer this PR up to the team so someone can review and merge it.

[DivyaPrabhakar]

@volfied style changes made

[iwehrman]

LGTM!