Make WordPress Core

Opened 11 months ago

Closed 9 months ago

#58618 closed defect (bug) (duplicate)

Twenty Twenty: Pullquote block does not have default border width in editor

Reported by: iamfarhan09's profile iamfarhan09 Owned by:
Milestone: Priority: normal
Severity: normal Version: 5.9
Component: Bundled Theme Keywords: has-patch
Focuses: ui, css Cc:

Description

Hello,
I would like to report an issue with the Pullquote widget in the WordPress editor. The border applied to the Pullquote widget does not appear correctly on the editor side.

Steps to reproduce the issue:

  1. Activate the Twenty Twenty theme.
  2. Insert a Pullquote widget.
  3. Add some text within the Pullquote.
  4. Apply a border to the Pullquote.
  5. Check the editor side to see the border not displayed.

Expected behavior:
The border applied to the Pullquote widget should display correctly on the editor side, matching the specified border size.

Actual behavior:
On the editor side, the border does not appear as expected. It seems that there is a CSS rule overriding the border style, causing it to display as "border:none;". This issue affects the default border style.

I have created a video demonstrating the issue for better understanding. You can view it at the following URL:https://drive.google.com/file/d/1dD3XRo9PIWY58GLzr9EZsu7Syp9Tgsu9/view

Attachments (2)

58618-editor-style-block.css.diff (1.6 KB) - added by iamfarhan09 11 months ago.
58618-editor-style-block.css.2.diff (1.2 KB) - added by iamfarhan09 11 months ago.

Download all attachments as: .zip

Change History (4)

#1 @sabernhardt
11 months ago

  • Component changed from General to Bundled Theme
  • Focuses ui css added
  • Severity changed from critical to normal
  • Summary changed from Twenty Twenty - Pullquote Widget Border Issue on Editor Side. to Twenty Twenty: Pullquote block does not have default border width in editor
  • Version changed from 6.2.2 to 5.9

Thanks for the report! I changed the version number because the border setting was not available until WordPress 5.9.

I think removing border: none without adding the border-style would be better. The block has a default border style when the block has a border width, which Twenty Twenty overrides in the editor.

html :where([style*="border-width"]) {
	border-style: solid;
}

Twenty Twenty's border removal goes back to the initial commit, when it removed the block's top and bottom borders. Those borders have not been in the editor since WordPress 5.8. If supporting the older versions is important, however, the editor-style-block CSS probably could keep border: none and add something like this:

.wp-block-pullquote[style*="border-width"] {
	border-style: solid;
}

#2 @poena
9 months ago

  • Milestone Awaiting Review deleted
  • Resolution set to duplicate
  • Status changed from new to closed

Duplicate of #55974.

Hi, I am closing this as a duplicate of https://core.trac.wordpress.org/ticket/55974.

Note: See TracTickets for help on using tickets.