WordPress / wporg-parent-2021

21 stars 11 forks source link

Styles: Add underline to default link style. #87

Closed ryelle closed 1 year ago

ryelle commented 1 year ago

I noticed in https://github.com/WordPress/wporg-main-2022/issues/268#issuecomment-1586557246 that the design appears to have underlines on links by default, but our parent theme removes those. Links in post content are underlined, but in the main theme we don't use post content blocks. On Documentation, there's a rule to add underlines to keep things consistent, but if this is merged we can probably remove that.

This only affects default link styles — buttons, links in navigation menus, and styled links (like the list pattern) are not affected.

Screenshots

Note that the homepage before screenshot shows the banner link not-underlined, that's because I actually added a manual underline to it on production, which was removed for testing this PR.

Before After
before-home after-home
before-download after-download
before-about after-about
before-about-reqs after-about-reqs
before-docs after-docs

How to test the changes in this Pull Request:

  1. Spin up any of the child theme sites (main, documentation, etc)
  2. Check that default links have underlines, and that the underlines disappear on hover.
StevenDufresne commented 1 year ago

On the downloads page, Releases, Nightly, Counter, Source are not underlined. Should they be? Relevant code.

jasmussen commented 1 year ago

Let's find the balance that is consistent, I recognize there's a lack of a system so I'll make sure we discuss this in a chat too. E.g. to @StevenDufresne's point. I.e. these 4 blue links should remain as they are:

Screenshot 2023-06-13 at 11 13 50

Same with breadcrumbs in the incoming designs, where you'll note some of the list items are also not underlined:

Screenshot 2023-06-13 at 11 16 00

I'll return!

ryelle commented 1 year ago

On the downloads page, Releases, Nightly, Counter, Source are not underlined. Should they be? these 4 blue links should remain as they are:

They are not underlined, because navigation menu links remove the underlines (it's a core block style). You can see in the "after" screenshot that they are not underlined.

Same with breadcrumbs in the incoming designs, where you'll note some of the list items are also not underlined:

I think we're good, as this is the default state. In these other cases (nav menus, breadcrumbs, etc) we can override that because there are other contextual clues that this is a link. For example, if there was a link in that paragraph under Tutorials, it should have an underline, to differentiate it from the rest of the text (because the blueberry/charcoal contrast is only 2.9, and it needs to be 3.0+ if color alone).

ryelle commented 1 year ago

I proactively removed links from the post navigation & site title in theme.json here, and after merging this I've also got a commit for wporg-mu-plugins to remove it from the breadcrumbs & table of contents.