Make WordPress Core

Opened 4 years ago

Closed 2 years ago

Last modified 2 weeks ago

#56011 closed enhancement (fixed)

Twenty Twenty: Add support for Plain style in Quote block

Reported by: kajalgohel Owned by: karmatosed
Priority: normal Milestone: 6.7
Component: Bundled Theme Version: 5.9
Severity: normal Keywords: has-patch commit
Cc: Focuses: ui, css

Description

In Twenty Twenty Theme, when we add Quote block in editor side, the styles option named Plain is not reflected in front-side and editor-side. Actually the Default Styles and Plain Styles are looking same in both the side.

Steps to replicate:
1: Activate the Twenty Twenty Theme
2: Add Quote block
3: Choose Plain styles option
4: See block at editor side(block is looking same, nothing change)
5: Save Page/Post
6: View the page/post at front side

For better understanding I provide video attachment URL.
Video URL: ​https://share.cleanshot.com/iIXb2WcfmC4un0eapOgG

Thanks

Attachments (5)

56011.diff​ (2.3 KB ) - added by devtanbir 4 years ago.
#56011.patch​ (1.9 KB ) - added by kajalgohel 4 years ago.
added patch for removing border of Plain styles from Quote block
56011.border.diff​ (1.9 KB ) - added by sabernhardt 2 years ago.
only removes the border for Plain style Quote blocks
56011.border-padding.diff​ (2.0 KB ) - added by sabernhardt 2 years ago.
removes the border and sets the same value for both left and right padding (2rem, or 20px)
SCR-20240727-kdxn.png​ (100.3 KB ) - added by karmatosed 2 years ago.

Download all attachments as: .zip

Change History (15)

@devtanbir
4 years ago

This ticket was mentioned in ​PR #2830 on ​WordPress/wordpress-develop by ​MatthiasReinholz.


4 years ago
#1

  • Keywords has-patch added; needs-patch removed

Adding missing styles for block style plain.

Trac ticket: https://core.trac.wordpress.org/ticket/56011

@kajalgohel
4 years ago

added patch for removing border of Plain styles from Quote block

#2 @costdev
4 years ago

#57860 was marked as a duplicate.

#3 @karmatosed
2 years ago

  • Keywords needs-testing added

Thank you everyone. I think we can work towards getting this in as I also don't see a change in the two block styles.

  • I am curious first to check where we are getting the plain style from so we can be sure to check it.
  • Then I want to be sure which patch is the correct one - the one with or without the border.
  • After that let's get some testing.

#4 @karmatosed
2 years ago

  • Milestone Awaiting Review → 6.7

@sabernhardt
2 years ago

only removes the border for Plain style Quote blocks

@sabernhardt
2 years ago

removes the border and sets the same value for both left and right padding (2rem, or 20px)

#5 @sabernhardt
2 years ago

  • Summary Twenty Twenty: styles issue in Quote block → Twenty Twenty: Add support for Plain style in Quote block
  • Type defect (bug) → enhancement
  • Version 6.0 → 5.9

GB29856 added the Plain style, and block-library/theme.css assigns border: none (only if the theme opts in to wp-block-styles). The style's original design involved padding without the border.

To remove the border, I prefer border-width: 0 instead of border: none, just in case the block might have special border controls in the future. Both 56011.border.diff​ and 56011.border-padding.diff​ use border-width.

Padding:

  • 56011.border.diff​ keeps the current padding to avoid making a decision for other people.
  • With the lack of a difference between Default and Plain, I expect that few sites would have chosen the Plain option already. Changing the padding now likely would have little impact on existing sites' Quote blocks.
  • If the padding is edited, both the left and right padding probably should match. Then the CSS would use shorthand values instead of all four sides. In 56011.border-padding.diff​, I chose to match the current left padding on the right side and to keep the same top and bottom values (0.5rem 2rem on the front, and the pixel equivalent 5px 20px in the editor).

#6 @karmatosed
2 years ago

  • Owner set to karmatosed
  • Status new → assigned

Thank you @sabernhardt I am going to assign to myself and go through testing this now.

#7 @karmatosed
2 years ago

  • Keywords commit added

Thank you everyone, I tested this and want to move it to commit. I chose to have border-padding.diff as that looks good to me and is a good option.

#8 @karmatosed
2 years ago

  • Resolution → fixed
  • Status assigned → closed

In 58817:

Twenty Twenty: Adds Plain Style into Quote block.

Plan style was missing for the Quote block. This brings it in as should have been originally.

Props kajalgohel, devtanbir, costdev, sabernhardt.
Fixes #56011.

#9 @karmatosed
2 years ago

  • Keywords needs-testing removed

​@mukesh27 commented on ​PR #2830:


2 weeks ago
#10

Thanks for the PR, @MatthiasReinholz!

This appears to have been addressed in r58817, which already landed. Closing this PR as resolved.

If I've missed something this PR covers that the committed fix doesn't, please reopen or comment on the ticket. Happy to take another look

Note: See TracTickets for help on using tickets.