Make WordPress Core

Opened 4 years ago

Closed 4 years ago

#51194 closed defect (bug) (invalid)

.is-style-squared css error

Reported by: ryentzer's profile ryentzer Owned by:
Milestone: Priority: normal
Severity: normal Version:
Component: Editor Keywords:
Focuses: css Cc:

Description

When working through my own theme skeleton with the themeunittestdata.wordpress.xml, I came across the buttons section. The css for the square button is incorrectly applied. If you compare the selectors of is-style-squared to is-style-outline, you should see the problem.

Both is-style-squared and is-style-outline:

.wp-block-button.is-style-squared,
.wp-block-button__link.wp-block-button.is-style-squared {
  border-radius: 0;
}
.wp-block-button.is-style-outline .wp-block-button__link,
.wp-block-button__link.is-style-outline {
  color: #32373c;
  background-color: transparent;
  border: 2px solid;
}

Corrected is-style-squared:

.wp-block-button.is-style-squared .wp-block-button__link,
.wp-block-button__link.is-style-squared {
  border-radius: 0;
}

Change History (6)

#1 @desrosj
4 years ago

#51195 was marked as a duplicate.

#2 @desrosj
4 years ago

  • Component changed from General to Build/Test Tools
  • Milestone Awaiting Review deleted
  • Resolution set to invalid
  • Status changed from new to closed
  • Version 5.5 deleted

Hi @ryentzer,

Welcome to Trac!

The theme test data you reference is not an officially supported resource. Please open an issue over on the project's GitHub.

If I am misunderstanding the report and this CSS is being added by the block editor, a ticket over on the Gutenberg repository is the right place for that bug report.

#3 @ryentzer
4 years ago

  • Resolution invalid deleted
  • Status changed from closed to reopened

The css is coming from wp-includes/dist/block-library/style.min.css

The incorrect styling occurs on lines 105-107 of the style.css in the above mentioned location.

#4 @SergeyBiryukov
4 years ago

  • Component changed from Build/Test Tools to Editor
  • Milestone set to Awaiting Review

Thanks for the follow-up, it makes the report a bit clearer :) Moving to the Editor component.

This ticket was mentioned in Slack in #core-css by ryelle. View the logs.


4 years ago

#6 @ryelle
4 years ago

  • Milestone Awaiting Review deleted
  • Resolution set to invalid
  • Status changed from reopened to closed

Hi @ryentzer, the CSS you're referencing comes from the button block in Gutenberg, you can see it at the source here. Since this is an issue in Gutenberg, please open an issue over on the Gutenberg repository.

Note: See TracTickets for help on using tickets.