Skip to content

Conversation

m-e-h
Copy link
Member

@m-e-h m-e-h commented Dec 18, 2018

Description

This commit sets the p tag to inherit whatever font-size and line-height are set on the body i.e., .editor-styles-wrapper.
Currently the p tag here overrides a theme's most basic of font styles unless font-size and line-height are set on p in that theme.
And from what I've seen, being that specific on p is an uncommon pattern.

This also makes it easier and requires less specificity to style paragraphs on a per block basis by simply adding the font-size to the block container.

How has this been tested?

I see no visual changes on a fresh underscores theme with demo content.

Types of changes

Bug fix (non-breaking change which fixes an issue)

Checklist:

  • My code is tested.
  • My code follows the WordPress code style.
  • My code follows the accessibility standards.
  • My code has proper inline documentation.
  • I've included developer documentation if appropriate.

This commit sets the `p` tag to inherit whatever `font-size` and `line-height` are set on the `body` i.e., `.editor-styles-wrapper`. 
Currently the `p` tag here overrides a theme's most basic of font styles unless `font-size` and `line-height` are set on `p` in that theme.
And from what I've seen, being that specific on `p` is an uncommon pattern.

This also makes it easier and requires less specificity to style paragraphs on a per block basis by simply adding the font-size to the block container.
@chrisvanpatten
Copy link
Contributor

This should partly fix #11200, I think?

@chrisvanpatten chrisvanpatten added the [Feature] Custom Editor Styles Functionality for adding custom editor styles label Dec 18, 2018
@m-e-h
Copy link
Member Author

m-e-h commented Dec 18, 2018

Yep, I actually tried to find that ticket @chrisvanpatten but couldn't remember what it was exactly.

Looking at it now, this wouldn't directly fix that issue. The p would still choose font-size: inherit style over the one in .has-medium-font-size.

Unless a has-medium-font-size class was on one of the wrapping elements like the <div class="editor-rich-text has-medium-font-size>.

@gziolo gziolo requested review from jasmussen and kjellr February 7, 2019 13:05
@gziolo gziolo added the Needs Design Feedback Needs general design feedback. label Feb 7, 2019
@gziolo gziolo added this to the 5.1 (Gutenberg) milestone Feb 7, 2019
@gziolo gziolo requested a review from youknowriad February 7, 2019 13:06
@youknowriad
Copy link
Contributor

Worth checking with themes not providing editor styles to see if it's correct. I remember that this was originally needed because Core used to styles for the paragraphs by default but maybe this inherit technique fix the issue.

Copy link
Contributor

@kjellr kjellr left a comment

Choose a reason for hiding this comment

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

This seems solid, and should allow themes to be a little less specific in their style declarations. 👍

I tested with a number of themes: some that provided editor styles, and some that didn't. All seemed to work just fine.

@youknowriad youknowriad merged commit 3148d8c into WordPress:master Feb 8, 2019
youknowriad pushed a commit that referenced this pull request Mar 6, 2019
This commit sets the `p` tag to inherit whatever `font-size` and `line-height` are set on the `body` i.e., `.editor-styles-wrapper`. 
Currently the `p` tag here overrides a theme's most basic of font styles unless `font-size` and `line-height` are set on `p` in that theme.
And from what I've seen, being that specific on `p` is an uncommon pattern.

This also makes it easier and requires less specificity to style paragraphs on a per block basis by simply adding the font-size to the block container.
youknowriad pushed a commit that referenced this pull request Mar 6, 2019
This commit sets the `p` tag to inherit whatever `font-size` and `line-height` are set on the `body` i.e., `.editor-styles-wrapper`. 
Currently the `p` tag here overrides a theme's most basic of font styles unless `font-size` and `line-height` are set on `p` in that theme.
And from what I've seen, being that specific on `p` is an uncommon pattern.

This also makes it easier and requires less specificity to style paragraphs on a per block basis by simply adding the font-size to the block container.
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
[Feature] Custom Editor Styles Functionality for adding custom editor styles Needs Design Feedback Needs general design feedback.
Projects
None yet
Development

Successfully merging this pull request may close these issues.

5 participants