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

Layout: Try adding centralised attribute-based styles defined via classnames #42881

Closed

Conversation

andrewserong
Copy link
Contributor

What?

🚧 🚧 🚧 🚧 WIP: This is an exploration for now and is likely to change quite a bit 🚧 🚧 🚧 🚧

Following on from #40875 and as part of #39336, this PR looks at seeing if we can define those Layout attributes that are of a controlled set (e.g. content justification) in the theme.json layout definitions, and then output those definitions as preset-like rules.

Why?

Continue the de-duplication of style output generated by the Layout block support, and make it easier to add / define additional layout properties in the future.

How?

TBC

To-do

  • Add all attributes to the centralised layout definitions
  • Generate classnames in layout.php based on these definitions
  • Generate CSS rules in the Theme JSON class based on these definitions

Testing Instructions

TBC

Screenshots or screencast

@andrewserong andrewserong added [Type] Experimental Experimental feature or API. Global Styles Anything related to the broader Global Styles efforts, including Styles Engine and theme.json labels Aug 2, 2022
@andrewserong andrewserong self-assigned this Aug 2, 2022
@andrewserong
Copy link
Contributor Author

Pretty hacky, but I've had a go at the PHP implementation in:d68095a

Which results in the following output:

image

Next up:

  • See if a similar sort of logic works for generating the classnames in layout.php
  • See if a similar sort of logic works in the JS implementations (global styles, and classname generation in the editor)

@andrewserong
Copy link
Contributor Author

Closing out this one now, as it's stale.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Global Styles Anything related to the broader Global Styles efforts, including Styles Engine and theme.json [Type] Experimental Experimental feature or API.
Projects
None yet
Development

Successfully merging this pull request may close these issues.

1 participant