Make WordPress Core

#58522 closed enhancement (fixed)

Fluid typography: use layout.wideSize as max viewport width

Reported by: ramonopoly's profile ramonopoly Owned by: isabel_brison's profile isabel_brison
Milestone: 6.3 Priority: normal
Severity: normal Version: 6.3
Component: Editor Keywords: has-unit-tests has-patch
Focuses: Cc:

Description

Let's use the value of settings.layout.wideSize, if set, as the maximum viewport width for fluid font size calculations.

The default value is 1600px.

Added to the Gutenberg plugin in https://github.com/WordPress/gutenberg/pull/49815

See https://github.com/WordPress/gutenberg/pull/49707#pullrequestreview-1384094487 (review) for context

Slated for WordPress 6.3 and tracked in the backport issue: https://github.com/WordPress/gutenberg/issues/51077

Change History (14)

This ticket was mentioned in PR #4604 on WordPress/wordpress-develop by @ramonopoly.


16 months ago
#1

  • Keywords has-patch added

Let's use the value of settings.layout.wideSize, if set, as the maximum viewport width for fluid font size calculations.

The default value is 1600px.

Added to the Gutenberg plugin in https://github.com/WordPress/gutenberg/pull/49815

### Testing

  1. Fire up this branch and use 2023 (a theme that has fluid font sizes enabled)
  2. In the site editor play around with setting the wide size for layouts, as well as adding some custom font sizes.
  3. Your font sizes should be at their maximum values when viewport is at least as wide as the value of layout.wideSize

npm run test:php -- --filter Tests_Block_Supports_Typography

Trac ticket: https://core.trac.wordpress.org/ticket/58522

#2 @isabel_brison
16 months ago

  • Milestone changed from Awaiting Review to 6.3

@ramonopoly commented on PR #4604:


16 months ago
#3

Thanks for testing @tellthemachines

I assume the changes from https://github.com/WordPress/gutenberg/pull/51516 aren't testable until the npm packages are updated?

Yes. Thanks for mentioning that. I've updated the test description.

Note to self: if this gets merged, I'll update the tests for https://github.com/WordPress/wordpress-develop/pull/4605 (which will be affected due to the change in the way we calculate max viewport size)

#4 @isabel_brison
16 months ago

  • Owner set to isabel_brison
  • Status changed from new to assigned

#5 @isabel_brison
16 months ago

  • Resolution set to fixed
  • Status changed from assigned to closed

In 55946:

Editor: use layout.wideSize as max viewport width.

Use the value of layout.wideSize as the maximum viewport width for fluid font size calculations.

Props ramonopoly.

Fixes #58522.

@isabel_brison commented on PR #4604:


16 months ago
#6

Committed in r55946 / c790ae4.

#7 @kebbet
16 months ago

  • Resolution fixed deleted
  • Status changed from closed to reopened

The docblock for the test is pointing to a function called gutenberg_apply_typography_support. Is that meant to be wp_apply_typography_support ? See the docblock in the test.

#8 @oglekler
16 months ago

@isabel_brison I believe that you can easily address a question and improve docblock. Thank you 🙏

#9 @ramonopoly
16 months ago

@isabel_brison I believe that you can easily address a question and improve docblock. Thank you 🙏

I can get a patch up for this later today. Thanks for spotting!

This ticket was mentioned in PR #4732 on WordPress/wordpress-develop by @ramonopoly.


16 months ago
#10

Rename gutenberg_apply_typography_support to gwp_apply_typography_support in comments

See comment: https://core.trac.wordpress.org/ticket/58522#comment:7

Trac ticket: https://core.trac.wordpress.org/ticket/58522

#11 @isabel_brison
16 months ago

In 56084:

Editor: update function name in test comment.

Renames gutenberg_apply_typography_support to wp_apply_typography_support in typography test comment.

Props kebbet, oglekler, ramonopoly.
See #58522.

@isabel_brison commented on PR #4732:


16 months ago
#12

committed in r56084 / 28c879e.

#13 @kebbet
16 months ago

Could this ticket be closed as fixed @isabel_brison ?

#14 @isabel_brison
16 months ago

  • Resolution set to fixed
  • Status changed from reopened to closed

Sure! Thanks for the reminder @kebbet.

Note: See TracTickets for help on using tickets.