Make WordPress Core

#52452 closed defect (bug) (fixed)

Border color plugin update row incorrect color on mobile

Reported by: afragen Owned by: ryelle
Milestone: 5.7 Priority: normal
Severity: normal Version: 5.7
Component: Plugins Keywords: has-screenshots has-patch commit
Focuses: ui, css, administration Cc:

Description (last modified by afragen)

When an activated plugin has an update the update row has a background color of #f0f6fc

As of r50025 the background color has changed to #fff. This is in wp-admin/css/list-tables.css:2090

On mobile this results in a white block on the left of the update row.

Attachments (4)

mobile-plugin-update-row.png (70.5 KB) - added by afragen 12 months ago.
Screenshot_20210212-153356.png (318.3 KB) - added by dariak 12 months ago.
tested with 5.7 beta2
updated.png (95.5 KB) - added by afragen 11 months ago.
52452.diff (495 bytes) - added by ryelle 11 months ago.

Download all attachments as: .zip

Change History (23)

#1 @hellofromTonya
12 months ago

  • Version set to trunk

This ticket was mentioned in Slack in #core by hellofromtonya. View the logs.


12 months ago

#3 @hellofromTonya
12 months ago

Hello @afragen,

Thank you for opening this ticket.

As this change occurred from Ticket #49999 and in changeset [50025], pinging @ryelle for visibility and opinion.

#4 @afragen
12 months ago

  • Description modified (diff)

#5 @afragen
12 months ago

  • Description modified (diff)

#6 @SergeyBiryukov
12 months ago

  • Component changed from General to Plugins
  • Focuses ui administration added

This ticket was mentioned in PR #980 on WordPress/wordpress-develop by ryelle.


12 months ago

  • Keywords has-patch added

This also removes a redundant rule which is immediately overwritten.

Screenshot of this branch:
<img width="421" alt="Screen Shot 2021-02-05 at 6 37 15 PM" src="https://user-images.githubusercontent.com/541093/107100063-3df98f80-67e1-11eb-9e72-69e2ad719ae8.png">

Trac ticket: https://core.trac.wordpress.org/ticket/52452

#8 @ryelle
12 months ago

Added a PR to fix the background color - there's a new screenshot in the PR description.

#9 @SergeyBiryukov
12 months ago

  • Keywords commit added

#10 @afragen
12 months ago

I just tested this patch. It works, thanks @ryelle !

#11 @ryelle
12 months ago

  • Owner set to ryelle
  • Resolution set to fixed
  • Status changed from new to closed

In 50237:

Administration: Fix background color of plugin update row on small screens.

When the color change was done, the background of plugins with updates had to be manually changed. This section was missed, which caused a visual bug. This fix also removes some redundant CSS for the same element.

Follow-up to [50025].
Props afragen.
Fixes #52452.

#12 @prbot
12 months ago

ryelle commented on PR #980:

Committed in r50237.

This ticket was mentioned in Slack in #core by monikarao. View the logs.


12 months ago

#14 @dariak
12 months ago

As this bug was found in trunk, I could not reproduce it on current 5.6.1 version.
I have tested it on 5.7 beta2 version and could verify that the white block is not shown. Tested on different device emulators + real mobile (Galaxy S6).

@dariak
12 months ago

tested with 5.7 beta2

@afragen
11 months ago

#15 @afragen
11 months ago

  • Resolution fixed deleted
  • Status changed from closed to reopened

@ryelle it seems there's a part 2 to this. Referring to what happens after the update is done.

Seems like an easy fix. Add .plugins .active.updated + .plugin-update-tr:before to the selectors in list-tables.css:2084

This ticket was mentioned in Slack in #core by afragen. View the logs.


11 months ago

@ryelle
11 months ago

#17 @ryelle
11 months ago

Good catch @afragen - it looks like this was actually an existing problem on 5.6 too. The patch I've attached should fix the issue.

#18 @afragen
11 months ago

@ryelle your patch is identical to what I did to test. It works!

#19 @ryelle
11 months ago

  • Resolution set to fixed
  • Status changed from reopened to closed

In 50385:

Administration: Apply background color to updated message in plugin list table.

Follow-up to [50025].
Props afragen.
Fixes #52452.

Note: See TracTickets for help on using tickets.