Twenty Nineteen: Theme block styles are not applied to blocks in the widget area

[poena]

Twenty Nineteen adds extra styling for some blocks, but on the front, the styles use
the class names .entry .entry-content as part of the selector:

.entry .entry-content .wp-block-button .wp-block-button__link:not(.has-background) {
  background-color: #0073aa;
}

So the styles are applied in the post content area, but not applied to blocks placed in the widget area.

The blocks in the widget area on the front does not match what is in the widget admin screen.

[poena]

The button block in the widget area, on the front of the site

[poena]

The button block in the widget area, on the widget admin screen

[ajmcfadyen]

Editor footer widget styles twentynineteen theme

[ajmcfadyen]

Twentynineteen theme footer button widget styles bug

[karmatosed]

Adding the keyword to get testing on this, thank you.

[poena]

@sabernhardt @karmatosed Hi!
In your opinion, what would be the preferred solution for making sure that the theme block styles are applied to blocks in the widget area, not only the post content?

• Apply the styles by adding a selector with .widget-area
• Removing .entry .entry-content selector

Relevant files:
https://core.trac.wordpress.org/browser/branches/6.6/src/wp-content/themes/twentynineteen/sass/blocks/_blocks.scss#L127

https://core.trac.wordpress.org/browser/branches/6.6/src/wp-content/themes/twentynineteen/inc/color-patterns.php#L70

[sabernhardt]

I have not tried to implement any of these, but I can share my preferences for the concepts.

1. If .entry .entry-content can be removed without changing the post content's appearance, that would be my preference. However, those styles may need a higher specificity to override something.
2. If the selectors need higher specificity but one class is enough, I would suggest replacing .entry .entry-content with .site. The color patterns function uses .entry .button (without .entry-content), which suggests that that needed one extra class to override a selector.
3. If it needs two class-level selectors, :root .site might work.
4. Hopefully the stylesheet would not need to copy all of those selectors with a .widget-area variation.