WordPress.org

Make WordPress Core

Opened 16 months ago

Last modified 3 months ago

#48546 new enhancement

Styling of the posts and pages in the dashboard is not

Reported by: Y_Kolev Owned by:
Milestone: Future Release Priority: normal
Severity: normal Version:
Component: Posts, Post Types Keywords: has-patch needs-refresh
Focuses: ui, css, administration Cc:

Description

If you open the list with all pages or all posts on WP version 5.4-alpha-46582-src
All the buttons below each post are not properly aligned, and there is too much between each other. This issue comes from the added display: grid;

Screenshot - http://prntscr.com/pukqwh
Screenshot without the display: grid - http://prntscr.com/pukqnn

Attachments (4)

grid.png (358.0 KB) - added by Y_Kolev 16 months ago.
removed grid.png (382.5 KB) - added by Y_Kolev 16 months ago.
with disabled grid
48546.patch (461 bytes) - added by aliveic 16 months ago.
A patch by using the flex approach.
48546.diff (475 bytes) - added by aliveic 16 months ago.
A patch by retaining the grid approach.

Download all attachments as: .zip

Change History (9)

@Y_Kolev
16 months ago

@Y_Kolev
16 months ago

with disabled grid

#1 @SergeyBiryukov
16 months ago

  • Component changed from Administration to Posts, Post Types
  • Focuses administration added

#2 @aliveic
16 months ago

This patch uses a basic approach of changing the display property to flex and adding a flex-wrap: wrap to the instance as can be seen in the attached file. However this is a major change of the display:grid logic so I will also upload a second patch which fixes the issue by utilizing the 'grid'.

Feel free to comment.

#wordcamp #wordcampsofia #wcsof

Last edited 16 months ago by aliveic (previous) (diff)

@aliveic
16 months ago

A patch by using the flex approach.

@aliveic
16 months ago

A patch by retaining the grid approach.

This ticket was mentioned in Slack in #core-css by sabernhardt. View the logs.


3 months ago

#5 @sabernhardt
3 months ago

  • Focuses css added
  • Keywords has-patch needs-refresh added
  • Milestone changed from Awaiting Review to Future Release

I'd like to see an iteration (or more than one) on the flexbox approach. It still would need something else—possibly a min-width, larger side margin, or a flex-based property with enough browser support.

The display: flex and flex-wrap parts could replace the grid styles within the current body:not(.plugins-php) .row-actions selector.

Note: See TracTickets for help on using tickets.