Fix: Restore the zebra striped styling on the Privacy tables - #13329
Fix: Restore the zebra striped styling on the Privacy tables#13329hbhalodia wants to merge 1 commit into
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 Core Committers: Use this line as a base for the props when committing in SVN: To understand the WordPress project's expectations around crediting contributors, please review the Contributor Attribution page in the Core Handbook. |
Test using WordPress PlaygroundThe changes in this pull request can previewed and tested using a WordPress Playground instance. WordPress Playground is an experimental project that creates a full WordPress instance entirely within the browser. Some things to be aware of
For more details about these limitations and more, check out the Limitations page in the WordPress Playground documentation. |
Trac ticket: https://core.trac.wordpress.org/ticket/65994
Screenshots
Use of AI Tools
This Pull Request is for code review only. Please keep all other discussion in the Trac ticket. Do not merge this Pull Request. See GitHub Pull Requests for Code Review in the Core Handbook for more details.
AI Summary
Problem
The Export/Erase Personal Data list tables carry the
stripedclass like every other list table, but CSS informs.cssforced every body cell tobackground: #fff, cancelling the striping. This made these two screens inconsistent with the rest of the admin and dropped a useful visual aid for scanning rows.Why the override existed
It was not a decision about striping. When the screens were added in r42967 (#43481), the row background was used to carry status: confirmed requests were tinted pale blue (
#f7fcfe) and failed ones pale peach (#fef7f1). Striping and status tinting can't both own the row background, so white was the neutral ground the design needed. Rows were separated by a 1px inset shadow instead.That reason is gone: r63010 (#65787) moved status colour off the row and onto the checkbox column's left border, so nothing competes for the row background any more.
Changes
background: #ffffrom.privacy_requests tbody td.check-columnand.privacy_requests tbody td:not(.check-column), .privacy_requests tbody th. This is the actual fix — cells return to transparent and the striping shows through.border-lefton the status gutter from#ffftotransparent, so it no longer paints a white sliver across grey rows.background-color: #f6f7f7from.status-request-failed td.check-column. That is the exact zebra stripe colour, so the "failed" highlight would have been invisible on every other row. The redborder-left-colorand the red.status-labelalready convey it.background-color: #ffffrom.status-request-confirmed td.check-column, which would have punched a white gap through the stripes..has-request-resultsand.request-results(see below).Keeping an expanded request and its results together
privacy-tools.jsinjects a real<tr class="request-results">after a request row when you click Download/Erase. With striping restored, that injected row lands on the opposite stripe from the request it belongs to, so the two would read as unrelated rows instead of one result.Both rows are now pinned to a single shared background so the pair still reads as one unit:
Known trade-off: the injected row shifts
nth-childparity, so rows below the expanded pair swap stripe colours. This isn't fixable in pure CSS, and it only occurs in a transient, user-triggered state, so it's left as-is rather than adding JS re-striping. Happy to change that if reviewers prefer.Testing instructions
#f6f7f7, matching other list tables.