-
Notifications
You must be signed in to change notification settings - Fork 4.2k
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
Color UI component: reorder palettes and update names (core by defaults, user by custom) #36622
Conversation
Size Change: +112 B (0%) Total Size: 1.1 MB
ℹ️ View Unchanged
|
d0c7933
to
936c2c8
Compare
|
||
colorGradientSettings.colors = useMemo( () => { | ||
const result = []; | ||
if ( shouldDisplayCoreColors && coreColors && coreColors.length ) { |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Per the mockups, the order in which the palettes should be shown is: defaults, theme, user.
colorGradientSettings.gradients = useMemo( () => { | ||
const result = []; | ||
if ( |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Per the mockups, the order in which the palettes should be shown is: defaults, theme, user.
return useMemo( () => { | ||
const result = []; | ||
if ( coreColors && coreColors.length ) { |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Per the mockups, the order of teh palettes is: theme, defaults, custom.
return useMemo( () => { | ||
const result = []; | ||
if ( coreGradients && coreGradients.length ) { |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Per the mockups, the order of teh palettes is: theme, defaults, custom.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Thanks, @oandregal.
The changes look good to me, and the new order matches the mockups
'corePalette' => null, | ||
'coreGradients' => null, |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
I assume these settings were only recently introduced, which is why we don't need migrations.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
I have tested this manually by viewing the palettes in the global styles sidebar, site editor, and in the block editor.
This works well, I am very glad the use of "Core" was replaced.
I then removed the two default palettes using the new names in theme.json.
The default palettes are removed from the site editor and block editor, but not from the global styles, is that correct?
--
I have one related question, that should not be a blocker for this PR. The border color option only displays the custom color palette, is that correct?
@carolinan Thanks for the thorough testing, it's really helpful. Apparently, we missed using those flags in the site editor, I'll get that fixed. Need to investigate the border-color issue. |
#36639 fixes the flags in the GS sidebar. |
…ts, user by custom) (#36622)
Based on #36496
Part of #36543 and #36556
In working with the new color UI component to show three different palettes we used these mockups #34574 which use the following names:
This PR updates:
corePalette
andcoreGradients
flags intheme.json
to bedefaultPalette
anddefaultGradients
instead.Follow-ups:
default
,theme
, anduser
instead ofcore
,theme
, anduser
. I'd like to address this as a follow-up to control the PR size. This matters because they're part of the API we expose inuseSetting( 'color.palette.core' )
so it should be coherent with the UI for simplicity.