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

Register webfonts from theme.json #35625

Merged
merged 0 commits into from
Nov 11, 2021

Conversation

aristath
Copy link
Member

Description

This is a proof of concept for the discussion on #35591

To test:

"webfonts": [
	{
		"fontFamily": "Source Serif Pro",
		"fontWeight": "200 900",
		"fontStyle": "normal",
		"fontStretch": "normal",
		"src": "file:./assets/fonts/source-serif-pro/SourceSerif4Variable-Roman.ttf.woff2",
		"provider": "local"
	},
	{
		"fontFamily": "Source Serif Pro",
		"fontWeight": "200 900",
		"fontStyle": "italic",
		"fontStretch": "normal",
		"src": "file:./assets/fonts/source-serif-pro/SourceSerif4Variable-Italic.ttf.woff2",
		"provider": "local"
	}
]

Easiest way to test is using the TT2 theme from https://github.com/aristath/twentytwentytwo

Checklist:

  • My code is tested.
  • My code follows the WordPress code style.
  • My code follows the accessibility standards.
  • I've tested my changes with keyboard and screen readers.
  • My code has proper inline documentation.
  • I've included developer documentation if appropriate.
  • I've updated all React Native files affected by any refactorings/renamings in this PR (please manually search all *.native.js files for terms that need renaming or removal).

@mtias mtias added [Feature] Design Tools Tools that impact the appearance of blocks both to expand the number of tools and improve the experi Global Styles Anything related to the broader Global Styles efforts, including Styles Engine and theme.json labels Oct 15, 2021
@aristath aristath force-pushed the try/register-theme-json-webfonts branch from f65e3a5 to 667751e Compare October 20, 2021 07:40
@aristath aristath marked this pull request as ready for review November 4, 2021 12:18
@aristath aristath linked an issue Nov 4, 2021 that may be closed by this pull request
@aristath aristath changed the title POC: Register webfonts from theme.json Register webfonts from theme.json Nov 4, 2021
@aristath aristath force-pushed the try/register-theme-json-webfonts branch from 667751e to c19d647 Compare November 4, 2021 12:23
Copy link
Member

@jorgefilipecosta jorgefilipecosta left a comment

Choose a reason for hiding this comment

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

I left a comment related to the API here #35591 (comment).

Copy link
Member

@jorgefilipecosta jorgefilipecosta left a comment

Choose a reason for hiding this comment

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

The logic seems to be the expected one and things seem to be on a good path. I have the opinion that we should not have a separate webfont key but instead nest things inside the fontFamilies. It is not a big change. In the future, we should look into providing this information to the editor so the editor knows which styles and weights are available for a font family. Without this connection, themes may select only some weights for a font in theme.json but users can still pick any so it seems like the weights are not used.

@aristath aristath force-pushed the try/register-theme-json-webfonts branch from c19d647 to 45e9028 Compare November 9, 2021 10:18
@aristath aristath changed the base branch from trunk to add/webfonts November 11, 2021 08:39
@aristath aristath merged this pull request into add/webfonts Nov 11, 2021
@aristath aristath deleted the try/register-theme-json-webfonts branch November 11, 2021 08:40
aristath added a commit that referenced this pull request Nov 11, 2021
* POC: Register webfonts from theme.json

* Early exit if function doesn't exist

* Implement relative URLs
aristath added a commit that referenced this pull request Nov 12, 2021
* POC: Register webfonts from theme.json

* Early exit if function doesn't exist

* Implement relative URLs
aristath added a commit that referenced this pull request Nov 18, 2021
* POC: Register webfonts from theme.json

* Early exit if function doesn't exist

* Implement relative URLs
aristath added a commit that referenced this pull request Nov 19, 2021
* POC: Register webfonts from theme.json

* Early exit if function doesn't exist

* Implement relative URLs
aristath added a commit that referenced this pull request Nov 23, 2021
* POC: Register webfonts from theme.json

* Early exit if function doesn't exist

* Implement relative URLs
aristath added a commit that referenced this pull request Nov 24, 2021
* POC: Register webfonts from theme.json

* Early exit if function doesn't exist

* Implement relative URLs
aristath added a commit that referenced this pull request Dec 2, 2021
* POC: Register webfonts from theme.json

* Early exit if function doesn't exist

* Implement relative URLs
aristath added a commit that referenced this pull request Dec 6, 2021
* POC: Register webfonts from theme.json

* Early exit if function doesn't exist

* Implement relative URLs
aristath added a commit that referenced this pull request Dec 8, 2021
* POC: Register webfonts from theme.json

* Early exit if function doesn't exist

* Implement relative URLs
aristath added a commit that referenced this pull request Dec 14, 2021
* POC: Register webfonts from theme.json

* Early exit if function doesn't exist

* Implement relative URLs
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
[Feature] Design Tools Tools that impact the appearance of blocks both to expand the number of tools and improve the experi Global Styles Anything related to the broader Global Styles efforts, including Styles Engine and theme.json
Projects
None yet
Development

Successfully merging this pull request may close these issues.

Webfonts API implementation in theme.json
3 participants