dark mode: Style link colors in both dark and light modes in polymer plugins. #5318
Conversation
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
stephanwlee
approved these changes
Sep 17, 2021
yatbear
pushed a commit
to yatbear/tensorboard
that referenced
this pull request
Mar 27, 2023
…plugins. (tensorflow#5318) As reported in tensorflow#5309, links in some error messages in dark mode are difficult to see. It turns out this is potentially a more general problem: there is no attempt to style any links for dark or light mode in the polymer part of the code base. Mirroring definitions for the Angular part of the code base we add --tb-link and --tb-link-visited definitions in tensorboard-color.ts. The corresponding Angular definitions can be found in: https://cs.opensource.google/tensorflow/tensorboard/+/master:tensorboard/webapp/theme/_tb_theme.template.scss We use --tb-link and --tb-link-visited in dashboard-style.ts, applying the styling for most dashboards. We use --tb-link and --tb-link-visited in the graphs and hparams dashboards, since they do not import styles from dashboard-style.ts.
dna2github
pushed a commit
to dna2fork/tensorboard
that referenced
this pull request
May 1, 2023
…plugins. (tensorflow#5318) As reported in tensorflow#5309, links in some error messages in dark mode are difficult to see. It turns out this is potentially a more general problem: there is no attempt to style any links for dark or light mode in the polymer part of the code base. Mirroring definitions for the Angular part of the code base we add --tb-link and --tb-link-visited definitions in tensorboard-color.ts. The corresponding Angular definitions can be found in: https://cs.opensource.google/tensorflow/tensorboard/+/master:tensorboard/webapp/theme/_tb_theme.template.scss We use --tb-link and --tb-link-visited in dashboard-style.ts, applying the styling for most dashboards. We use --tb-link and --tb-link-visited in the graphs and hparams dashboards, since they do not import styles from dashboard-style.ts.
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
Motivation for features / changes
As reported in Links are unreadable in the dark theme #5309, links in some error messages in dark mode are difficult to see. It turns out this is potentially a more general problem: there is no attempt to style any links for dark or light mode in the polymer part of the code base.
Technical description of changes
Mirroring definitions for the Angular part of the code base we add --tb-link and --tb-link-visited definitions in tensorboard-color.ts.
The corresponding Angular definitions can be found in:
https://cs.opensource.google/tensorflow/tensorboard/+/master:tensorboard/webapp/theme/_tb_theme.template.scss
We use --tb-link and --tb-link-visited in dashboard-style.ts, applying the styling for most dashboards.
We use --tb-link and --tb-link-visited in the graphs and hparams dashboards, since they do not import styles from dashboard-style.ts.
Dark Mode Sample:
Light Mode Sample: