Skip to content

Fluid typography: Numerical values shall support "ref" data type for better design synchronization e.g. typography.fluid.maxViewportWidth = "ref": "settings.layout.contentSize" #53525

@porg

Description

@porg

Original issue

Additional user need

  • It should be possible that minViewportWidth and maxViewportWidth can take variable values like contentSize and wideSize or the defined breakpoint variables to have a synchronized design experience with no need to manually update numerical values in multiple places.

Add ref data type to fluid typography (goal of this issue)

@ramonjd pointed out this is possible by integrating the ref data type as defined in the theme.json schema for fluid typography, then you could assign like this:

	"settings": {
		"appearanceTools": true,
		"layout": {
			"contentSize": "840px",
			"wideSize": "1100px"
		},
		"typography": {
			"fluid": {
				"maxViewportWidth": {
					"ref": "settings.layout.contentSize"
				},
				"minViewportWidth": "600px"
			}
		}
	},

Ticket triage

Metadata

Metadata

Assignees

No one assigned

    Labels

    Global StylesAnything related to the broader Global Styles efforts, including Styles Engine and theme.json[Type] EnhancementA suggestion for improvement.

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions