Fix Github Light and Pitaya Smoothie contrast color bugs

[steff456]

Fixes #59

This PR,

• Fixes the issues found in the Pitaya Smoothie and Github Light themes.

Here are some screenshots on how the current themes look,

Github Light

• The active tab colour is noticeable
• Hover background (menu) has enough contrast against the background colour
• Colours in the kernel/tab manager sidebar
• Active indicator on the search bar
• Toggle background is noticeable in the status bar

Pitaya Smoothie

• Icons have enough contrast against the background
• Active indicator on the search bar

[github-actions]

👈 Launch a binder notebook on branch Quansight-Labs/jupyterlab-accessible-themes/fix-themes
_{Comment updated on 2023-07-05T19:03:54.853Z}

[gabalafou]

Great work, Stephannie! I understand that twiddling the CSS values is tricky, rinse-and-repeat kind of work!

I just have one question. Does this PR fix all of the issues identified in the corresponding #59 or only some of them? I'm confused because some of the tasks in #59 are checked off but some are not.

[steff456]

This PR addresses all the issues in #59 for Github Light and Pitaya Smoothie. I made the changes of Github Dark in the PR #53.

Hope this clarifies!

[gabalafou]

Sure, thanks! Who is going to be responsible for checking off the tasks in issue #59?

Maybe also the title of the PR should be renamed to "Fixes for Pitaya Smoothie and Github Light." I understand that it says this already in the description, but right now the PR title is really generic.

[steff456]

Who is going to be responsible for checking off the tasks in issue #59?

If we agree on the changes that I made for fixing them, I could check them once this PR is merged.

[trallard]

Disagree - changes should be checked BEFORE merging not the other way around

[trallard]

For example there is one that was not checked off for the dark theme as when I did the review I noticed the fix did not fix the colour contrast issue

[steff456]

So the reviewer should be the one checking off in the original issue

[trallard]

Or you provided you tested / verified the changes and they meet the contrast requirements. Which IMO is part of doing the fix.

[steff456]

I added the screenshots to the description of this PR, I will update it with the contrast that every pair has. Hope that helps with the review!

[steff456]

With the latest changes, here are the screenshots of every change with its contrast check. (I already updated the issue as well)

Github Light

• The active tab colour is noticeable.

Blue line and text have enough contrast against the background color

• Hover background (menu) has enough contrast against the background colour

Gray background with white text

White background with gray hover color

• Colours in the kernel/tab manager sidebar

• Active indicator on the search bar

• Toggle background is noticeable in the status bar

Light gray background has enough contrast with toggle background

Toggle has enough contrast

Pitaya Smoothie

• Icons have enough contrast against the background

Non-selected,

Selected,

• Active indicator on the search bar

[github-actions]

👈 Launch a Binder on branch Quansight-Labs/jupyterlab-accessible-themes/fix-themes

[github-actions]

👈 Launch a Binder on branch Quansight-Labs/jupyterlab-accessible-themes/fix-themes

[trallard]

I am going to merge this as it seems ok after a quick review and I suppose users might raise issues later