Make WordPress Core

Opened 2 years ago

Closed 2 years ago

Last modified 2 years ago

#58523 closed enhancement (fixed)

Fluid typography: use logarithmic scale factor to calculate a min font size

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-patch has-unit-tests gutenberg-merge
Focuses: Cc:

Description

Introduce logarithmic scale factor to calculate a minimum font scale that tapers out as the font size increases.

The current calculation that derives minimum font sizes from font sizes is linear, which means that very large font sizes won't be scaled down to a readable level.

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

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

Change History (5)

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


2 years ago
#1

  • Keywords has-patch has-unit-tests added

Introduces logarithmic scale factor to calculate a minimum font scale that tapers out as the font size increases.

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

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

## Testing

I've tested this using the 2023 theme.

In a new post, insert the following example block code. Play around with sizes and values.

<details>

<summary>Example block code</summary>

Loco brings you family recipes, fresh, simple, tasteful ingredients and a nice vibe.


A paragraph at 16rem

A paragraph at 8rem

A paragraph at 6rem

A paragraph at 4rem

A paragraph at 3rem

A paragraph at 2rem

A paragraph at 1rem


A paragraph at 256px

A paragraph at 128px

A paragraph at 96px

A paragraph at 64px

A paragraph at 48px

A paragraph at 32px

A paragraph at 16px

</details>

Run the tests!!

npm run test:php -- --filter Tests_Block_Supports_Typography

#2 @ramonopoly
2 years ago

  • Keywords gutenberg-merge added
  • Type changed from defect (bug) to enhancement
  • Version set to trunk

#3 @isabel_brison
2 years ago

  • Milestone changed from Awaiting Review to 6.3

#4 @isabel_brison
2 years ago

  • Owner set to isabel_brison
  • Resolution set to fixed
  • Status changed from new to closed

In 55947:

Editor: use logarithmic scale for fluid typography.

Introduces logarithmic scale factor to calculate a minimum font scale that tapers out as the font size increases.

Props ramonopoly.
Fixes #58523.

@isabel_brison commented on PR #4605:


2 years ago
#5

Committed in r55947 / 787de79.

Note: See TracTickets for help on using tickets.