WordPress / twentytwentytwo

Twenty Twenty-Two, the default WordPress theme that will launch with WordPress 5.9.
404 stars 92 forks source link

[Quote]: Border issues #278

Closed dashkevych closed 2 years ago

dashkevych commented 2 years ago

Describe the bug The theme includes the following settings for the Quote block in theme.json:

"core/quote": {
  "border": {
    "width": "0 0 0 1px"
  }
}

It works great in a default block layout (with left alignment). However, issues appear when changing alignment from left to right.

To Reproduce Steps to reproduce the behavior:

  1. Add Quote block to the post.
  2. Keep default alignment.
  3. Add another Quote block to the post.
  4. Change text alignment to right in the 2nd Quote block.
  5. See issue.

Expected behavior The block should have the same styling, except the location of a side border, when setting either left alignment or right alignment.

Screenshots

Website (different border width):

website_preview

Editor (missing a side border):

editor_preview
kjellr commented 2 years ago

Thanks, @dashkevych! I've opened an upstream issue for Gutenberg to either make the front-end match the editor, or to enable a more flexible way to set the border width via theme.json.

I'll keep an eye on that, and will adjust Twenty Twenty-Two if necessary.