MAINT - Style fixes following design system implementation

[trallard]

I am opening this issue as a way to track little nags here and there that were missed through some of the accessibility-related PRs merged recently (i.e., #1174 and #1353)

Note
Click on the "Sample images" expandable component to see sample screenshots

If anyone encounters other nags, feel free to add to this issue or conversation 🙌🏽 feedback is always welcome!

Identified nags

• Option lists style should align with inline code style

  Sample images

  Inline code styling:
  

  Option lists styling:
  

• Table of Contents: fix the link underline decoration so that it is not applied to the gap between the icon and text

  Sample images

  Table of contents icon + link:
  

  An icon + link example in text:
  

• Fix focus visible state of clickable cards - currently, the focus-visible box only appears around the bottom of the card

  Sample images

  

• Light theme only: Fix colour contrast for links on deprecation admonitions (should be fixed by using the same shade of teal as we do in the inline code links --pst-color-inline-code-links) - also note for @trallard to check: version added and version changed variants

  Sample images

  

[jorisvandenbossche]

Another detail that I noticed:

The version dropdown is using a blue color for highlighting the "currently selected" version, while I would expect it to use the primary teal for that? (since other navigation elements use that for the current section):

(although inspecting with the browser, I see the color that is being used for this in the dropdown is --pst-color-info, so that's maybe intentional?)

[trallard]

Thanks @jorisvandenbossche - I remember seeing this and leaving the colour as it was defined. But I agree it would be best to align with the rest of the theme's styles.

[drammock]

agree, that is a mistake, it should be --pst-color-primary. Personally I also find it confusing to have "stable" highlighted in green (regardless of whether you're viewing stable docs or not) and would like to revisit that decision.

[trallard]

I am not sure if there is some historical reason for the stable version to be differentiated. But as the current style is; it is confusing and does break our current approach to indicate current/active items.

Also if the version warning banners get implemented these would provide a more visible way to signal folks are not on the stable version of the docs.

[trallard]

Adding more info here for completeness, it seems that something changed between the last batch of comments and what is currently in our main branch:

• now we have a mismatch between naming latest vs dev these should be identical to avoid confusion
• the blue colour from dev was removed so there is no indicator that this is the current selection

[gabalafou]

Fix focus visible state of clickable cards - currently, the focus-visible box only appears around the bottom of the card

Once #1549 is merged to main (it's currently merged into a feature branch), this will be fixed