Skip to content
This repository was archived by the owner on Jun 20, 2025. It is now read-only.

Conversation

@mendezcode
Copy link

@mendezcode mendezcode commented Nov 27, 2020

Add preformatted block styles, migrating applicable styles to theme.json

Broken out of #82

Fixes #96

@mendezcode mendezcode changed the title Add preformatted block styles. Twenty Twenty One Blocks: Migrate Preformatted Block styles Nov 27, 2020
pre.wp-block-preformatted {
overflow-x: auto;
white-space: pre !important;
font-size: var(--wp--preset--font-size--extra-small);
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I think this could live in theme.json, once the block supports it. You can see how I did that for the code block: WordPress/gutenberg#27294


pre.wp-block-preformatted {
overflow-x: auto;
white-space: pre;
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I think these rules should be added to the Gutenburg block itself.

Copy link
Collaborator

@scruffian scruffian left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I don't think we need to add CSS for this block; we can move these rules to Gutenberg.

@mendezcode
Copy link
Author

mendezcode commented Nov 27, 2020

Based on the above I think we will end up with something similar to what you did for the code block...

@carolinan
Copy link
Collaborator

I have been trying to find the reason why the editor adds the white-space: pre-wrap; inline, requiring the use of !important here, but no luck.

@mendezcode
Copy link
Author

Added a Gutenberg PR to take care of this one: WordPress/gutenberg#27584

@pbking pbking added the block-based theme A theme using HTML templates label Dec 8, 2020
@scruffian
Copy link
Collaborator

I think we can close this.

@scruffian scruffian closed this Dec 9, 2020
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.

Labels

block-based theme A theme using HTML templates

Projects

None yet

Development

Successfully merging this pull request may close these issues.

Twenty Twenty-One Blocks: Migrate Preformatted Block styles

4 participants