Merged
Conversation
|
The following accounts have interacted with this PR and/or linked issues. I will continue to update these lists as activity occurs. You can also manually ask me to refresh this list by adding the If you're merging code through a pull request on GitHub, copy and paste the following into the bottom of the merge commit message. To understand the WordPress project's expectations around crediting contributors, please review the Contributor Attribution page in the Core Handbook. |
oandregal
added
[Type] Bug
|
Size Change: +101 B (0%) Total Size: 6.84 MB
ℹ️ View Unchanged
|
oandregal
added
the
Backport to WP 7.0 Beta/RC
Contributor
|
Hah, actually the Tags field has the correct styling. Controls in DataForm ( |
Member
Author
|
@jameskoster updated everything to gray-900. I've also tried not adding any color at the DataForm level, but the label color in the underlying controls is not normalized (some use gray-900, some others black, etc.). |
oandregal
changed the title
Contributor
|
@oandregal apologies for not being clearer. The labels should only be |
Member
Author
|
@jameskoster 🤔 if we do so, we cannot longer mix regular/panel fields because they'll have different label colors? |
mirka
reviewed
Feb 24, 2026
Comment on lines
10
to
15
| .components-base-control__label, | ||
| .components-input-control__label { | ||
| color: $gray-700; | ||
| .components-input-control__label, | ||
| .components-form-token-field__label { | ||
| color: $gray-900; | ||
| } | ||
| } |
Member
There was a problem hiding this comment.
Out of curiosity, in what situations do these standard @wordpress/components labels not have the standard gray-900 color, that you would have to define them explicitly here? If there are explicit color styles missing in the basic components themselves, we can address it at the source, not just in DataViews.
Member
Author
There was a problem hiding this comment.
There were a few too many. Just did a quick test removing these styles and:
good:
- input
- select
bad:
- textarea
- combobox
- radio
- togglegroup
- formtoken
- date
- datetime
n/a (don't have label):
- checkbox
- toggle
Member
There was a problem hiding this comment.
I guess my question is, even if each label didn't have explicit color styles out of the box, wouldn't it be easier to set gray-900 on the broader container and not on each specific label element? The labels just inherit color from the surrounding context, and the reason they have been generally fine without a explicit color is because gray-900 is the default text color throughout the app. We assume that there is an intentional, default text color set on the overall app. So at first glance, it seems that it would be much simpler to set the color on .dataforms-layouts-regular__field itself, for example (or probably an even wider scope).
Member
Author
There was a problem hiding this comment.
That's a good thought, thanks for sharing. I tried the CSS cascade approach (using the red color, for making it clear) and this is what happens:
Screen.Recording.2026-02-25.at.09.59.10.mov
The reason is that the label element for input and select controls have a emotion style attached (color: var(--wp-components-color-foreground, #1e1e1e);) and so the CSS cascade doesn't work for them.
There's a few ways forward here: either we use the same approach as input/select or we use CSS cascade. I suppose the new DS theme styles can also work here. I'm not opinionated about any particular approach and trust your expertise. Though it seems a bigger effort for a place other than this PR that addresses a bugfix for 7.0 beta.
Member
There was a problem hiding this comment.
The reason is that the label element for input and select controls have a emotion style attached (
color: var(--wp-components-color-foreground, #1e1e1e);) and so the CSS cascade doesn't work for them.
And I thought that would be fine in this context, because I thought you wanted all the labels to be gray-900 (which is equivalent to var(--wp-components-color-foreground, #1e1e1e)). So the cascade won't apply to input and select, but that doesn't matter because they are already gray-900.
Member
Author
There was a problem hiding this comment.
That's correct, but only coincidentally. They only fallback to the proper color if --wp-components-color-foreground is unavailable. What if we select/input controls change color? etc. The components are not consistent in a way that generates trust for DataForm as a consumer to rely on them. I'd rather be cautious and prevent regressions before they happen.
Member
There was a problem hiding this comment.
If we changed the label colors for select/input but not for all the other controls, that is a bug, so you can report it 😄
Anyway my comments are non-blocking, just mainly wanted to figure out if there's anything obviously missing from the @wordpress/components styles.
Member
Author
There was a problem hiding this comment.
Anyway my comments are non-blocking, just mainly wanted to figure out if there's anything obviously missing from the @wordpress/components styles.
I'm mostly a bit worried about some having style hooks (--wp-components-color-foreground) and some others not, and how that may impact consumers of DataForm. It'd be ideal that there's consistency among controls, so if that --wp-components-color-foreground changes, it impacts all controls rather than just some. I suppose this would be easier with the new DS theme styles :)
Member
There was a problem hiding this comment.
And to be clear, --wp-components-color-* are never actually defined anywhere in any official way (aside from like one progress bar in the Gutenberg app), and are completely experimental tokens that will be superseded by the official DS theme tokens pretty soon. So you can basically regard those as equivalent to their fallback values.
Contributor
Since the 'labels' in |
Member
Author
Okay, I scoped down these changes to the regular panel; the panel styles remain as before. To be candid, it makes me a bit uncomfortable that panel and regular use different colors, but I trust your design call here. We can always iterate post-7.0 if we need to. |
|
Flaky tests detected in c731c30. 🔍 Workflow run URL: https://github.com/WordPress/gutenberg/actions/runs/22389832604
|
Contributor
|
Agree we can continue to iterate on the style. I think the colors are good though, so let's merge. Fwiw my personal preference would be a different 'label' style altogether for 
But that would need wider design input cc @jasmussen @poligilad-auto |
jameskoster
approved these changes
Feb 25, 2026
Contributor
|
A agree on exploring a different label style. More broadly? Sure we can talk about that too. For now it's mostly that this differential between quickEdit and the document inspector for me is a bit jarring: 
The all-caps label style for me feels less legible in the horizontal layout, because your eye cannot track the x-height uniformly from left to right. Not a blocker for this PR, or any, it's just a feeling. |
Member
Author
|
#75944 explores removing the uppercase style for labels in panel layout. |
ellatrix
added
Backport to WP 7.0 Beta/RC
github-actions
bot
removed
the
Backport to WP 7.0 Beta/RC
gutenbergplugin
pushed a commit
that referenced
this pull request
Feb 26, 2026
Co-authored-by: oandregal <oandregal@git.wordpress.org> Co-authored-by: mirka <0mirka00@git.wordpress.org> Co-authored-by: jameskoster <jameskoster@git.wordpress.org> Co-authored-by: jasmussen <joen@git.wordpress.org>
github-actions
bot
added
the
Backported to WP Core
|
I just cherry-picked this PR to the wp/7.0 branch to get it included in the next release: 8dcdf58 |
pento
pushed a commit
to WordPress/wordpress-develop
that referenced
this pull request
Feb 26, 2026
CI run: #11059. See #64595. --- I've included a log of the Gutenberg changes with the following command: git log --reverse --format="- %s" 23b566c72e9c4a36219ef5d6e62890f05551f6cb..022d8dd3d461f91b15c1f0410649d3ebb027207f | sed 's|#\([0-9][0-9]*\)|https://github.com/WordPress/gutenberg/pull/\1|g; /github\.com\/WordPress\/gutenberg\/pull/!d' | pbcopy - Pattern Editing: Fix nested patterns/sections (WordPress/gutenberg#75772) - QuickEdit: rename status label and remove extra labels in popup (WordPress/gutenberg#75824) - Fix block editing modes not recomputing when isolated editor value changes (WordPress/gutenberg#75821) - Synced patterns: Fix block editing mode of synced pattern content when nested in an unsynced pattern (WordPress/gutenberg#75818) - Block Support: Fix custom CSS not saved when style schema is not defined (WordPress/gutenberg#75797) - Gallery: Fixes keyboard focus escaping the lightbox overlay when navigating a gallery with Tab/Shift+Tab. (WordPress/gutenberg#75852) - Navigation Overlay Close: Set Close as default text, rather than using a placeholder (WordPress/gutenberg#75692) - RTC: Fix entity save call / initial persistence. (WordPress/gutenberg#75841) - Real-time collaboration: Improve collaboration within the same rich text (WordPress/gutenberg#75703) - Client Side Media: Add device/browser capability detection (WordPress/gutenberg#75863) - Navigation editing: simplify edit/view buttons (WordPress/gutenberg#75819) - Add core/icon block to theme.json schema (WordPress/gutenberg#75813) - Fix error when undoing newly added pattern (WordPress/gutenberg#75850) - Page List Item: Replace RawHTML with dangerouslySetInnerHTML for label and title (WordPress/gutenberg#75890) - REST API: Make filter_wp_unique_filename() static to match core, plus avoid duplicate routes (WordPress/gutenberg#75782) - RichText: useAnchor: Fix TypeError in virtual element (WordPress/gutenberg#75900) - DataViews: Remove menu divider again. (WordPress/gutenberg#75908) - Theme: Add build plugins to inject design token fallbacks (WordPress/gutenberg#75901) - Theme: Remove global stylesheet (WordPress/gutenberg#75879) - Real-time collaboration: Remove ghost awareness state explicitly when refreshing (WordPress/gutenberg#75883) - Real-time collaboration: Expand mergeCrdtBlocks() automated testing (WordPress/gutenberg#75923) - Fix client-side media file naming (WordPress/gutenberg#75817) - Add: Connectors screen (WordPress/gutenberg#75833) - Merge document meta into state map (WordPress/gutenberg#75830) - Move WordPress meta key from sync package to core-data (WordPress/gutenberg#75846) - Bugfix: Fix casing of getPersistedCRDTDoc (WordPress/gutenberg#75922) - Add debug logging to SyncManager (WordPress/gutenberg#75924) - DataForm: fix label colors (WordPress/gutenberg#75730) - DataViews: minimize padding for primary action buttons (WordPress/gutenberg#75721) (WordPress/gutenberg#75947) - Connectors: Add `_ai_` prefix to connector setting names and fix naming inconsistencies (WordPress/gutenberg#75948) - Connectors: Unhook Core callbacks in Gutenberg coexistence (WordPress/gutenberg#75935) - Unsynced patterns: Rename 'Disconnect pattern' to 'Detach pattern' in context menu (WordPress/gutenberg#75807) - Editor: Remove View dropdown and pinned items from revisions header (WordPress/gutenberg#75951) - Fix: Template revisions infinite spinner (WordPress/gutenberg#75953) - Backport: Avoid flickering while refreshing (WordPress/gutenberg#74572) (WordPress/gutenberg#75952) - Add wp_ prefix to real time collaberation option. (WordPress/gutenberg#75837) git-svn-id: https://develop.svn.wordpress.org/trunk@61750 602fd350-edb4-49c9-b593-d223f7449a82
markjaquith
pushed a commit
to markjaquith/WordPress
that referenced
this pull request
Feb 26, 2026
CI run: WordPress/wordpress-develop#11059. See #64595. --- I've included a log of the Gutenberg changes with the following command: git log --reverse --format="- %s" 23b566c72e9c4a36219ef5d6e62890f05551f6cb..022d8dd3d461f91b15c1f0410649d3ebb027207f | sed 's|#\([0-9][0-9]*\)|https://github.com/WordPress/gutenberg/pull/\1|g; /github\.com\/WordPress\/gutenberg\/pull/!d' | pbcopy - Pattern Editing: Fix nested patterns/sections (WordPress/gutenberg#75772) - QuickEdit: rename status label and remove extra labels in popup (WordPress/gutenberg#75824) - Fix block editing modes not recomputing when isolated editor value changes (WordPress/gutenberg#75821) - Synced patterns: Fix block editing mode of synced pattern content when nested in an unsynced pattern (WordPress/gutenberg#75818) - Block Support: Fix custom CSS not saved when style schema is not defined (WordPress/gutenberg#75797) - Gallery: Fixes keyboard focus escaping the lightbox overlay when navigating a gallery with Tab/Shift+Tab. (WordPress/gutenberg#75852) - Navigation Overlay Close: Set Close as default text, rather than using a placeholder (WordPress/gutenberg#75692) - RTC: Fix entity save call / initial persistence. (WordPress/gutenberg#75841) - Real-time collaboration: Improve collaboration within the same rich text (WordPress/gutenberg#75703) - Client Side Media: Add device/browser capability detection (WordPress/gutenberg#75863) - Navigation editing: simplify edit/view buttons (WordPress/gutenberg#75819) - Add core/icon block to theme.json schema (WordPress/gutenberg#75813) - Fix error when undoing newly added pattern (WordPress/gutenberg#75850) - Page List Item: Replace RawHTML with dangerouslySetInnerHTML for label and title (WordPress/gutenberg#75890) - REST API: Make filter_wp_unique_filename() static to match core, plus avoid duplicate routes (WordPress/gutenberg#75782) - RichText: useAnchor: Fix TypeError in virtual element (WordPress/gutenberg#75900) - DataViews: Remove menu divider again. (WordPress/gutenberg#75908) - Theme: Add build plugins to inject design token fallbacks (WordPress/gutenberg#75901) - Theme: Remove global stylesheet (WordPress/gutenberg#75879) - Real-time collaboration: Remove ghost awareness state explicitly when refreshing (WordPress/gutenberg#75883) - Real-time collaboration: Expand mergeCrdtBlocks() automated testing (WordPress/gutenberg#75923) - Fix client-side media file naming (WordPress/gutenberg#75817) - Add: Connectors screen (WordPress/gutenberg#75833) - Merge document meta into state map (WordPress/gutenberg#75830) - Move WordPress meta key from sync package to core-data (WordPress/gutenberg#75846) - Bugfix: Fix casing of getPersistedCRDTDoc (WordPress/gutenberg#75922) - Add debug logging to SyncManager (WordPress/gutenberg#75924) - DataForm: fix label colors (WordPress/gutenberg#75730) - DataViews: minimize padding for primary action buttons (WordPress/gutenberg#75721) (WordPress/gutenberg#75947) - Connectors: Add `_ai_` prefix to connector setting names and fix naming inconsistencies (WordPress/gutenberg#75948) - Connectors: Unhook Core callbacks in Gutenberg coexistence (WordPress/gutenberg#75935) - Unsynced patterns: Rename 'Disconnect pattern' to 'Detach pattern' in context menu (WordPress/gutenberg#75807) - Editor: Remove View dropdown and pinned items from revisions header (WordPress/gutenberg#75951) - Fix: Template revisions infinite spinner (WordPress/gutenberg#75953) - Backport: Avoid flickering while refreshing (WordPress/gutenberg#74572) (WordPress/gutenberg#75952) - Add wp_ prefix to real time collaberation option. (WordPress/gutenberg#75837) Built from https://develop.svn.wordpress.org/trunk@61750 git-svn-id: http://core.svn.wordpress.org/trunk@61056 1a063a9b-81f0-0310-95a4-ce76da25c4cd
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
5 participants
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
What?
This makes all labels in regular layout use gray-900.
Why?
As per design specs.
How?
Update label styles to match the desired color.
I've also tried not adding any color at the DataForm level but the underlying controls are not normalized (some use gray-900, some others black, some use the CSS cascade, some others don't, etc.).
Testing Instructions