Gutenberg: Predefined Font Sizes

[bgardner]

Currently the Gutenberg editor allows users to specify text sizes: S, M, L, XL

As discussed here, similar to theme colors, it would be great if themes could set those sizes.

Worth nothing that classes are output for each option:

.is-small-text {}
.is-medium-text {}
.is-large-text {}
.is-larger-text {}

If custom font size is used, output is inline style.

[samikeijonen]

I still see this issue.

• Add new paragraph block.
• Set Custom Size to L.
• It adds inline style style="font-size: 36px;".

What it should do is add class is-large-text so that it would respect what theme wants.

In Core block these happens to be the same font sizes:)

p {
	&.is-small-text {
		font-size: 14px;
	}

	&.is-regular-text {
		font-size: 16px;
	}

	&.is-large-text {
		font-size: 36px;
	}

	&.is-larger-text {
		font-size: 48px;
	}
}

[samikeijonen]

Ups wrong repo!

Here is the Gutenberg issue.

[bgardner]

Related: https://wordpress.org/gutenberg/handbook/extensibility/theme-support/#block-font-sizes

[nickcernis]

Font sizes are now implemented and tested (back end on left, front on right):

https://demo.studiopress.com/genesis-sample-beta/gutenberg/

[stinkykong]

Are there any recommended guidelines for setting theme font sizes relative to default paragraph size? I see in Genesis Sample default is halfway between M and L. Would users expect M to be same as default? I'm undecided.

[nickcernis]

@stinkykong The default name for 'M' is 'regular' in the editor-font-sizes theme support, which does imply it's intended to be the same as the default. That's not enforced, though, and I haven't seen a consensus on this either yet.

It's fine to have M differ from the default, in my view. It seems redundant to duplicate the regular font size under another name, and it gives people an extra size option. They can still click reset to restore the default. I'm interested in any other views on this, though.