Make WordPress Core

Opened 23 months ago

Last modified 7 weeks ago

#58499 new defect (bug)

Twenty Twenty: Table block having issue with color

Reported by: nidhidhandhukiya's profile nidhidhandhukiya Owned by:
Milestone: Awaiting Review Priority: normal
Severity: minor Version: 6.2.2
Component: Bundled Theme Keywords: has-patch needs-testing-info
Focuses: css Cc:

Description (last modified by sabernhardt)

Steps to reproduce the issue.

  1. Activate Twenty Twenty theme.
  2. Take table block.
  3. Add some text.
  4. Apply background color black or pink.
  5. Now apply any color to the text.

You can able to see it will not take the value of that chosen color if black or pink is set as a background color for editor side.
Front side it is working fine it is having issue only in editor side.

I have attached video for better understanding.
Video URL :- https://share.cleanshot.com/plqBT1cn6hMbRR5g6Grz

Attachments (3)

58499.diff (1.2 KB) - added by thakordarshil 23 months ago.
Patch Added
58499.2.diff (1.6 KB) - added by shwetabathani2312 23 months ago.
@thakordarshil Need to update code on functions.php as well as it is working on backend but causing issue on frontend so.
58499-repro-attempt-1.mp4 (3.7 MB) - added by shraddhagore 7 weeks ago.

Change History (8)

#1 @nidhidhandhukiya
23 months ago

The reason behind this issue is the below css

.has-background.has-primary-background-color:not(.has-text-color), .has-background.has-primary-background-color *:not(.has-text-color), .has-background.has-accent-background-color:not(.has-text-color), .has-background.has-accent-background-color *:not(.has-text-color) {
    color: #fff;
}

If we remove that the issue is resolved.

#2 @thakordarshil
23 months ago

@nidhidhandhukiya
Instead of removing css
Just need small fix

.has-background.has-primary-background-color:not(.has-text-color), .has-background.has-primary-background-color:not(.has-text-color) *, .has-background.has-accent-background-color:not(.has-text-color), .has-background.has-accent-background-color:not(.has-text-color) * {
    color: #fff;
}
Last edited 23 months ago by thakordarshil (previous) (diff)

@thakordarshil
23 months ago

Patch Added

@shwetabathani2312
23 months ago

@thakordarshil Need to update code on functions.php as well as it is working on backend but causing issue on frontend so.

#3 @thakordarshil
21 months ago

  • Keywords has-patch needs-testing-info added

#4 @sabernhardt
8 months ago

  • Description modified (diff)
  • Focuses css added
  • Summary changed from Twenty Twenty theme table block having issue with color to Twenty Twenty: Table block having issue with color

Related: #48684

#5 @shraddhagore
7 weeks ago

Reproduction Report

Description

This report validates whether the issue can be reproduced.

Environment

  • WordPress: 6.8-alpha-59274-src
  • PHP: 8.2.27
  • Server: nginx/1.27.4
  • Database: mysqli (Server: 8.4.4 / Client: mysqlnd 8.2.27)
  • Browser: Chrome 133.0.0.0
  • OS: Windows 10/11
  • Theme: Twenty Twenty 2.8
  • MU Plugins: None activated
  • Plugins:
    • Test Reports 1.2.0

Actual Results

  1. ❌ I followed the steps outlined in the ticket description but was unable to reproduce the issue.

Additional Notes

  • Hello @nidhidhandhukiya, could you please confirm if I am following the correct steps to reproduce the issue? Thanks!

Supplemental Artifacts

Note: See TracTickets for help on using tickets.