Lack of color contrast in the license selected in Help > Licenses

[joaopalmeiro]

Hi! 👋

Description

In the table on the Licenses page in Help > Licenses, the font color of the selected package lacks color contrast with the background:

Reproduce

1. Go to Help > Licenses in the top menu.
2. Select a package from the license table.

Expected behavior

The font color contrasts with the background, and the background color is blue, similar to what happens in the file browser:

Additionally, the background color should not change when hovering over the selected row, similar to what happens in the file browser.

Possible solutions

To achieve this behavior, I think the table styles (e.g., .jp-RenderedHTMLCommon tbody tr:nth-child(odd)) should be applied taking into account whether the .jp-mod-selected class is present or not (in the <tr> element), similar to what happens in the file browser:

jupyterlab/packages/filebrowser/style/base.css

Line 304 in 841b339

.jp-DirListing-item:hover:not(.jp-mod-selected) {

An alternative is to update the license table styles to make them more specific:

jupyterlab/packages/help-extension/style/base.css

Line 221 in 841b339

.jp-Licenses-Grid tr.jp-mod-selected {

Current workaround for a custom theme

.jp-RenderedHTMLCommon tbody tr.jp-mod-selected:hover,
.jp-RenderedHTMLCommon tbody tr.jp-mod-selected:nth-child(even),
.jp-RenderedHTMLCommon tbody tr.jp-mod-selected:nth-child(odd) {
  background: var(--jp-brand-color1);
}

Context

• Operating System and version: macOS Sonoma 14.5
• Browser and version: Chrome 126.0.6478.127
• JupyterLab version: 4.2.3
• Python version: 3.10.13

Let me know what you think and if I can open a PR. Thanks!

[JasonWeill]

@joaopalmeiro Thank you for your contribution! Please open a PR if you have a fix for this issue.

[joaopalmeiro]

Thanks! I will work on it.