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

Add support for snap to grid with design tool adjustments #41491

Closed
Tracked by #41093
glendaviesnz opened this issue Jun 2, 2022 · 2 comments
Closed
Tracked by #41093

Add support for snap to grid with design tool adjustments #41491

glendaviesnz opened this issue Jun 2, 2022 · 2 comments
Labels
[Feature] Design Tools Tools that impact the appearance of blocks both to expand the number of tools and improve the experi [Type] Enhancement A suggestion for improvement.

Comments

@glendaviesnz
Copy link
Contributor

glendaviesnz commented Jun 2, 2022

The idea has been proposed to allow theme creators to define custom snap points for the likes of padding, margins, gap, and then to specify that block adjustments will snap to a grid of these snap points.

grid

Separate to this is another request to make it possible for theme authors to specify a preset list of a spacing tokens, eg. small, medium, large with the ability to specify that users can select from this set list only, and/or use custom values.

The combination of these features raises a few questions:

  • Does the theme author have to choose to use the grid space option or to use the spacing token options from theme.json, as it seems like it would be difficult to combine the 2?
  • Or, is there some way to combine the idea if snap to grid, with the spacing tokens?
  • What does a padding or margin block setting look like if snap to grid is enabled, does it just have +- to snap out and in?
  • Is there any expectation to have resize handles to drag sides to snap points
  • Is there a better name than Grid units as in CSS terms a Grid unit is a fr, which doesn't relate to this usage so may cause confusion
@glendaviesnz glendaviesnz added [Type] Enhancement A suggestion for improvement. [Feature] Design Tools Tools that impact the appearance of blocks both to expand the number of tools and improve the experi labels Jun 2, 2022
@glendaviesnz glendaviesnz changed the title Add support for snap to grid with design tool adjustments. Allow theme creators to define custom snap points. Add support for snap to grid with design tool adjustments Jun 2, 2022
@apeatling
Copy link
Contributor

apeatling commented Jun 2, 2022

The visuals above are not what I had in mind, or what I understood about this feature.

My understanding is that:

  1. Theme authors would define the "spacing tokens" and their underlying units in theme.json. small, medium, large etc.
  2. The user would see these spacing tokens in the UI where they could select small, medium, large and the spacing would adjust to the underlying unit associated with that token.
  3. If the user switches to a different theme that also makes use of these spacing tokens, the spacing will auto adjust to reflect the new underlying units provided by the new theme's theme.json.
  4. If the user wants to override these defined units, they can provide a custom spacing value in the unit of their choosing.
  5. Theme authors could disable this custom override for their theme if they wish.

I would expect that a user could drag spacing on the canvas and have the element snap to the underlying spacing token unit. This seems secondary to just getting it working in a sidebar UI though.

/cc @mtias if any of this looks off

@glendaviesnz
Copy link
Contributor Author

Closing this in favour of #39371

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 [Type] Enhancement A suggestion for improvement.
Projects
None yet
Development

No branches or pull requests

2 participants