Make WordPress Core

Opened 2 years ago

Last modified 2 months 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-test-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 2 years ago.
Patch Added
58499.2.diff (1.6 KB) - added by shwetabathani2312 2 years 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 5 months ago.

Change History (9)

#1 @nidhidhandhukiya
2 years 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
2 years 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 2 years ago by thakordarshil (previous) (diff)

@thakordarshil
2 years ago

Patch Added

@shwetabathani2312
2 years 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
2 years ago

  • Keywords has-patch needs-testing-info added

#4 @sabernhardt
10 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
5 months 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

#6 @wordpressdotorg
2 months ago

  • Keywords needs-test-info added; needs-testing-info removed
Note: See TracTickets for help on using tickets.