Make WordPress Core

Opened 4 years ago

Closed 9 months ago

#49892 closed defect (bug) (fixed)

Twenty Sixteen: Gutenberg Button block do not overwrite theme style

Reported by: thetwentyseven2727's profile thetwentyseven2727 Owned by:
Milestone: 6.0 Priority: normal
Severity: normal Version: 5.4
Component: Bundled Theme Keywords: has-screenshots
Focuses: css Cc:

Description

CSS style from: wp-block-library-theme | wp-includes/css/dist/block-library/theme.min.css

.entry-content .wp-block-button__link {
    background: #1a1a1a;
    color: #fff;
}

CSS style from: twentysixteen-block-style | wp-content/themes/twentysixteen/css/blocks.css

:root .has-vivid-cyan-blue-to-vivid-purple-gradient-background {
    ~~background: linear-gradient(135deg,#0693e3,#9b51e0);~~
}

Example:

Attachments (2)

before.png (200.9 KB) - added by thetwentyseven2727 4 years ago.
Before
after.png (205.6 KB) - added by thetwentyseven2727 4 years ago.
After

Download all attachments as: .zip

Change History (5)

@thetwentyseven2727
4 years ago

Before

@thetwentyseven2727
4 years ago

After

#1 @thetwentyseven2727
4 years ago

  • Keywords needs-testing removed

#2 @sabernhardt
2 years ago

  • Keywords needs-patch added; 2nd-opinion removed
  • Milestone changed from Awaiting Review to Future Release

Welcome and thanks for the report!

Yes, .entry-content .wp-block-button__link overrides the gradient backgrounds from the editor stylesheet (when the block is in the post content).

r44200 switched the background and text color styles from .wp-block-button .wp-block-button__link to .entry-content .wp-block-button__link within blocks.css.

I think reducing that selector to .wp-block-button__link might be better.

Last edited 2 years ago by sabernhardt (previous) (diff)

#3 @sabernhardt
9 months ago

  • Keywords needs-patch removed
  • Milestone changed from Future Release to 6.0
  • Resolution set to fixed
  • Status changed from new to closed

This was done on #55167 / [52926].

Note: See TracTickets for help on using tickets.