WordPress.org

Make WordPress Core

Opened 4 years ago

Last modified 7 days ago

#33833 reopened enhancement

Quick/Bulk Edit are not visually consistent

Reported by: helen Owned by:
Milestone: 5.4 Priority: normal
Severity: normal Version:
Component: Quick/Bulk Edit Keywords: needs-patch needs-design-feedback
Focuses: ui, administration Cc:
PR Number:

Description

Quick/Bulk Edit are not visually consistent between uses (posts vs. comments, for example), and have typography treatment that we don't really use elsewhere in the admin, like all-caps and italic labels. It really hasn't changed much in quite some time.

This needs some considered design treatment. Screenshots attached below.

Attachments (12)

Screen Shot 2015-09-11 at 12.42.28 PM.png (51.0 KB) - added by helen 4 years ago.
Post quick edit
Screen Shot 2015-09-11 at 12.42.42 PM.png (41.1 KB) - added by helen 4 years ago.
Post quick edit, responsive
Screen Shot 2015-09-11 at 12.43.16 PM.png (35.3 KB) - added by helen 4 years ago.
Comment quick edit
Screen Shot 2015-09-11 at 12.43.29 PM.png (36.2 KB) - added by helen 4 years ago.
Comment quick edit, responsive
comment-page-responsive.png (57.9 KB) - added by sanket.parmar 4 years ago.
Hi @helen
comment-page-responsive.2.png (57.9 KB) - added by sanket.parmar 4 years ago.
Hi @helen
33833.PNG (31.7 KB) - added by antpb 18 months ago.
This looks to be fixed in #33596. Screenshot to verify below. Closing this as I am finding tickets for WCEU Contributor day.
Screen Shot 2019-04-11 at 10.51.31 PM.png (104.1 KB) - added by garrett-eclipse 8 months ago.
Quick Edit - Page
Screen Shot 2019-04-11 at 10.51.42 PM.png (123.3 KB) - added by garrett-eclipse 8 months ago.
Quick Edit - Post
Screen Shot 2019-04-11 at 10.52.20 PM.png (146.7 KB) - added by garrett-eclipse 8 months ago.
Quick Edit - Comment
Screen Shot 2019-04-11 at 11.00.19 PM.png (79.4 KB) - added by garrett-eclipse 8 months ago.
Bulk Edit - Page
Screen Shot 2019-04-11 at 11.00.45 PM.png (110.5 KB) - added by garrett-eclipse 8 months ago.
Bulk Edit - Posts

Download all attachments as: .zip

Change History (24)

@helen
4 years ago

Post quick edit

@helen
4 years ago

Post quick edit, responsive

@helen
4 years ago

Comment quick edit

@helen
4 years ago

Comment quick edit, responsive

This ticket was mentioned in Slack in #design by helen. View the logs.


4 years ago

#2 @sanket.parmar
4 years ago

Hi @helen,

Please see above attachment for comment quick edit. This is not responsive.

#3 @helen
4 years ago

@sanket.parmar Correct, that is being tracked in #33596. Screenshots are with fixes to better reflect the proper state.

@antpb
18 months ago

This looks to be fixed in #33596. Screenshot to verify below. Closing this as I am finding tickets for WCEU Contributor day.

#4 @antpb
18 months ago

  • Keywords close added; needs-patch removed
  • Resolution set to fixed
  • Status changed from new to closed

#5 follow-up: @netweb
17 months ago

  • Keywords needs-patch added; close removed
  • Resolution fixed deleted
  • Status changed from closed to reopened

I believe the inconsistencies are still present, a set of current screenshots comparing those already submitted to this ticket would be beneficial to check on any progress made thus far.

#6 in reply to: ↑ 5 ; follow-up: @garrett-eclipse
8 months ago

  • Keywords needs-design-feedback added

Replying to netweb:

I believe the inconsistencies are still present, a set of current screenshots comparing those already submitted to this ticket would be beneficial to check on any progress made thus far.

Hi @netweb, I've uploaded fresh Quick/Bulk Edit screens for the default post types. Media doesn't currently support (but may w/ #12208) either Bulk or Quick edit actions. Comments doesn't support the Bulk Edit action.

Reviewing them the available Bulk Edit actions are consistent (to my eyes at least), while the Quick Edit actions are consistent between Posts and Pages but slightly different in the Comments.

So the focus would be the consistentcy between Posts/Pages and Comments in Quick Edit. The inconsistencies I can identify are;

  • The Quick Edit section for Posts/Pages identifies itself with 'QUICK EDIT' heading before the fields. Comments just starts with 'Edit Comment'.
  • The field labels in Posts/Pages is italics.
  • The field labels in Posts/Pages seem to have more space between them and the field.
  • The actions for Posts/Pages is 'Cancel' bottom left and 'Update' bottom right, for Comments both actions are bottom left with the update action label being 'Update Comment'. That string can probably be dropped to just use 'Update'.

I've added needs-design-feedback to compare and decide on which field label styling and heading/button approach be used.

#7 @garrett-eclipse
8 months ago

One other minor aesthetic change between the Posts/Pages vs Comments 'Quick Edit' is the background. On Posts/Pages the background stays what the original row is. While in Comments the zebra striping changes when Quick Edit is enabled making the background change from it's original row.
Edit - This seems to be identified via #25060 and #31006

Last edited 8 months ago by garrett-eclipse (previous) (diff)

#8 in reply to: ↑ 6 @netweb
8 months ago

Replying to garrett-eclipse:

I've added needs-design-feedback to compare and decide on which field label styling and heading/button approach be used.

Thanks @garrett-eclipse, sounds good to me 👍

This ticket was mentioned in Slack in #design by karmatosed. View the logs.


7 weeks ago

#10 @nrqsnchz
7 weeks ago

Discussed during today's design triage meeting(https://wordpress.slack.com/archives/C02S78ZAL/p1571675443285400) in Slack.

The team agrees that updating these to achieve consistency is desirable.

#11 @garrett-eclipse
7 weeks ago

  • Milestone changed from Future Release to 5.4

#12 @melchoyce
7 days ago

The Quick Edit section for Posts/Pages identifies itself with 'QUICK EDIT' heading before the fields. Comments just starts with 'Edit Comment'.

You get to this interface by clicking the "Quick Edit" action, so I think the heading should also say "QUICK EDIT" like it does on Posts/Pages.

The field labels in Posts/Pages is italics.

We're trying to eliminate italics from the admin — see #47327. All of the Quick Edit labels should be styled normally, without italics. We should probably match the label styling in settings and make all Quick Edit labels semibold. (They're also much larger in the Settings page, but we can't increase the size without totally breaking the Quick Edit layout.)

The field labels in Posts/Pages seem to have more space between them and the field.

We should probably use Settings as the standard here too, and make them all 4px spacing between label and input.

The actions for Posts/Pages is 'Cancel' bottom left and 'Update' bottom right, for Comments both actions are bottom left with the update action label being 'Update Comment'. That string can probably be dropped to just use 'Update'.

We're talking about this in #48644, we should probably wait on a decision there and then apply it here.

Note: See TracTickets for help on using tickets.