Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Add defaultFontSizes theme.json (theme.json v3) #58409

Merged
merged 54 commits into from
Apr 25, 2024

Conversation

ajlende
Copy link
Contributor

@ajlende ajlende commented Jan 29, 2024

Dev Note 📝

See #58409 (comment)

What?

Reimplementation of #56661 with a proper theme.json migration.

Adds a defaultFontSizes option to disable showing the default font sizes.

When defaultFontSizes === false the options are removed from the UI.

In theme.json v3, by default defaultFontSizes is true.

In theme.json v2, defaultFontSizes isn't a valid key, but is treated as false where it would be used when a theme has font sizes defined for backwards compatibility of generated CSS.

Why?

Having an option for defaultFontSizes would give themes more control over which options are available. This option brings consistency to font sizes to match colors, gradients, duotone filters, and shadow presets.

How?

Goals are to migrate the behavior of the font sizes presets to be like other presets that can be disabled via default* settings.

Testing Instructions

Screenshots below contain example modified fontSizes JSON for TT4 to cover various cases of having font sizes and overriding default ones.

For each modified theme.json test that each step works as expected (see screenshots):

  1. Test with theme.json "version": 2. (trunk and this PR should be the same.)
  2. Update your theme.json to "version": 3. (Don't forget to update the style variations too.)
  3. Update your theme.json (again) with settings.typography.defaultFontSizes to false.

Then test custom origin styles migration.

  1. Start on trunk with a "version": 2 theme.json with no associated wp_global_styles post_types in the DB.
  2. Make changes to the global styles UI such as adding a new color.
  3. See the "version": 2 entry in the DB.
  4. Switch to this branch.
  5. Make more changes to the global styles UI such removing the color.
  6. See that the entry is updated to "version": 3 in the DB.
  7. See that "defaultFontSizes": false is not added to the entry in the DB.
  8. Update the theme's theme.json to "version": 3.
  9. Make more updates in the UI.
  10. See that "defaultFontSizes": false is still not added.

Testing Instructions for Keyboard

N/A

Screenshots or screencast

Each set of screenshots shows a different example theme.json modification to TT4.

  • v2 trunk: Screenshot of previous behavior in v2 theme.json.
  • v2: Screenshot from this branch for v2 theme.json.
  • v3 (default): Screenshot with v3 theme.json. (Should be the same as "defaultFontSizes": true.)
  • v3 false: Screenshot with "defaultFontSizes": false set in v3 theme.json.

TT4 Footnote Override

Example JSON
// Override fontSizes
// Same as TT4 with small renamed to footnote
{
	"settings": {
		"typography": {
			"fontSizes": [
				{
					"fluid": false,
					"name": "Footnote",
					"size": "0.9rem",
					"slug": "footnote"
				},
				{
					"fluid": false,
					"name": "Medium",
					"size": "1.05rem",
					"slug": "medium"
				},
				{
					"fluid": {
						"min": "1.39rem",
						"max": "1.85rem"
					},
					"name": "Large",
					"size": "1.85rem",
					"slug": "large"
				},
				{
					"fluid": {
						"min": "1.85rem",
						"max": "2.5rem"
					},
					"name": "Extra Large",
					"size": "2.5rem",
					"slug": "x-large"
				},
				{
					"fluid": {
						"min": "2.5rem",
						"max": "3.27rem"
					},
					"name": "Extra Extra Large",
					"size": "3.27rem",
					"slug": "xx-large"
				}
			]
		}
	}
}
v2 trunk v2 v3 (default) v3 false
font-sizes-v2-override-before font-sizes-v2-override-after font-sizes-v3-override-true font-sizes-v3-override-false

TT4 Custom Only

Example JSON
// Only custom fontSizes
// Same as override with only footnote and extra-extra-large
{
	"settings": {
		"typography": {
			"fontSizes": [
				{
					"fluid": false,
					"name": "Footnote",
					"size": "0.9rem",
					"slug": "footnote"
				},
				{
					"fluid": {
						"min": "2.5rem",
						"max": "3.27rem"
					},
					"name": "Extra Extra Large",
					"size": "3.27rem",
					"slug": "xx-large"
				}
			]
		}
	}
}
v2 trunk v2 v3 (default) v3 false
font-sizes-v2-custom-before font-sizes-v2-custom-after font-sizes-v3-custom-true font-sizes-v3-custom-false

TT4 Empty fontSizes

Example JSON
// Empty fontSizes
{
	"settings": {
		"typography": {
			"fontSizes": []
		}
	}
}
v2 trunk v2 v3 (default) v3 false
font-sizes-v2-empty-before font-sizes-v2-empty-after font-sizes-v3-empty-true font-sizes-v3-empty-false

TT4 Undefined fontSizes

Example JSON
// Undefined fontSizes
{
	"settings": {
		"typography": {}
	}
}
v2 trunk v2 v3 (default) v3 false
font-sizes-v2-undefined-before font-sizes-v2-undefined-after font-sizes-v3-undefined-true font-sizes-v3-undefined-false

@ajlende ajlende added [Type] Bug An existing feature does not function as intended [Feature] Typography Font and typography-related issues and PRs labels Jan 29, 2024
@ajlende ajlende self-assigned this Jan 29, 2024
Copy link

github-actions bot commented Jan 29, 2024

This pull request changed or added PHP files in previous commits, but none have been detected in the latest commit.

Thank you! ❤️

@ajlende ajlende force-pushed the fix/default-font-sizes-override branch from 37060a7 to 0333ef6 Compare January 30, 2024 16:46
@ajlende ajlende changed the title Fix defaultFontSizes override Add defaultFontSizes theme.json (v2) Jan 30, 2024
Copy link

github-actions bot commented Jan 30, 2024

Size Change: +42 B (0%)

Total Size: 1.75 MB

Filename Size Change
build/block-editor/index.min.js 256 kB +42 B (0%)
ℹ️ View Unchanged
Filename Size
build/a11y/index.min.js 955 B
build/annotations/index.min.js 2.27 kB
build/api-fetch/index.min.js 2.32 kB
build/autop/index.min.js 2.1 kB
build/blob/index.min.js 578 B
build/block-directory/index.min.js 7.26 kB
build/block-directory/style-rtl.css 1.03 kB
build/block-directory/style.css 1.03 kB
build/block-editor/content-rtl.css 4.53 kB
build/block-editor/content.css 4.53 kB
build/block-editor/default-editor-styles-rtl.css 395 B
build/block-editor/default-editor-styles.css 395 B
build/block-editor/style-rtl.css 15.5 kB
build/block-editor/style.css 15.5 kB
build/block-library/blocks/archives/editor-rtl.css 61 B
build/block-library/blocks/archives/editor.css 60 B
build/block-library/blocks/archives/style-rtl.css 90 B
build/block-library/blocks/archives/style.css 90 B
build/block-library/blocks/audio/editor-rtl.css 150 B
build/block-library/blocks/audio/editor.css 150 B
build/block-library/blocks/audio/style-rtl.css 122 B
build/block-library/blocks/audio/style.css 122 B
build/block-library/blocks/audio/theme-rtl.css 133 B
build/block-library/blocks/audio/theme.css 133 B
build/block-library/blocks/avatar/editor-rtl.css 116 B
build/block-library/blocks/avatar/editor.css 116 B
build/block-library/blocks/avatar/style-rtl.css 104 B
build/block-library/blocks/avatar/style.css 104 B
build/block-library/blocks/block/editor-rtl.css 305 B
build/block-library/blocks/block/editor.css 305 B
build/block-library/blocks/button/editor-rtl.css 415 B
build/block-library/blocks/button/editor.css 414 B
build/block-library/blocks/button/style-rtl.css 627 B
build/block-library/blocks/button/style.css 626 B
build/block-library/blocks/buttons/editor-rtl.css 337 B
build/block-library/blocks/buttons/editor.css 337 B
build/block-library/blocks/buttons/style-rtl.css 332 B
build/block-library/blocks/buttons/style.css 332 B
build/block-library/blocks/calendar/style-rtl.css 239 B
build/block-library/blocks/calendar/style.css 239 B
build/block-library/blocks/categories/editor-rtl.css 113 B
build/block-library/blocks/categories/editor.css 112 B
build/block-library/blocks/categories/style-rtl.css 124 B
build/block-library/blocks/categories/style.css 124 B
build/block-library/blocks/code/editor-rtl.css 53 B
build/block-library/blocks/code/editor.css 53 B
build/block-library/blocks/code/style-rtl.css 121 B
build/block-library/blocks/code/style.css 121 B
build/block-library/blocks/code/theme-rtl.css 124 B
build/block-library/blocks/code/theme.css 124 B
build/block-library/blocks/columns/editor-rtl.css 108 B
build/block-library/blocks/columns/editor.css 108 B
build/block-library/blocks/columns/style-rtl.css 421 B
build/block-library/blocks/columns/style.css 421 B
build/block-library/blocks/comment-author-avatar/editor-rtl.css 125 B
build/block-library/blocks/comment-author-avatar/editor.css 125 B
build/block-library/blocks/comment-content/style-rtl.css 92 B
build/block-library/blocks/comment-content/style.css 92 B
build/block-library/blocks/comment-template/style-rtl.css 199 B
build/block-library/blocks/comment-template/style.css 198 B
build/block-library/blocks/comments-pagination-numbers/editor-rtl.css 123 B
build/block-library/blocks/comments-pagination-numbers/editor.css 121 B
build/block-library/blocks/comments-pagination/editor-rtl.css 222 B
build/block-library/blocks/comments-pagination/editor.css 209 B
build/block-library/blocks/comments-pagination/style-rtl.css 235 B
build/block-library/blocks/comments-pagination/style.css 231 B
build/block-library/blocks/comments-title/editor-rtl.css 75 B
build/block-library/blocks/comments-title/editor.css 75 B
build/block-library/blocks/comments/editor-rtl.css 840 B
build/block-library/blocks/comments/editor.css 839 B
build/block-library/blocks/comments/style-rtl.css 637 B
build/block-library/blocks/comments/style.css 636 B
build/block-library/blocks/cover/editor-rtl.css 671 B
build/block-library/blocks/cover/editor.css 674 B
build/block-library/blocks/cover/style-rtl.css 1.7 kB
build/block-library/blocks/cover/style.css 1.69 kB
build/block-library/blocks/details/editor-rtl.css 65 B
build/block-library/blocks/details/editor.css 65 B
build/block-library/blocks/details/style-rtl.css 86 B
build/block-library/blocks/details/style.css 86 B
build/block-library/blocks/embed/editor-rtl.css 322 B
build/block-library/blocks/embed/editor.css 322 B
build/block-library/blocks/embed/style-rtl.css 410 B
build/block-library/blocks/embed/style.css 410 B
build/block-library/blocks/embed/theme-rtl.css 133 B
build/block-library/blocks/embed/theme.css 133 B
build/block-library/blocks/file/editor-rtl.css 326 B
build/block-library/blocks/file/editor.css 327 B
build/block-library/blocks/file/style-rtl.css 280 B
build/block-library/blocks/file/style.css 281 B
build/block-library/blocks/file/view.min.js 324 B
build/block-library/blocks/footnotes/style-rtl.css 201 B
build/block-library/blocks/footnotes/style.css 199 B
build/block-library/blocks/form-input/editor-rtl.css 227 B
build/block-library/blocks/form-input/editor.css 227 B
build/block-library/blocks/form-input/style-rtl.css 343 B
build/block-library/blocks/form-input/style.css 343 B
build/block-library/blocks/form-submission-notification/editor-rtl.css 340 B
build/block-library/blocks/form-submission-notification/editor.css 340 B
build/block-library/blocks/form-submit-button/style-rtl.css 69 B
build/block-library/blocks/form-submit-button/style.css 69 B
build/block-library/blocks/form/view.min.js 471 B
build/block-library/blocks/freeform/editor-rtl.css 2.61 kB
build/block-library/blocks/freeform/editor.css 2.61 kB
build/block-library/blocks/gallery/editor-rtl.css 956 B
build/block-library/blocks/gallery/editor.css 960 B
build/block-library/blocks/gallery/style-rtl.css 1.72 kB
build/block-library/blocks/gallery/style.css 1.72 kB
build/block-library/blocks/gallery/theme-rtl.css 108 B
build/block-library/blocks/gallery/theme.css 108 B
build/block-library/blocks/group/editor-rtl.css 647 B
build/block-library/blocks/group/editor.css 647 B
build/block-library/blocks/group/style-rtl.css 103 B
build/block-library/blocks/group/style.css 103 B
build/block-library/blocks/group/theme-rtl.css 78 B
build/block-library/blocks/group/theme.css 78 B
build/block-library/blocks/heading/style-rtl.css 189 B
build/block-library/blocks/heading/style.css 189 B
build/block-library/blocks/html/editor-rtl.css 336 B
build/block-library/blocks/html/editor.css 337 B
build/block-library/blocks/image/editor-rtl.css 878 B
build/block-library/blocks/image/editor.css 878 B
build/block-library/blocks/image/style-rtl.css 1.6 kB
build/block-library/blocks/image/style.css 1.59 kB
build/block-library/blocks/image/theme-rtl.css 133 B
build/block-library/blocks/image/theme.css 133 B
build/block-library/blocks/image/view.min.js 1.54 kB
build/block-library/blocks/latest-comments/style-rtl.css 357 B
build/block-library/blocks/latest-comments/style.css 357 B
build/block-library/blocks/latest-posts/editor-rtl.css 213 B
build/block-library/blocks/latest-posts/editor.css 212 B
build/block-library/blocks/latest-posts/style-rtl.css 478 B
build/block-library/blocks/latest-posts/style.css 478 B
build/block-library/blocks/list/style-rtl.css 88 B
build/block-library/blocks/list/style.css 88 B
build/block-library/blocks/media-text/editor-rtl.css 306 B
build/block-library/blocks/media-text/editor.css 305 B
build/block-library/blocks/media-text/style-rtl.css 505 B
build/block-library/blocks/media-text/style.css 503 B
build/block-library/blocks/more/editor-rtl.css 431 B
build/block-library/blocks/more/editor.css 431 B
build/block-library/blocks/navigation-link/editor-rtl.css 668 B
build/block-library/blocks/navigation-link/editor.css 669 B
build/block-library/blocks/navigation-link/style-rtl.css 259 B
build/block-library/blocks/navigation-link/style.css 257 B
build/block-library/blocks/navigation-submenu/editor-rtl.css 296 B
build/block-library/blocks/navigation-submenu/editor.css 295 B
build/block-library/blocks/navigation/editor-rtl.css 2.26 kB
build/block-library/blocks/navigation/editor.css 2.26 kB
build/block-library/blocks/navigation/style-rtl.css 2.26 kB
build/block-library/blocks/navigation/style.css 2.25 kB
build/block-library/blocks/navigation/view.min.js 1.03 kB
build/block-library/blocks/nextpage/editor-rtl.css 395 B
build/block-library/blocks/nextpage/editor.css 395 B
build/block-library/blocks/page-list/editor-rtl.css 377 B
build/block-library/blocks/page-list/editor.css 377 B
build/block-library/blocks/page-list/style-rtl.css 175 B
build/block-library/blocks/page-list/style.css 175 B
build/block-library/blocks/paragraph/editor-rtl.css 235 B
build/block-library/blocks/paragraph/editor.css 235 B
build/block-library/blocks/paragraph/style-rtl.css 335 B
build/block-library/blocks/paragraph/style.css 335 B
build/block-library/blocks/post-author/style-rtl.css 175 B
build/block-library/blocks/post-author/style.css 176 B
build/block-library/blocks/post-comments-form/editor-rtl.css 96 B
build/block-library/blocks/post-comments-form/editor.css 96 B
build/block-library/blocks/post-comments-form/style-rtl.css 508 B
build/block-library/blocks/post-comments-form/style.css 508 B
build/block-library/blocks/post-content/editor-rtl.css 74 B
build/block-library/blocks/post-content/editor.css 74 B
build/block-library/blocks/post-date/style-rtl.css 61 B
build/block-library/blocks/post-date/style.css 61 B
build/block-library/blocks/post-excerpt/editor-rtl.css 71 B
build/block-library/blocks/post-excerpt/editor.css 71 B
build/block-library/blocks/post-excerpt/style-rtl.css 141 B
build/block-library/blocks/post-excerpt/style.css 141 B
build/block-library/blocks/post-featured-image/editor-rtl.css 729 B
build/block-library/blocks/post-featured-image/editor.css 727 B
build/block-library/blocks/post-featured-image/style-rtl.css 342 B
build/block-library/blocks/post-featured-image/style.css 342 B
build/block-library/blocks/post-navigation-link/style-rtl.css 215 B
build/block-library/blocks/post-navigation-link/style.css 214 B
build/block-library/blocks/post-template/editor-rtl.css 99 B
build/block-library/blocks/post-template/editor.css 98 B
build/block-library/blocks/post-template/style-rtl.css 409 B
build/block-library/blocks/post-template/style.css 408 B
build/block-library/blocks/post-terms/style-rtl.css 96 B
build/block-library/blocks/post-terms/style.css 96 B
build/block-library/blocks/post-time-to-read/style-rtl.css 69 B
build/block-library/blocks/post-time-to-read/style.css 69 B
build/block-library/blocks/post-title/style-rtl.css 100 B
build/block-library/blocks/post-title/style.css 100 B
build/block-library/blocks/preformatted/style-rtl.css 125 B
build/block-library/blocks/preformatted/style.css 125 B
build/block-library/blocks/pullquote/editor-rtl.css 135 B
build/block-library/blocks/pullquote/editor.css 135 B
build/block-library/blocks/pullquote/style-rtl.css 354 B
build/block-library/blocks/pullquote/style.css 353 B
build/block-library/blocks/pullquote/theme-rtl.css 174 B
build/block-library/blocks/pullquote/theme.css 174 B
build/block-library/blocks/query-pagination-numbers/editor-rtl.css 122 B
build/block-library/blocks/query-pagination-numbers/editor.css 121 B
build/block-library/blocks/query-pagination/editor-rtl.css 221 B
build/block-library/blocks/query-pagination/editor.css 211 B
build/block-library/blocks/query-pagination/style-rtl.css 288 B
build/block-library/blocks/query-pagination/style.css 284 B
build/block-library/blocks/query-title/style-rtl.css 63 B
build/block-library/blocks/query-title/style.css 63 B
build/block-library/blocks/query/editor-rtl.css 486 B
build/block-library/blocks/query/editor.css 486 B
build/block-library/blocks/query/view.min.js 958 B
build/block-library/blocks/quote/style-rtl.css 237 B
build/block-library/blocks/quote/style.css 237 B
build/block-library/blocks/quote/theme-rtl.css 233 B
build/block-library/blocks/quote/theme.css 235 B
build/block-library/blocks/read-more/style-rtl.css 140 B
build/block-library/blocks/read-more/style.css 140 B
build/block-library/blocks/rss/editor-rtl.css 149 B
build/block-library/blocks/rss/editor.css 149 B
build/block-library/blocks/rss/style-rtl.css 289 B
build/block-library/blocks/rss/style.css 288 B
build/block-library/blocks/search/editor-rtl.css 184 B
build/block-library/blocks/search/editor.css 184 B
build/block-library/blocks/search/style-rtl.css 690 B
build/block-library/blocks/search/style.css 689 B
build/block-library/blocks/search/theme-rtl.css 114 B
build/block-library/blocks/search/theme.css 114 B
build/block-library/blocks/search/view.min.js 478 B
build/block-library/blocks/separator/editor-rtl.css 146 B
build/block-library/blocks/separator/editor.css 146 B
build/block-library/blocks/separator/style-rtl.css 239 B
build/block-library/blocks/separator/style.css 239 B
build/block-library/blocks/separator/theme-rtl.css 194 B
build/block-library/blocks/separator/theme.css 194 B
build/block-library/blocks/shortcode/editor-rtl.css 323 B
build/block-library/blocks/shortcode/editor.css 323 B
build/block-library/blocks/site-logo/editor-rtl.css 801 B
build/block-library/blocks/site-logo/editor.css 801 B
build/block-library/blocks/site-logo/style-rtl.css 204 B
build/block-library/blocks/site-logo/style.css 204 B
build/block-library/blocks/site-tagline/editor-rtl.css 86 B
build/block-library/blocks/site-tagline/editor.css 86 B
build/block-library/blocks/site-title/editor-rtl.css 116 B
build/block-library/blocks/site-title/editor.css 116 B
build/block-library/blocks/site-title/style-rtl.css 57 B
build/block-library/blocks/site-title/style.css 57 B
build/block-library/blocks/social-link/editor-rtl.css 184 B
build/block-library/blocks/social-link/editor.css 184 B
build/block-library/blocks/social-links/editor-rtl.css 676 B
build/block-library/blocks/social-links/editor.css 675 B
build/block-library/blocks/social-links/style-rtl.css 1.48 kB
build/block-library/blocks/social-links/style.css 1.48 kB
build/block-library/blocks/spacer/editor-rtl.css 350 B
build/block-library/blocks/spacer/editor.css 350 B
build/block-library/blocks/spacer/style-rtl.css 48 B
build/block-library/blocks/spacer/style.css 48 B
build/block-library/blocks/table/editor-rtl.css 395 B
build/block-library/blocks/table/editor.css 395 B
build/block-library/blocks/table/style-rtl.css 639 B
build/block-library/blocks/table/style.css 639 B
build/block-library/blocks/table/theme-rtl.css 152 B
build/block-library/blocks/table/theme.css 152 B
build/block-library/blocks/tag-cloud/style-rtl.css 251 B
build/block-library/blocks/tag-cloud/style.css 253 B
build/block-library/blocks/template-part/editor-rtl.css 431 B
build/block-library/blocks/template-part/editor.css 431 B
build/block-library/blocks/template-part/theme-rtl.css 107 B
build/block-library/blocks/template-part/theme.css 107 B
build/block-library/blocks/term-description/style-rtl.css 111 B
build/block-library/blocks/term-description/style.css 111 B
build/block-library/blocks/text-columns/editor-rtl.css 95 B
build/block-library/blocks/text-columns/editor.css 95 B
build/block-library/blocks/text-columns/style-rtl.css 166 B
build/block-library/blocks/text-columns/style.css 166 B
build/block-library/blocks/verse/style-rtl.css 99 B
build/block-library/blocks/verse/style.css 99 B
build/block-library/blocks/video/editor-rtl.css 552 B
build/block-library/blocks/video/editor.css 555 B
build/block-library/blocks/video/style-rtl.css 185 B
build/block-library/blocks/video/style.css 185 B
build/block-library/blocks/video/theme-rtl.css 133 B
build/block-library/blocks/video/theme.css 133 B
build/block-library/classic-rtl.css 179 B
build/block-library/classic.css 179 B
build/block-library/common-rtl.css 1.11 kB
build/block-library/common.css 1.11 kB
build/block-library/editor-elements-rtl.css 75 B
build/block-library/editor-elements.css 75 B
build/block-library/editor-rtl.css 12.4 kB
build/block-library/editor.css 12.4 kB
build/block-library/elements-rtl.css 54 B
build/block-library/elements.css 54 B
build/block-library/index.min.js 219 kB
build/block-library/reset-rtl.css 472 B
build/block-library/reset.css 472 B
build/block-library/style-rtl.css 14.8 kB
build/block-library/style.css 14.8 kB
build/block-library/theme-rtl.css 707 B
build/block-library/theme.css 713 B
build/block-serialization-default-parser/index.min.js 1.12 kB
build/block-serialization-spec-parser/index.min.js 2.87 kB
build/blocks/index.min.js 51.7 kB
build/commands/index.min.js 15.2 kB
build/commands/style-rtl.css 953 B
build/commands/style.css 951 B
build/components/index.min.js 220 kB
build/components/style-rtl.css 12 kB
build/components/style.css 12 kB
build/compose/index.min.js 12.7 kB
build/core-commands/index.min.js 2.77 kB
build/core-data/index.min.js 72.5 kB
build/customize-widgets/index.min.js 11 kB
build/customize-widgets/style-rtl.css 1.36 kB
build/customize-widgets/style.css 1.36 kB
build/data-controls/index.min.js 640 B
build/data/index.min.js 9 kB
build/date/index.min.js 17.9 kB
build/deprecated/index.min.js 451 B
build/dom-ready/index.min.js 324 B
build/dom/index.min.js 4.65 kB
build/edit-post/classic-rtl.css 578 B
build/edit-post/classic.css 578 B
build/edit-post/index.min.js 17 kB
build/edit-post/style-rtl.css 4.24 kB
build/edit-post/style.css 4.23 kB
build/edit-site/index.min.js 224 kB
build/edit-site/style-rtl.css 13.9 kB
build/edit-site/style.css 14 kB
build/edit-widgets/index.min.js 17.6 kB
build/edit-widgets/style-rtl.css 4.17 kB
build/edit-widgets/style.css 4.16 kB
build/editor/index.min.js 80 kB
build/editor/style-rtl.css 6.99 kB
build/editor/style.css 6.99 kB
build/element/index.min.js 4.83 kB
build/escape-html/index.min.js 537 B
build/format-library/index.min.js 8.07 kB
build/format-library/style-rtl.css 493 B
build/format-library/style.css 492 B
build/hooks/index.min.js 1.55 kB
build/html-entities/index.min.js 448 B
build/i18n/index.min.js 3.58 kB
build/interactivity/debug.min.js 16.2 kB
build/interactivity/file.min.js 447 B
build/interactivity/image.min.js 1.67 kB
build/interactivity/index.min.js 13 kB
build/interactivity/navigation.min.js 1.17 kB
build/interactivity/query.min.js 740 B
build/interactivity/router.min.js 2.79 kB
build/interactivity/search.min.js 618 B
build/is-shallow-equal/index.min.js 527 B
build/keyboard-shortcuts/index.min.js 1.3 kB
build/keycodes/index.min.js 1.46 kB
build/list-reusable-blocks/index.min.js 2.11 kB
build/list-reusable-blocks/style-rtl.css 851 B
build/list-reusable-blocks/style.css 851 B
build/media-utils/index.min.js 2.92 kB
build/modules/importmap-polyfill.min.js 12.2 kB
build/notices/index.min.js 948 B
build/nux/index.min.js 1.57 kB
build/nux/style-rtl.css 748 B
build/nux/style.css 744 B
build/patterns/index.min.js 6.47 kB
build/patterns/style-rtl.css 595 B
build/patterns/style.css 595 B
build/plugins/index.min.js 1.8 kB
build/preferences-persistence/index.min.js 2.06 kB
build/preferences/index.min.js 2.85 kB
build/preferences/style-rtl.css 710 B
build/preferences/style.css 712 B
build/primitives/index.min.js 975 B
build/priority-queue/index.min.js 1.52 kB
build/private-apis/index.min.js 1 kB
build/react-i18n/index.min.js 623 B
build/react-refresh-entry/index.min.js 9.47 kB
build/react-refresh-runtime/index.min.js 6.78 kB
build/redux-routine/index.min.js 2.7 kB
build/reusable-blocks/index.min.js 2.73 kB
build/reusable-blocks/style-rtl.css 256 B
build/reusable-blocks/style.css 256 B
build/rich-text/index.min.js 10 kB
build/router/index.min.js 1.88 kB
build/server-side-render/index.min.js 1.96 kB
build/shortcode/index.min.js 1.39 kB
build/style-engine/index.min.js 2.03 kB
build/token-list/index.min.js 582 B
build/url/index.min.js 3.74 kB
build/vendors/inert-polyfill.min.js 2.48 kB
build/vendors/react-dom.min.js 41.7 kB
build/vendors/react.min.js 4.02 kB
build/viewport/index.min.js 957 B
build/warning/index.min.js 249 B
build/widgets/index.min.js 7.23 kB
build/widgets/style-rtl.css 1.17 kB
build/widgets/style.css 1.17 kB
build/wordcount/index.min.js 1.02 kB

compressed-size-action

@ajlende ajlende changed the base branch from trunk to backport/global-styles-tests February 1, 2024 16:10
@ajlende ajlende force-pushed the fix/default-font-sizes-override branch from 0333ef6 to 0c1707f Compare February 1, 2024 16:10
Base automatically changed from backport/global-styles-tests to trunk February 2, 2024 16:32
@ajlende ajlende force-pushed the fix/default-font-sizes-override branch from 0c1707f to 561ba46 Compare February 6, 2024 17:22
Copy link

github-actions bot commented Feb 7, 2024

Flaky tests detected in ec14150.
Some tests passed with failed attempts. The failures may not be related to this commit but are still reported for visibility. See the documentation for more information.

🔍 Workflow run URL: https://github.com/WordPress/gutenberg/actions/runs/8729353311
📝 Reported issues:

@ajlende ajlende force-pushed the fix/default-font-sizes-override branch 2 times, most recently from fc92183 to 30e7c4f Compare February 7, 2024 17:01
@ajlende ajlende force-pushed the fix/default-font-sizes-override branch from df86af6 to 661f0c0 Compare February 7, 2024 20:17
@ajlende ajlende marked this pull request as ready for review February 7, 2024 20:29
Copy link

github-actions bot commented Feb 7, 2024

The following accounts have interacted with this PR and/or linked issues. I will continue to update these lists as activity occurs. You can also manually ask me to refresh this list by adding the props-bot label.

If you're merging code through a pull request on GitHub, copy and paste the following into the bottom of the merge commit message.

Co-authored-by: ajlende <ajlende@git.wordpress.org>
Co-authored-by: draganescu <andraganescu@git.wordpress.org>
Co-authored-by: scruffian <scruffian@git.wordpress.org>
Co-authored-by: gaambo <gaambo@git.wordpress.org>
Co-authored-by: youknowriad <youknowriad@git.wordpress.org>
Co-authored-by: oandregal <oandregal@git.wordpress.org>

To understand the WordPress project's expectations around crediting contributors, please review the Contributor Attribution page in the Core Handbook.

@github-actions github-actions bot added this to the Gutenberg 18.3 milestone Apr 25, 2024
@ajlende
Copy link
Contributor Author

ajlende commented Apr 25, 2024

Dev note for both #58409 and #61842 📝


Theme.json version 3

The theme.json version has been incremented in order to update the default behavior for overriding the default fontSizes and spacingSizes presets in theme.json.

Using older theme.json versions will continue to be supported and work the same as they have before. However, upgrading to version 3 is recommended when your minimum WordPress version reaches 6.6 because new development will continue in the newer versions.

See the theme.json reference for more info on migration.

settings.typography.defaultFontSizes

A new defaultFontSizes option has been added in theme.json v3. It gives control over showing default font sizes and preventing those defaults from being overridden.

The default fontSizes slugs are: small, medium, large, x-large, and xx-large.

  • When defaultFontSizes is true it will show the default font sizes and prevent those defaults from being overridden by the theme.
  • When defaultFontSizes is false it will hide the default font sizes and allow the theme to use the default slugs.

For block themes defaultFontSizes is true by default. This is to be consistent with how other default* options work such as settings.color.defaultPalette.

For classic themes there is a new theme support default-font-sizes which is also true by default. However, unlike block themes, it is set to false when editor-font-sizes theme support is defined.

In theme.json v2, the default font sizes were only shown when theme sizes were not defined. A theme providing font sizes with the same slugs as the defaults would always override them.

To keep behavior similar to v2 with a v3 theme.json:

  • If you do not have any fontSizes defined, defaultFontSizes can be left out or set to true.
  • If you have some fontSizes defined, set defaultFontSizes to false.
--- theme_v2.json
+++ theme_v3.json
@@ -1,24 +1,25 @@
 {
-	"version": 2,
+	"version": 3,
 	"settings": {
 		"typography": {
+			"defaultFontSizes": false,
 			"fontSizes": [
 				{
 					"name": "Small",
 					"slug": "small",
 					"size": "10px"
 				},
 				{
 					"name": "Medium",
 					"slug": "medium",
 					"size": "14px"
 				},
 				{
 					"name": "Large",
 					"slug": "large",
 					"size": "20px"
 				}
 			]
 		}
 	}
 }

settings.spacing.defaultSpacingSizes

A new defaultSpacingSizes has been added in theme.json v3. It gives control over showing default spacing sizes and preventing those defaults from being overridden.

The default spacingSizes slugs are: 20, 30, 40, 50, 60, 70, and 80.

  • When defaultSpacingSizes is true it will show the default spacing sizes and prevent them from being overridden by the theme.
  • When defaultSpacingSizes is false it will hide the default spacing sizes and allow the theme to use the default slugs.

defaultSpacingSizes is true by default. This is to be consistent with how other default* options work such as settings.color.defaultPalette.

For classic themes there is a new theme support default-spacing-sizes which is also true by default. However, unlike block themes, it is set to false when editor-spacing-sizes theme support is defined.

In theme.json v2, the default spacing sizes were only shown when theme sizes were not defined. A theme providing spacing sizes with the same slugs as the defaults would always override them.

Furthermore, there are two settings that can be used to set theme level spacing sizes: spacingSizes and spacingScale. With theme.json v3, presets from both will be merged together and sorted numerically by slug. Presets defined in spacingSizes will override those generated by spacingSizes if the slugs match.

In theme.json v2, setting both spacingSizes and spacingScale would only use the values from spacingSizes.

To keep behavior similar to v2 with a v3 theme.json:

  • If you do not have any spacingSizes presets or spacingScale config defined, defaultSpacingSizes can be left out or set to true.
  • If you disabled default spacing sizes by setting spacingScale to { "steps": 0 }, remove the spacingScale config and set defaultSpacingSizes to false.
  • If you defined only one of either spacingScale or spacingSizes for your presets, set defaultSpacingSizes to false.
  • If you defined both spacingScale and spacingSizes, remove the spacingSizes config and set defaultSpacingSizes to false.
--- theme_v2.json
+++ theme_v3.json
@@ -1,27 +1,25 @@
 {
-	"version": 2,
+	"version": 3,
 	"settings": {
 		"spacing": {
-			"spacingScale": {
-				"steps": 0
-			},
+			"defaultSpacingSizes": false,
 			"spacingSizes": [
 				{
 					"name": "Small",
 					"slug": "40",
 					"size": "1rem"
 				},
 				{
 					"name": "Medium",
 					"slug": "50",
 					"size": "1.5rem"
 				},
 				{
 					"name": "Large",
 					"slug": "60",
 					"size": "2rem"
 				}
 			]
 		}
 	}
 }

@ajlende ajlende added the has dev note when dev note is done (for upcoming WordPress release) label Apr 25, 2024
@carolinan
Copy link
Contributor

@ajlende The documentation updates look mostly good but there are some files that were not updated, and broken links.

Needs updating:

## Migrating from v2 to v3

Upgrading to v3 adjusts preset defaults to be more consistent with one another.

### How to migrate from v1 to v2:

@t-hamano
Copy link
Contributor

JSON Schema no longer allows version 2. Shouldn't version 2 still be allowed?

image

@ajlende
Copy link
Contributor Author

ajlende commented Apr 29, 2024

JSON Schema no longer allows version 2. Shouldn't version 2 still be allowed?

While v2 theme.json files will continue to work on current versions of WordPress, the schema is a tool for theme developers to verify their theme.json with the specified version of WordPress you are developing for. Versions of schemas are handled via URL. For example, the last theme.json v2 schema will be located at https://schemas.wp.org/wp/6.5/theme.json, and the last theme.json v1 schema is at https://schemas.wp.org/wp/5.8/theme.json.

I didn't do a great job of explaining this in the original theme.json blog post, but unless you are developing for folks with the Gutenberg plugin active, you don't really want to be using the trunk version of the schema. A theme should be using the oldest version of WordPress that it supports.

Technically JSON Schema Draft-04 would be able to support all versions simultaneously, but it would be a nightmare to maintain, would be slower for code editors to check, and it wouldn't flag developers working off trunk of a new version where all new work is happening.

@ajlende
Copy link
Contributor Author

ajlende commented Apr 29, 2024

The documentation updates look mostly good but there are some files that were not updated, and broken links.

@carolinan Thanks for catching those documentation issues. I found a bunch more issues as I was fixing those things and added everything in #61221.

@@ -2244,7 +2249,7 @@
"version": {
"description": "Version of theme.json to use.",
"type": "integer",
"enum": [ 2 ]
"enum": [ 3 ]
Copy link
Member

Choose a reason for hiding this comment

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

I think we still need to support the older versions. Having only version 3 in the enum list produces a warning for default themes.

CleanShot 2024-04-30 at 11 33 35

Copy link
Contributor

Choose a reason for hiding this comment

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

Or should we increase the default theme's theme.json version to 3?

Copy link
Member

Choose a reason for hiding this comment

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

I mentioned the default theme as an example. Not everyone will upgrade versions immediately, and the older versions still work.

Copy link
Contributor Author

@ajlende ajlende Apr 30, 2024

Choose a reason for hiding this comment

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

Default themes, like all other themes, should be using the schema for the oldest version of WordPress that they intend to support so that incompatible styles and settings are properly flagged. If the theme.json version is updated to 3, then the theme will only work with 6.6 and up or with the latest Gutenberg plugin installed.

It's confused often enough that I'm planning on writing a developer.wordpress.org blog post to help explain how JSON schema versioning works and how it's different from the theme.json version.

@ajlende ajlende changed the title Add defaultFontSizes theme.json (v2) Add defaultFontSizes theme.json (theme.json v3) Apr 30, 2024
justintadlock added a commit to x3p0-dev/x3p0-ideas that referenced this pull request May 11, 2024
Use the new `defaultFontSizes` setting. We no longer need the `ThemeJson` class because its only purpose was to remove the Core default font sizes.

Fixed in Gutenberg: WordPress/gutenberg#58409
@juanmaguitar juanmaguitar mentioned this pull request May 30, 2024
49 tasks
pento pushed a commit to WordPress/wordpress-develop that referenced this pull request Jun 4, 2024
See #6616.
See also the original Gutenberg PRs:
* WordPress/gutenberg#58409
* WordPress/gutenberg#61328
* WordPress/gutenberg#61842
* WordPress/gutenberg#62199
* WordPress/gutenberg#62252

Fixes #61282.

Props ajlende, talldanwp, ramonopoly, ellatrix.



git-svn-id: https://develop.svn.wordpress.org/trunk@58328 602fd350-edb4-49c9-b593-d223f7449a82
markjaquith pushed a commit to markjaquith/WordPress that referenced this pull request Jun 4, 2024
github-actions bot pushed a commit to platformsh/wordpress-performance that referenced this pull request Jun 4, 2024
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
[Feature] Typography Font and typography-related issues and PRs has dev note when dev note is done (for upcoming WordPress release) [Type] Feature New feature to highlight in changelogs.
Projects
Development

Successfully merging this pull request may close these issues.

10 participants