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.

Sign up for GitHub

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

Jump to bottom

Global Styles: improvements to color picker design #36542

Closed
2 tasks
Tracked by #36543
annezazu opened this issue Nov 16, 2021 · 2 comments · Fixed by #36965
Closed
2 tasks
Tracked by #36543

Global Styles: improvements to color picker design #36542

annezazu opened this issue Nov 16, 2021 · 2 comments · Fixed by #36965
Labels
[Feature] Colors Color management [Feature] Design Tools Tools that impact the appearance of blocks both to expand the number of tools and improve the experi Global Styles Anything related to the broader Global Styles efforts, including Styles Engine and theme.json [Type] Enhancement A suggestion for improvement.

Comments

@annezazu
Copy link
Contributor

annezazu commented Nov 16, 2021 •
edited by oandregal
Loading

What problem does this address?

Currently, the color picker opens over top of the rest of the color palette obscuring the ability to see the entire set of colors:

Screen Shot 2021-11-16 at 2 17 41 PM

Additionally, the target design doesn't have any padding.

What is your proposed solution?

  • Move the color picker to the left of the sidebar to provide a clearer editing flow.
  • Remove padding.
@annezazu annezazu added [Type] Enhancement A suggestion for improvement. Global Styles Anything related to the broader Global Styles efforts, including Styles Engine and theme.json [Feature] Colors Color management labels Nov 16, 2021
@mtias
Copy link
Member

mtias commented Nov 16, 2021

The target design reference:

image

@noisysocks noisysocks mentioned this issue Nov 17, 2021
Closed
45 tasks
@skorasaurus skorasaurus added the [Feature] Design Tools Tools that impact the appearance of blocks both to expand the number of tools and improve the experi label Nov 18, 2021
@oandregal
Copy link
Member

Added a comment/tasks to also remove the padding from the existing component, so it matches the target design.

@oandregal oandregal changed the title Global Styles: Open the color picker to the left of the sidebar Global Styles: improvements to color picker design Nov 23, 2021
@mtias mtias mentioned this issue Nov 23, 2021
Closed
10 tasks
@jorgefilipecosta jorgefilipecosta mentioned this issue Nov 29, 2021
Merged
@oandregal oandregal mentioned this issue Nov 29, 2021
Merged
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees
No one assigned
Labels
[Feature] Colors Color management [Feature] Design Tools Tools that impact the appearance of blocks both to expand the number of tools and improve the experi Global Styles Anything related to the broader Global Styles efforts, including Styles Engine and theme.json [Type] Enhancement A suggestion for improvement.
Projects
None yet
Milestone
No milestone
Development

Successfully merging a pull request may close this issue.

Fix: Custom color picker popover position WordPress/gutenberg
4 participants
@mtias @oandregal @skorasaurus @annezazu