[wp-trac] [WordPress Trac] #56075: Twenty Twenty-One: Link color issue coming in front-end and backend side

[WordPress Trac]

#56075: Twenty Twenty-One: Link color issue coming in front-end and backend side
---------------------------+---------------------
 Reporter:  aezazshekh     |       Owner:  (none)
     Type:  defect (bug)   |      Status:  new
 Priority:  normal         |   Milestone:  6.1
Component:  Bundled Theme  |     Version:
 Severity:  normal         |  Resolution:
 Keywords:  has-patch      |     Focuses:  css
---------------------------+---------------------
Changes (by sabernhardt):

 * keywords:  needs-patch => has-patch
 * milestone:  Awaiting Review => 6.1


Comment:

 Possible workaround for the reported use case: Create a Group block with a
 background color and the desired text color, then insert content within
 that Group. You could set the padding to zero, and the background color
 could match the body background.

 The link color should not match the text color in ''all'' paragraph blocks
 (unless/until the user can set it that way). In fact, a comment in the
 stylesheet notes that the theme overrides `color: inherit`.

 {{{
         // Override `color: inherit` from Core styles.
         &.has-text-color a {
                 color: var(--wp--style--color--link, var(--global--color-
 primary));
         }
 }}}

 However, when ''other'' blocks have a background, the link color matches
 the text. On the front end, `p.has-text-color a` is slightly more specific
 than `.has-background a` and therefore the paragraph text color does not
 apply to links within it, as the color does in the editor.

 {{{
 p.has-text-color a {
   color: var(--wp--style--color--link, var(--global--color-primary));
 }
 .has-background a, .has-background p, .has-background h1, .has-background
 h2, .has-background h3, .has-background h4, .has-background h5, .has-
 background h6 {
   color: currentColor;
 }
 }}}

 [attachment:"56075.1.diff"] adds `currentColor` to the paragraph block
 styles to correct this on the front end (without affecting the editor
 styles).

-- 
Ticket URL: <https://core.trac.wordpress.org/ticket/56075#comment:3>
WordPress Trac <https://core.trac.wordpress.org/>
WordPress publishing platform