Make WordPress Core

Opened 5 months ago

Last modified 5 days ago

#60424 new defect (bug)

Twenty Fifteen: fix Table block's Stripes style

Reported by: nidhidhandhukiya's profile nidhidhandhukiya Owned by:
Milestone: 6.7 Priority: normal
Severity: normal Version: 6.4.3
Component: Bundled Theme Keywords: has-patch
Focuses: css Cc:

Description

Steps to reproduce the issue :-

  1. Activate Twenty Fifteen theme.
  2. Choose Table block.
  3. Choose stripes from style.

Now check both the side editor end front end.
Design not looks same both the side it should be same in both the side.

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

Attachments (4)

60424.patch (910 bytes) - added by nidhidhandhukiya 5 months ago.
60424.2.patch (1.3 KB) - added by sabernhardt 8 weeks ago.
adding .is-style-stripes class to cell border styles to prevent block styles from overriding theme, removing bottom border from block (figure) element
Capture d’écran 2024-06-13 à 14.33.35.png (146.5 KB) - added by audrasjb 9 days ago.
After applying patch: doesn't work
Capture d’écran 2024-06-13 à 15.00.08.png (173.5 KB) - added by audrasjb 9 days ago.
After applying new PR: "even" rows are now white :)

Download all attachments as: .zip

Change History (19)

#1 @karmatosed
3 months ago

  • Keywords needs-testing added

#2 @karmatosed
3 months ago

  • Keywords has-patch added

#3 @karmatosed
2 months ago

  • Milestone changed from Awaiting Review to Future Release

@sabernhardt
8 weeks ago

adding .is-style-stripes class to cell border styles to prevent block styles from overriding theme, removing bottom border from block (figure) element

#4 @sabernhardt
8 weeks ago

  • Summary changed from Twenty Fifteen Table block having different design in editor and frontend. to Twenty Fifteen: fix Table block's Stripes style

I did not add a background color because that is an iframe editor issue (GB57176). If that would be fixed in individual themes, it would be better to assign the background color to .editor-styles-wrapper for the whole canvas.

The block styles for Stripes were more specific than the theme's, so I added the extra class (and kept the original selectors). The patch also removes the bottom border from the block, but only if it is a figure (the classes were on the table in WordPress 5.0 but moved to the figure by 5.3).

#5 @karmatosed
4 weeks ago

  • Milestone changed from Future Release to 6.6

Let's see about getting this into the next version. I have updated the milestone.

#6 @hmbashar
13 days ago

Test Report

Patch tested: 60424.patch and also I've tested this 60424.2.patch

Environment

  • WordPress: 6.6-alpha-57778-src
  • PHP: 8.3.7
  • Server: nginx/1.25.4
  • Database: mysqli (Server: 8.3.0 / Client: mysqlnd 8.3.7)
  • Browser: Chrome 125.0.0.0
  • OS: macOS
  • Theme: Twenty Fifteen 3.7
  • MU Plugins: None activated
  • Plugins:
    • FakerPress 0.6.6
    • Test Reports 1.1.0

Actual Results

  1. there is no changed

Screenshots

Editor Before Patch Editor After Patch
https://i.ibb.co/v4jWsL9/Editor-Before-Patch.pnghttps://i.ibb.co/x6vYfkv/Editor-After-Patch.png
Frontend Before Patch Frontend After Patch
https://i.ibb.co/xg5F126/Frontend-before-patch.pnghttps://i.ibb.co/dJhg2ch/Frontend-After-Patch.png

#7 @hmbashar
13 days ago

Hello @nidhidhandhukiya,

I've tested a few tickets submitted by you. Your instructions are good and easy to understand for testing. However, I've noticed that you're sharing video instructions for better understanding. Unfortunately, I can't watch any of your videos from the links you provided. It seems the links expire a few days after submission.

Therefore, I request that when you share your videos, please upload them as attachments or ensure the video URLs remain active for testing and viewing.

Best Regards
Bashar

#8 follow-up: @karmatosed
9 days ago

@hmbashar when you say no change do you mean this is passed in testing because I am trying to be clear that you are happy as I do see visual differences.

#9 in reply to: ↑ 8 @hmbashar
9 days ago

Replying to karmatosed:

@hmbashar when you say no change do you mean this is passed in testing because I am trying to be clear that you are happy as I do see visual differences.

I didn't notice any changes before or after applying the patch, so perhaps the patch didn't solve the issue. Maybe more work is needed with the patch.

@audrasjb
9 days ago

After applying patch: doesn't work

#11 @audrasjb
9 days ago

  • Keywords changes-requested added; needs-testing removed

I can confirm the proposed patch doesn't work in the editor.

#12 @sabernhardt
9 days ago

  • Focuses css added
  • Milestone changed from 6.6 to Future Release

I think the main problem in testing this now is that the theme's gray table border #eaeaea and the Stripes background #f0f0f0 nearly match the admin CSS gray background #f0f0f1, but the patch probably could be improved anyway. When the iframe editor is fixed, this should be a little easier.

#13 @audrasjb
9 days ago

  • Milestone changed from Future Release to 6.6

The previous patch didn't work because of the grey background used in T15.

I suggested another approach in the above PR. See screenshot below.

@audrasjb
9 days ago

After applying new PR: "even" rows are now white :)

#14 @audrasjb
9 days ago

  • Keywords changes-requested removed

@sabernhardt ah yes the iframed editor could make it easier to fix it though.
Then even if my solution works great, I'm not sure it's worth fixing this issue in 6.6 you're right.

#15 @sabernhardt
5 days ago

  • Milestone changed from 6.6 to 6.7

Moving this to 6.7 instead of Future

Note: See TracTickets for help on using tickets.