WordPress-C
/
WordPress
mirror of https://github.com/WordPress/WordPress.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

List tables: A better responsive view. 

Instead of truncating columns, the data that's already in the markup can now be toggled into view. Only seems appropriate to celebrate four years of contributing by finally doing the first thing I ever mocked up.

Known issues / concerns:
* Custom list tables that don't define a primary column will show nothing at all. These are not extremely common, as `WP_List_Table` isn't really recommended for plugin consumption, but it happens. We need to come up with some kind of fallback.
* Some visual elements, particularly whitespace, could use refining.
* Needs a11y review.
* Touch performance on iOS feels sluggish - is there anything we can do about that?
* Would this be better accordion-style (only one expanded at a time)?
* Is `wp_strip_all_tags()` good enough for column titles that have HTML in them? It's essentially a workaround for the fact that core's comments column does that for the icon, which maybe it shouldn't. Perhaps worth another ticket, as a markup change would be fairly independent.
* Visual hierarchy is not great when expanded (also worthy of another ticket).
* Quick edit now becomes noticeably more annoying to cancel out of, as you have to scroll all the way down and you lose your position from before it was opened. Again, worthy of another ticket.

props Michael Arestad, helen.
see #32395.

Built from https://develop.svn.wordpress.org/trunk@33016


git-svn-id: http://core.svn.wordpress.org/trunk@32987 1a063a9b-81f0-0310-95a4-ce76da25c4cd
This commit is contained in:
Helen Hou-Sandí 2015-07-01 01:31:25 +00:00
parent 8f85bb1ac5
commit 8eb7f71e6b
15 changed files with 395 additions and 368 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

273
wp-admin/css/list-tables-rtl.css
View File

@ -428,6 +428,60 @@ th.asc a:focus span.sorting-indicator:before {
content: '\f140'; content: '\f140';
} }
.wp-list-table .toggle-row {
position: absolute;
left: 8px;
top: 10px;
display: none;
padding: 0;
width: 40px;
height: 40px;
border: none;
outline: none;
background: transparent;
}
.wp-list-table .toggle-row:hover {
cursor: pointer;
}
.wp-list-table .toggle-row:focus {
-webkit-box-shadow:
0 0 0 1px #5b9dd9,
0 0 2px 1px rgba(30, 140, 190, .8);
box-shadow:
0 0 0 1px #5b9dd9,
0 0 2px 1px rgba(30, 140, 190, .8);
}
.ie8 .wp-list-table .toggle-row:focus {
outline: #5b9dd9 solid 1px;
}
.wp-list-table .toggle-row:active {
-webkit-box-shadow: none;
box-shadow: none;
}
.wp-list-table .toggle-row:before {
position: absolute;
top: 0;
right: 10px;
display: block;
padding: 0;
color: #666;
content: '\f140';
font: normal 20px/1 'dashicons';
line-height: 10px;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
speak: none;
}
.wp-list-table .is-expanded .toggle-row:before {
content: '\f142';
}
tr.wp-locked .locked-indicator { tr.wp-locked .locked-indicator {
margin-right: 6px; margin-right: 6px;
height: 20px; height: 20px;
@ -1303,7 +1357,8 @@ tr.active.update + tr.plugin-update-tr .plugin-update {
content: '\f147'; content: '\f147';
} }
.plugins .plugin-update-tr .plugin-update { .wp-list-table.plugins tbody tr.plugin-update-tr td.plugin-update {
overflow: hidden; /* clearfix */
padding: 0; padding: 0;
-webkit-box-shadow: inset 0 -1px 0 rgba(0,0,0,0.1); -webkit-box-shadow: inset 0 -1px 0 rgba(0,0,0,0.1);
box-shadow: inset 0 -1px 0 rgba(0,0,0,0.1); box-shadow: inset 0 -1px 0 rgba(0,0,0,0.1);
@ -1676,32 +1731,75 @@ div.action-links,
font-size: 14px; font-size: 14px;
} }
/* Columns to hide */ .wp-list-table th:not(.column-primary),
.fixed .column-date, .wp-list-table th:not(.column-primary),
.fixed .column-author, .wp-list-table tr:not(.inline-edit-row) td:not(.column-primary):not(.check-column) {
.column-categories,
.column-tags,
.tags .column-description,
.media .column-parent,
.media .column-comments,
.users .column-email,
.users .column-name,
.sites .column-registered,
.sites .column-users {
display: none; display: none;
} }
/* Checkboxes need to show */
.wp-list-table tr th.check-column {
display: table-cell;
width: 35px;
}
.wp-list-table .toggle-row {
display: block;
}
.wp-list-table tr:not(.inline-edit-row) td:not(.check-column) {
position: relative;
clear: both;
display: block;
width: auto !important; /* needs to override some columns that are more specifically targeted */
}
.wp-list-table td.column-primary {
padding-left: 50px; /* space for toggle button */
}
.wp-list-table tr:not(.inline-edit-row) td:not(.column-primary):not(.check-column) {
padding: 3px 35% 3px 8px;
}
.wp-list-table tr:not(.inline-edit-row) td:not(.column-primary)::before {
position: absolute;
right: 10px; /* match padding of regular table cell */
display: block;
overflow: hidden;
width: 32%; /* leave a little space for a gutter */
content: attr(data-colname);
white-space: nowrap;
text-overflow: ellipsis;
}
.wp-list-table .is-expanded td:not(.hidden) {
display: block !important;
overflow: hidden; /* clearfix */
}
/* Special cases */
.widefat .num,
.column-posts {
text-align: right;
}
#comments-form .fixed .column-author {
display: none !important;
}
.fixed .column-comment .comment-author { .fixed .column-comment .comment-author {
display: block; display: block;
} }
/* Posts */ #the-comment-list .is-expanded td {
.column-title { -webkit-box-shadow: none;
width: 85%; box-shadow: none;
} }
.fixed .column-comments, .widefat .check-column { #the-comment-list .is-expanded td:last-child {
width: 35px -webkit-box-shadow: inset 0 -1px 0 rgba(0, 0, 0, 0.1);
box-shadow: inset 0 -1px 0 rgba(0, 0, 0, 0.1);
} }
.widefat thead .check-column, .widefat tfoot .check-column { .widefat thead .check-column, .widefat tfoot .check-column {
@ -1712,11 +1810,6 @@ div.action-links,
word-wrap: normal; word-wrap: normal;
} }
/* Media */
.media .column-title {
width: auto;
}
/* Quick Edit and Bulk Edit */ /* Quick Edit and Bulk Edit */
#wpbody-content .quick-edit-row-post .inline-edit-col-left, #wpbody-content .quick-edit-row-post .inline-edit-col-left,
#wpbody-content .quick-edit-row-post .inline-edit-col-right, #wpbody-content .quick-edit-row-post .inline-edit-col-right,
@ -1792,30 +1885,6 @@ div.action-links,
height: 22px; height: 22px;
} }
/* Taxonomies */
.tags .column-posts {
width: 74px;
}
.tags .column-slug {
width: 30%;
}
/* Comments */
.comments .column-response {
width: 35%;
}
/* Users */
.users .column-role {
width: 35%;
}
/* Network admin sites */
.sites .column-blogname {
width: 55%;
}
/* Updates */ /* Updates */
#wpbody-content #update-themes-table .plugin-title { #wpbody-content #update-themes-table .plugin-title {
width: auto; width: auto;
@ -1831,32 +1900,18 @@ div.action-links,
} }
/* Plugin/Theme Management Page */ /* Plugin/Theme Management Page */
.wp-list-table.plugins { .wp-list-table.plugins .toggle-row {
position: relative;
margin-bottom: 15px;
}
#wpbody-content .wp-list-table.plugins thead .column-description,
#wpbody-content .wp-list-table.plugins tfoot .column-description,
.wp-list-table.plugins th#description {
display: none; display: none;
} }
#wpbody-content .wp-list-table.plugins, #wpbody-content .wp-list-table.plugins td {
#wpbody-content .wp-list-table.plugins thead,
#wpbody-content .wp-list-table.plugins tbody,
#wpbody-content .wp-list-table.plugins tr,
#wpbody-content .wp-list-table.plugins .column-description,
#wpbody-content .wp-list-table.plugins .plugin-title,
#wpbody-content .wp-list-table.plugins .theme-title,
#wpbody-content .wp-list-table.plugins .plugin-update,
#wpbody-content .wp-list-table.plugins .manage-column.column-name {
display: block; display: block;
width: auto; width: auto;
padding: 10px 9px; /* reset from other list tables that have a label at this width */
} }
.active, .inactive { #wpbody-content .wp-list-table.plugins .column-description {
padding-top: 0; padding-top: 2px;
} }
.wp-list-table.plugins .plugin-title, .wp-list-table.plugins .plugin-title,
@ -1865,11 +1920,9 @@ div.action-links,
padding-bottom: 4px; padding-bottom: 4px;
} }
.plugins tr.active + tr.inactive th.check-column,
.plugins tr.active + tr.inactive td, .plugins tr.active + tr.inactive td,
.wp-list-table.plugins .plugin-title, .wp-list-table.plugins .plugin-title,
.wp-list-table.plugins .theme-title, .wp-list-table.plugins .theme-title {
.wp-list-table.plugins tbody th {
-webkit-box-shadow: none; -webkit-box-shadow: none;
box-shadow: none; box-shadow: none;
} }
@ -1878,7 +1931,9 @@ div.action-links,
padding: 1px 0 0; padding: 1px 0 0;
} }
.plugins tr.active + tr.inactive td.column-description { .plugins tr.active + tr.inactive th.check-column,
.plugins tr.active + tr.inactive td.column-description,
.plugins .plugin-update-tr:before {
-webkit-box-shadow: inset 0 -1px 0 rgba(0, 0, 0, 0.1); -webkit-box-shadow: inset 0 -1px 0 rgba(0, 0, 0, 0.1);
box-shadow: inset 0 -1px 0 rgba(0, 0, 0, 0.1); box-shadow: inset 0 -1px 0 rgba(0, 0, 0, 0.1);
} }
@ -1888,69 +1943,23 @@ div.action-links,
border-top: none; border-top: none;
} }
.wp-list-table.plugins .column-description { /* mimic the checkbox th */
padding-top: 0; .plugins .plugin-update-tr:before {
content: '';
display: table-cell;
} }
.wp-list-table.plugins .manage-column.column-name, .plugins .active.update + .plugin-update-tr:before {
.wp-list-table.plugins .column-description, border-right: 4px solid #d54e21;
.wp-list-table.plugins .plugin-title, background-color: #fef7f1;
.wp-list-table.plugins .theme-title {
padding-left: 12px;
padding-right: 46px;
} }
.wp-list-table.plugins .manage-column.column-name { .plugins .plugin-update-tr .plugin-update {
padding-top: 11px; border-right: none;
padding-bottom: 12px;
} }
.wp-list-table.plugins .manage-column.column-name.sortable { .plugin-update-tr .update-message {
padding: 4px 36px 4px 12px; margin-right: 0;
}
.wp-list-table.plugins tr {
position: relative;
}
.wp-list-table.plugins th.check-column,
.wp-list-table.plugins thead td.check-column,
.wp-list-table.plugins tfoot td.check-column,
.wp-list-table.plugins tr.update th.check-column {
position: absolute;
height: auto;
top: 0;
bottom: 0;
right: 0;
padding-right: 2px;
padding-top: 18px;
}
.wp-list-table.plugins thead td.check-column,
.wp-list-table.plugins tfoot td.check-column {
padding-right: 3px;
padding-top: 11px;
background: none;
}
.plugins tbody th.check-column input[type="checkbox"] {
margin-top: -3px;
margin-right: 9px;
}
.plugins tbody .active th.check-column input[type="checkbox"],
.plugins tbody .active.update th.check-column input[type="checkbox"] {
margin-right: 5px;
}
.wp-list-table.plugins thead .check-column input,
.wp-list-table.plugins tfoot .check-column input {
margin-top: -2px;
margin-right: 8px;
}
.wp-list-table.plugins .active th.check-column {
background: none;
} }
.wp-list-table.plugins .plugin-title strong, .wp-list-table.plugins .plugin-title strong,
@ -1991,13 +2000,3 @@ div.action-links,
box-shadow: inset 0 -1px 0 rgba(0,0,0,0.1); box-shadow: inset 0 -1px 0 rgba(0,0,0,0.1);
} }
} }
/* Smartphone */
@media screen and (max-width: 600px) {
/* Remove slug column from taxonomy list page
and role column from users list page */
.tags .column-slug,
.users .column-role {
display: none;
}
}

273
wp-admin/css/list-tables.css
View File

@ -428,6 +428,60 @@ th.asc a:focus span.sorting-indicator:before {
content: '\f140'; content: '\f140';
} }
.wp-list-table .toggle-row {
position: absolute;
right: 8px;
top: 10px;
display: none;
padding: 0;
width: 40px;
height: 40px;
border: none;
outline: none;
background: transparent;
}
.wp-list-table .toggle-row:hover {
cursor: pointer;
}
.wp-list-table .toggle-row:focus {
-webkit-box-shadow:
0 0 0 1px #5b9dd9,
0 0 2px 1px rgba(30, 140, 190, .8);
box-shadow:
0 0 0 1px #5b9dd9,
0 0 2px 1px rgba(30, 140, 190, .8);
}
.ie8 .wp-list-table .toggle-row:focus {
outline: #5b9dd9 solid 1px;
}
.wp-list-table .toggle-row:active {
-webkit-box-shadow: none;
box-shadow: none;
}
.wp-list-table .toggle-row:before {
position: absolute;
top: 0;
left: 10px;
display: block;
padding: 0;
color: #666;
content: '\f140';
font: normal 20px/1 'dashicons';
line-height: 10px;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
speak: none;
}
.wp-list-table .is-expanded .toggle-row:before {
content: '\f142';
}
tr.wp-locked .locked-indicator { tr.wp-locked .locked-indicator {
margin-left: 6px; margin-left: 6px;
height: 20px; height: 20px;
@ -1303,7 +1357,8 @@ tr.active.update + tr.plugin-update-tr .plugin-update {
content: '\f147'; content: '\f147';
} }
.plugins .plugin-update-tr .plugin-update { .wp-list-table.plugins tbody tr.plugin-update-tr td.plugin-update {
overflow: hidden; /* clearfix */
padding: 0; padding: 0;
-webkit-box-shadow: inset 0 -1px 0 rgba(0,0,0,0.1); -webkit-box-shadow: inset 0 -1px 0 rgba(0,0,0,0.1);
box-shadow: inset 0 -1px 0 rgba(0,0,0,0.1); box-shadow: inset 0 -1px 0 rgba(0,0,0,0.1);
@ -1676,32 +1731,75 @@ div.action-links,
font-size: 14px; font-size: 14px;
} }
/* Columns to hide */ .wp-list-table th:not(.column-primary),
.fixed .column-date, .wp-list-table th:not(.column-primary),
.fixed .column-author, .wp-list-table tr:not(.inline-edit-row) td:not(.column-primary):not(.check-column) {
.column-categories,
.column-tags,
.tags .column-description,
.media .column-parent,
.media .column-comments,
.users .column-email,
.users .column-name,
.sites .column-registered,
.sites .column-users {
display: none; display: none;
} }
/* Checkboxes need to show */
.wp-list-table tr th.check-column {
display: table-cell;
width: 35px;
}
.wp-list-table .toggle-row {
display: block;
}
.wp-list-table tr:not(.inline-edit-row) td:not(.check-column) {
position: relative;
clear: both;
display: block;
width: auto !important; /* needs to override some columns that are more specifically targeted */
}
.wp-list-table td.column-primary {
padding-right: 50px; /* space for toggle button */
}
.wp-list-table tr:not(.inline-edit-row) td:not(.column-primary):not(.check-column) {
padding: 3px 8px 3px 35%;
}
.wp-list-table tr:not(.inline-edit-row) td:not(.column-primary)::before {
position: absolute;
left: 10px; /* match padding of regular table cell */
display: block;
overflow: hidden;
width: 32%; /* leave a little space for a gutter */
content: attr(data-colname);
white-space: nowrap;
text-overflow: ellipsis;
}
.wp-list-table .is-expanded td:not(.hidden) {
display: block !important;
overflow: hidden; /* clearfix */
}
/* Special cases */
.widefat .num,
.column-posts {
text-align: left;
}
#comments-form .fixed .column-author {
display: none !important;
}
.fixed .column-comment .comment-author { .fixed .column-comment .comment-author {
display: block; display: block;
} }
/* Posts */ #the-comment-list .is-expanded td {
.column-title { -webkit-box-shadow: none;
width: 85%; box-shadow: none;
} }
.fixed .column-comments, .widefat .check-column { #the-comment-list .is-expanded td:last-child {
width: 35px -webkit-box-shadow: inset 0 -1px 0 rgba(0, 0, 0, 0.1);
box-shadow: inset 0 -1px 0 rgba(0, 0, 0, 0.1);
} }
.widefat thead .check-column, .widefat tfoot .check-column { .widefat thead .check-column, .widefat tfoot .check-column {
@ -1712,11 +1810,6 @@ div.action-links,
word-wrap: normal; word-wrap: normal;
} }
/* Media */
.media .column-title {
width: auto;
}
/* Quick Edit and Bulk Edit */ /* Quick Edit and Bulk Edit */
#wpbody-content .quick-edit-row-post .inline-edit-col-left, #wpbody-content .quick-edit-row-post .inline-edit-col-left,
#wpbody-content .quick-edit-row-post .inline-edit-col-right, #wpbody-content .quick-edit-row-post .inline-edit-col-right,
@ -1792,30 +1885,6 @@ div.action-links,
height: 22px; height: 22px;
} }
/* Taxonomies */
.tags .column-posts {
width: 74px;
}
.tags .column-slug {
width: 30%;
}
/* Comments */
.comments .column-response {
width: 35%;
}
/* Users */
.users .column-role {
width: 35%;
}
/* Network admin sites */
.sites .column-blogname {
width: 55%;
}
/* Updates */ /* Updates */
#wpbody-content #update-themes-table .plugin-title { #wpbody-content #update-themes-table .plugin-title {
width: auto; width: auto;
@ -1831,32 +1900,18 @@ div.action-links,
} }
/* Plugin/Theme Management Page */ /* Plugin/Theme Management Page */
.wp-list-table.plugins { .wp-list-table.plugins .toggle-row {
position: relative;
margin-bottom: 15px;
}
#wpbody-content .wp-list-table.plugins thead .column-description,
#wpbody-content .wp-list-table.plugins tfoot .column-description,
.wp-list-table.plugins th#description {
display: none; display: none;
} }
#wpbody-content .wp-list-table.plugins, #wpbody-content .wp-list-table.plugins td {
#wpbody-content .wp-list-table.plugins thead,
#wpbody-content .wp-list-table.plugins tbody,
#wpbody-content .wp-list-table.plugins tr,
#wpbody-content .wp-list-table.plugins .column-description,
#wpbody-content .wp-list-table.plugins .plugin-title,
#wpbody-content .wp-list-table.plugins .theme-title,
#wpbody-content .wp-list-table.plugins .plugin-update,
#wpbody-content .wp-list-table.plugins .manage-column.column-name {
display: block; display: block;
width: auto; width: auto;
padding: 10px 9px; /* reset from other list tables that have a label at this width */
} }
.active, .inactive { #wpbody-content .wp-list-table.plugins .column-description {
padding-top: 0; padding-top: 2px;
} }
.wp-list-table.plugins .plugin-title, .wp-list-table.plugins .plugin-title,
@ -1865,11 +1920,9 @@ div.action-links,
padding-bottom: 4px; padding-bottom: 4px;
} }
.plugins tr.active + tr.inactive th.check-column,
.plugins tr.active + tr.inactive td, .plugins tr.active + tr.inactive td,
.wp-list-table.plugins .plugin-title, .wp-list-table.plugins .plugin-title,
.wp-list-table.plugins .theme-title, .wp-list-table.plugins .theme-title {
.wp-list-table.plugins tbody th {
-webkit-box-shadow: none; -webkit-box-shadow: none;
box-shadow: none; box-shadow: none;
} }
@ -1878,7 +1931,9 @@ div.action-links,
padding: 1px 0 0; padding: 1px 0 0;
} }
.plugins tr.active + tr.inactive td.column-description { .plugins tr.active + tr.inactive th.check-column,
.plugins tr.active + tr.inactive td.column-description,
.plugins .plugin-update-tr:before {
-webkit-box-shadow: inset 0 -1px 0 rgba(0, 0, 0, 0.1); -webkit-box-shadow: inset 0 -1px 0 rgba(0, 0, 0, 0.1);
box-shadow: inset 0 -1px 0 rgba(0, 0, 0, 0.1); box-shadow: inset 0 -1px 0 rgba(0, 0, 0, 0.1);
} }
@ -1888,69 +1943,23 @@ div.action-links,
border-top: none; border-top: none;
} }
.wp-list-table.plugins .column-description { /* mimic the checkbox th */
padding-top: 0; .plugins .plugin-update-tr:before {
content: '';
display: table-cell;
} }
.wp-list-table.plugins .manage-column.column-name, .plugins .active.update + .plugin-update-tr:before {
.wp-list-table.plugins .column-description, border-left: 4px solid #d54e21;
.wp-list-table.plugins .plugin-title, background-color: #fef7f1;
.wp-list-table.plugins .theme-title {
padding-right: 12px;
padding-left: 46px;
} }
.wp-list-table.plugins .manage-column.column-name { .plugins .plugin-update-tr .plugin-update {
padding-top: 11px; border-left: none;
padding-bottom: 12px;
} }
.wp-list-table.plugins .manage-column.column-name.sortable { .plugin-update-tr .update-message {
padding: 4px 12px 4px 36px; margin-left: 0;
}
.wp-list-table.plugins tr {
position: relative;
}
.wp-list-table.plugins th.check-column,
.wp-list-table.plugins thead td.check-column,
.wp-list-table.plugins tfoot td.check-column,
.wp-list-table.plugins tr.update th.check-column {
position: absolute;
height: auto;
top: 0;
bottom: 0;
left: 0;
padding-left: 2px;
padding-top: 18px;
}
.wp-list-table.plugins thead td.check-column,
.wp-list-table.plugins tfoot td.check-column {
padding-left: 3px;
padding-top: 11px;
background: none;
}
.plugins tbody th.check-column input[type="checkbox"] {
margin-top: -3px;
margin-left: 9px;
}
.plugins tbody .active th.check-column input[type="checkbox"],
.plugins tbody .active.update th.check-column input[type="checkbox"] {
margin-left: 5px;
}
.wp-list-table.plugins thead .check-column input,
.wp-list-table.plugins tfoot .check-column input {
margin-top: -2px;
margin-left: 8px;
}
.wp-list-table.plugins .active th.check-column {
background: none;
} }
.wp-list-table.plugins .plugin-title strong, .wp-list-table.plugins .plugin-title strong,
@ -1991,13 +2000,3 @@ div.action-links,
box-shadow: inset 0 -1px 0 rgba(0,0,0,0.1); box-shadow: inset 0 -1px 0 rgba(0,0,0,0.1);
} }
} }
/* Smartphone */
@media screen and (max-width: 600px) {
/* Remove slug column from taxonomy list page
and role column from users list page */
.tags .column-slug,
.users .column-role {
display: none;
}
}

4
wp-admin/css/wp-admin-rtl.min.css vendored
View File

File diff suppressed because one or more lines are too long

4
wp-admin/css/wp-admin.min.css vendored
View File

File diff suppressed because one or more lines are too long

10
wp-admin/includes/class-wp-comments-list-table.php
View File

@ -395,7 +395,7 @@ class WP_Comments_List_Table extends WP_List_Table {
$this->display_tablenav( 'top' ); $this->display_tablenav( 'top' );
?> ?>
<table class="<?php echo implode( ' ', $this->get_table_classes() ); ?>"> <table class="wp-list-table <?php echo implode( ' ', $this->get_table_classes() ); ?>">
<thead> <thead>
<tr> <tr>
<?php $this->print_column_headers(); ?> <?php $this->print_column_headers(); ?>
@ -466,13 +466,16 @@ class WP_Comments_List_Table extends WP_List_Table {
return; return;
} }
if ( $primary !== $column_name ) {
return '';
}
$post = get_post(); $post = get_post();
$the_comment_status = wp_get_comment_status( $comment->comment_ID ); $the_comment_status = wp_get_comment_status( $comment->comment_ID );
$out = ''; $out = '';
if ( $primary === $column_name ) {
$del_nonce = esc_html( '_wpnonce=' . wp_create_nonce( "delete-comment_$comment->comment_ID" ) ); $del_nonce = esc_html( '_wpnonce=' . wp_create_nonce( "delete-comment_$comment->comment_ID" ) );
$approve_nonce = esc_html( '_wpnonce=' . wp_create_nonce( "approve-comment_$comment->comment_ID" ) ); $approve_nonce = esc_html( '_wpnonce=' . wp_create_nonce( "approve-comment_$comment->comment_ID" ) );
@ -556,7 +559,8 @@ class WP_Comments_List_Table extends WP_List_Table {
$out .= "<span class='$action'>$sep$link</span>"; $out .= "<span class='$action'>$sep$link</span>";
} }
$out .= '</div>'; $out .= '</div>';
}
$out .= '<button type="button" class="toggle-row"><span class="screen-reader-text">' . __( 'Show more details' ) . '</span></button>';
return $out; return $out;
} }

14
wp-admin/includes/class-wp-list-table.php
View File

@ -497,6 +497,8 @@ class WP_List_Table {
} }
$out .= '</div>'; $out .= '</div>';
$out .= '<button type="button" class="toggle-row"><span class="screen-reader-text">' . __( 'Show more details' ) . '</span></button>';
return $out; return $out;
} }
@ -943,7 +945,7 @@ class WP_List_Table {
* @param bool $with_id Whether to set the id attribute or not * @param bool $with_id Whether to set the id attribute or not
*/ */
public function print_column_headers( $with_id = true ) { public function print_column_headers( $with_id = true ) {
list( $columns, $hidden, $sortable ) = $this->get_column_info(); list( $columns, $hidden, $sortable, $primary ) = $this->get_column_info();
$current_url = set_url_scheme( 'http://' . $_SERVER['HTTP_HOST'] . $_SERVER['REQUEST_URI'] ); $current_url = set_url_scheme( 'http://' . $_SERVER['HTTP_HOST'] . $_SERVER['REQUEST_URI'] );
$current_url = remove_query_arg( 'paged', $current_url ); $current_url = remove_query_arg( 'paged', $current_url );
@ -977,6 +979,10 @@ class WP_List_Table {
elseif ( in_array( $column_key, array( 'posts', 'comments', 'links' ) ) ) elseif ( in_array( $column_key, array( 'posts', 'comments', 'links' ) ) )
$class[] = 'num'; $class[] = 'num';
if ( $column_key === $primary ) {
$class[] = 'column-primary';
}
if ( isset( $sortable[$column_key] ) ) { if ( isset( $sortable[$column_key] ) ) {
list( $orderby, $desc_first ) = $sortable[$column_key]; list( $orderby, $desc_first ) = $sortable[$column_key];
@ -1163,7 +1169,11 @@ class WP_List_Table {
$classes .= ' hidden'; $classes .= ' hidden';
} }
$attributes = "class='$classes'"; // Comments column uses HTML in the display name with screen reader text.
// Instead of using esc_attr(), we strip tags to get closer to a user-friendly string.
$data = 'data-colname="' . wp_strip_all_tags( $column_display_name ) . '"';
$attributes = "class='$classes' $data";
if ( 'cb' == $column_name ) { if ( 'cb' == $column_name ) {
echo '<th scope="row" class="check-column">'; echo '<th scope="row" class="check-column">';

4
wp-admin/includes/class-wp-ms-sites-list-table.php
View File

@ -403,7 +403,9 @@ class WP_MS_Sites_List_Table extends WP_List_Table {
$classes .= ' hidden'; $classes .= ' hidden';
} }
$attributes = "class='$classes'"; $data = 'data-colname="' . wp_strip_all_tags( $column_display_name ) . '"';
$attributes = "class='$classes' $data";
if ( 'cb' === $column_name ) { if ( 'cb' === $column_name ) {
echo '<th scope="row" class="check-column">'; echo '<th scope="row" class="check-column">';

4
wp-admin/includes/class-wp-ms-users-list-table.php
View File

@ -336,7 +336,9 @@ class WP_MS_Users_List_Table extends WP_List_Table {
$classes .= ' hidden'; $classes .= ' hidden';
} }
$attributes = "class='$classes'"; $data = 'data-colname="' . wp_strip_all_tags( $column_display_name ) . '"';
$attributes = "class='$classes' $data";
if ( 'cb' === $column_name ) { if ( 'cb' === $column_name ) {
echo '<th scope="row" class="check-column">'; echo '<th scope="row" class="check-column">';

6
wp-admin/includes/class-wp-posts-list-table.php
View File

@ -973,7 +973,11 @@ class WP_Posts_List_Table extends WP_List_Table {
$classes .= ' hidden'; $classes .= ' hidden';
} }
$attributes = "class='$classes'"; // Comments column uses HTML in the display name with screen reader text.
// Instead of using esc_attr(), we strip tags to get closer to a user-friendly string.
$data = 'data-colname="' . wp_strip_all_tags( $column_display_name ) . '"';
$attributes = "class='$classes' $data";
if ( 'cb' === $column_name ) { if ( 'cb' === $column_name ) {
echo '<th scope="row" class="check-column">'; echo '<th scope="row" class="check-column">';

4
wp-admin/includes/class-wp-users-list-table.php
View File

@ -419,7 +419,9 @@ class WP_Users_List_Table extends WP_List_Table {
$classes .= ' hidden'; $classes .= ' hidden';
} }
$attributes = "class='$classes'"; $data = 'data-colname="' . wp_strip_all_tags( $column_display_name ) . '"';
$attributes = "class='$classes' $data";
if ( 'cb' === $column_name ) { if ( 'cb' === $column_name ) {
$r .= "<th scope='row' class='check-column'>$checkbox</th>"; $r .= "<th scope='row' class='check-column'>$checkbox</th>";

5
wp-admin/js/common.js
View File

@ -487,6 +487,11 @@ $(document).ready( function() {
} }
}, 'td.has-row-actions' ); }, 'td.has-row-actions' );
// Toggle list table rows on small screens
$( 'tbody' ).on( 'click', '.toggle-row', function() {
$( this ).closest( 'tr' ).toggleClass( 'is-expanded' );
});
$('#default-password-nag-no').click( function() { $('#default-password-nag-no').click( function() {
setUserSetting('default_password_nag', 'hide'); setUserSetting('default_password_nag', 'hide');
$('div.default-password-nag').hide(); $('div.default-password-nag').hide();

2
wp-admin/js/common.min.js vendored
View File

File diff suppressed because one or more lines are too long

2
wp-admin/js/inline-edit-post.js
View File

@ -133,7 +133,7 @@ inlineEditPost = {
editRow = $('#inline-edit').clone(true); editRow = $('#inline-edit').clone(true);
$( 'td', editRow ).attr( 'colspan', $( 'th:visible, td:visible', '.widefat:first thead' ).length ); $( 'td', editRow ).attr( 'colspan', $( 'th:visible, td:visible', '.widefat:first thead' ).length );
$(t.what+id).hide().after(editRow).after('<tr class="hidden"></tr>'); $(t.what+id).removeClass('is-expanded').hide().after(editRow).after('<tr class="hidden"></tr>');
// populate the data // populate the data
rowData = $('#inline_'+id); rowData = $('#inline_'+id);

2
wp-admin/js/inline-edit-post.min.js vendored
View File

File diff suppressed because one or more lines are too long

2
wp-includes/version.php
View File

@ -4,7 +4,7 @@
* *
* @global string $wp_version * @global string $wp_version
*/ */
$wp_version = '4.3-alpha-33015'; $wp_version = '4.3-alpha-33016';
/** /**
* Holds the WordPress DB revision, increments when changes are made to the WordPress DB schema. * Holds the WordPress DB revision, increments when changes are made to the WordPress DB schema.