.is-style-squared css error

[ryentzer]

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;
}

[desrosj]

#51195 was marked as a duplicate.

[desrosj]

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.

[ryentzer]

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.

[SergeyBiryukov]

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

[ryelle]

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.