X-Git-Url: https://scripts.mit.edu/gitweb/autoinstalls/wordpress.git/blobdiff_plain/af50974463450c98503e763a7836a50e260461a9..16e7b37c7914d753890c1a05a9335f3b43751eb8:/wp-admin/css/list-tables-rtl.css diff --git a/wp-admin/css/list-tables-rtl.css b/wp-admin/css/list-tables-rtl.css index d0bce52e..250be23b 100644 --- a/wp-admin/css/list-tables-rtl.css +++ b/wp-admin/css/list-tables-rtl.css @@ -1,77 +1,125 @@ -/* List table styles */ -.post-com-count-wrapper { - min-width: 22px; -} - -.post-com-count { - background: none; - height: 1.3em; - line-height: 1.1em; +.response-links { display: block; - text-decoration: none; - padding: 0 0 6px; - cursor: pointer; - background-position: center -80px; - background-repeat: no-repeat; - color: #fff; + margin-bottom: 1em; } -.post-com-count:after { /* draw bubble connector using CSS! */ - content: ""; +.response-links a { display: block; - width: 0; - height: 0; - margin-right: 8px; - border-top: 5px solid #bbb; - border-left: 5px solid transparent; } -.post-com-count span { - font-size: 11px; +.response-links a.comments-edit-item-link { font-weight: 600; - height: 1.4em; - line-height: 1.4em; - min-width: 0.7em; - padding: 0 6px; +} + +.response-links a.comments-view-item-link { + font-size: 12px; +} + +.post-com-count-wrapper strong { + font-weight: 400; +} + +.comments-view-item-link { display: inline-block; - -webkit-border-radius: 5px; - border-radius: 5px; - background-color: #bbb; - color: #fff; + clear: both; +} + +.column-response .post-com-count-wrapper, +.column-comments .post-com-count-wrapper { + white-space: nowrap; + word-wrap: normal; } -.post-com-count:hover { - background-position: center -3px; +/* comments bubble common */ +.column-response .post-com-count, +.column-comments .post-com-count { + display: inline-block; + vertical-align: top; } -.post-com-count:hover span { - background-color: #2ea2cc; +/* comments bubble approved */ +.column-response .post-com-count-no-comments, +.column-response .post-com-count-approved, +.column-comments .post-com-count-no-comments, +.column-comments .post-com-count-approved { + margin-top: 5px; +} + +.column-response .comment-count-no-comments, +.column-response .comment-count-approved, +.column-comments .comment-count-no-comments, +.column-comments .comment-count-approved { + -webkit-box-sizing: border-box; + -moz-box-sizing: border-box; + box-sizing: border-box; + display: block; + padding: 0 8px; + min-width: 24px; + height: 2em; + -webkit-border-radius: 5px; + border-radius: 5px; + background-color: #72777c; + color: #fff; + font-size: 11px; + line-height: 21px; + text-align: center; } -.post-com-count:hover:after { - border-top: 5px solid #2ea2cc; +.ie8 .column-response .comment-count-no-comments, +.ie8 .column-response .comment-count-approved, +.ie8 .column-comments .comment-count-no-comments, +.ie8 .column-comments .comment-count-approved { + min-width: 0; } -strong .post-com-count { - background-position: center -55px; +.column-response .post-com-count-no-comments:after, +.column-response .post-com-count-approved:after, +.column-comments .post-com-count-no-comments:after, +.column-comments .post-com-count-approved:after { + content: ""; + display: block; + margin-right: 8px; + width: 0; + height: 0; + border-top: 5px solid #72777c; + border-left: 5px solid transparent; } -strong .post-com-count span { - background-color: #0074a2; +.column-response .post-com-count-approved:hover .comment-count-approved, +.column-response .post-com-count-approved:focus .comment-count-approved, +.column-comments .post-com-count-approved:hover .comment-count-approved, +.column-comments .post-com-count-approved:focus .comment-count-approved { + background: #0073aa; } -strong .post-com-count:after { - border-top: 5px solid #0074a2; +.column-response .post-com-count-approved:hover:after, +.column-response .post-com-count-approved:focus:after, +.column-comments .post-com-count-approved:hover:after, +.column-comments .post-com-count-approved:focus:after { + border-top-color: #0073aa; } -.column-response .post-com-count { - float: right; - margin-left: 5px; +/* comments bubble pending */ +.column-response .post-com-count-pending, +.column-comments .post-com-count-pending { + position: relative; + right: -3px; + padding: 0 5px; + min-width: 7px; + height: 17px; + border: 2px solid #fff; + -webkit-border-radius: 11px; + border-radius: 11px; + background: #ca4a1f; + color: #fff; + font-size: 9px; + line-height: 17px; text-align: center; } -.response-links { - float: right; +.column-response .post-com-count-no-pending, +.column-comments .post-com-count-no-pending { + display: none; } /* comments */ @@ -94,7 +142,7 @@ strong .post-com-count:after { #submitted-on, .submitted-on { - color: #777; + color: #555d66; } /* reply to comments */ @@ -104,16 +152,11 @@ strong .post-com-count:after { #replysubmit { margin: 0; - padding: 0 5px 3px; + padding: 5px 7px 10px; + overflow: hidden; text-align: center; } -#replysubmit .spinner { - padding: 2px 0 0; - vertical-align: top; - float: left; -} - #replysubmit .button { margin-left: 5px; } @@ -124,14 +167,27 @@ strong .post-com-count:after { text-align: center; } -#replyrow h5 { - margin: .2em 0 0; - padding: 0 5px; - line-height: 1.4em; - font-size: 1em; +#replyrow.inline-edit-row fieldset.comment-reply { + font-size: inherit; + line-height: inherit; +} + +#replyrow legend { + margin: 0; + padding: .2em 5px 0; + font-size: 13px; + line-height: 1.4; + font-weight: 600; } -#edithead .inside { +#replyrow.inline-edit-row label { + display: inline; + vertical-align: baseline; + line-height: inherit; +} + +#edithead .inside, +#commentsdiv #edithead .inside { float: right; padding: 3px 5px 2px 0; margin: 0; @@ -166,13 +222,9 @@ strong .post-com-count:after { vertical-align: text-top; } -#the-comment-list .attachment-80x60 { - padding: 4px 8px; -} - #the-comment-list tr.undo, #the-comment-list div.undo { - background-color: #f4f4f4; + background-color: #f5f5f5; } #the-comment-list .unapproved th, @@ -226,8 +278,8 @@ th .comment-grey-bubble { } th .comment-grey-bubble:before { - content: '\f101'; - font: normal 20px/.5 'dashicons'; + content: "\f101"; + font: normal 20px/.5 dashicons; speak: none; display: inline-block; padding: 0; @@ -264,7 +316,7 @@ table.fixed { } .fixed .column-posts { - width: 74px; + width: 74px; } .fixed .column-comment .comment-author { @@ -288,7 +340,7 @@ table.fixed { } .fixed .column-comments { - width: 4em; + width: 5.5em; padding: 8px 0; text-align: right; } @@ -297,12 +349,37 @@ table.fixed { padding-right: 3px; } -.fixed .column-comments a { +td.column-title strong, +td.plugin-title strong { + display: block; + margin-bottom: .2em; + font-size: 14px; +} + +td.column-title p, +td.plugin-title p { + margin: 6px 0; +} + +/* Media file column */ +table.media .column-title .media-icon { float: right; + min-height: 60px; + margin: 0 0 0 9px; } -.fixed .column-icon { - width: 80px; +table.media .column-title .media-icon img { + max-width: 60px; + height: auto; + vertical-align: top; /* Remove descender white-space. */ +} + +table.media .column-title .has-media-icon ~ .row-actions { + margin-right: 70px; /* 60px image + margin */ +} + +table.media .column-title .filename { + margin-bottom: 0.2em; } /* @todo: pick a consistent list table selector */ @@ -322,6 +399,10 @@ table.fixed { width: 20%; } +#comments-form .fixed .column-date { + width: 14%; +} + #commentsdiv.postbox .inside { margin: 0; padding: 0; @@ -353,7 +434,8 @@ table.fixed { border: 0 none; } -#commentsdiv .comments-box thead th { +#commentsdiv .comments-box thead th, +#commentsdiv .comments-box thead td { background: transparent; padding: 0 7px 4px; font-style: italic; @@ -363,12 +445,13 @@ table.fixed { border-bottom: 0 none; } -#commentsdiv .spinner { - padding-right: 5px; +#commentsdiv #edithead .inside input { + width: 160px; } .sorting-indicator { - display: none; + display: block; + visibility: hidden; width: 10px; height: 4px; margin-top: 8px; @@ -376,9 +459,8 @@ table.fixed { } .sorting-indicator:before { - background: none; - content: '\f142'; - font: normal 20px/1 'dashicons'; + content: "\f142"; + font: normal 20px/1 dashicons; speak: none; display: inline-block; padding: 0; @@ -400,13 +482,71 @@ table.fixed { } th.sorted.asc .sorting-indicator:before, -th.desc:hover span.sorting-indicator:before { - content: '\f142'; +th.desc:hover span.sorting-indicator:before, +th.desc a:focus span.sorting-indicator:before { + content: "\f142"; } th.sorted.desc .sorting-indicator:before, -th.asc:hover span.sorting-indicator:before { - content: '\f140'; +th.asc:hover span.sorting-indicator:before, +th.asc a:focus span.sorting-indicator:before { + 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:before { + -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:before { + 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: -5px; + right: 10px; + -webkit-border-radius: 50%; + border-radius: 50%; + display: block; + padding: 1px 0 1px 2px; + color: #444; /* same as table headers sort arrows */ + content: "\f140"; + font: normal 20px/1 dashicons; + line-height: 1; + -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 { @@ -415,15 +555,13 @@ tr.wp-locked .locked-indicator { width: 16px; } -tr.wp-locked .locked-indicator:before { - color: #888; - content: '\f160'; +tr.wp-locked .locked-indicator-icon:before { + color: #82878c; + content: "\f160"; display: inline-block; - float: right; - font: normal 20px/1 'dashicons'; + font: normal 20px/1 dashicons; speak: none; vertical-align: middle; - margin-right: 0; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } @@ -441,7 +579,7 @@ tr .locked-info { } tr.wp-locked .locked-info { - margin-top: 8px; + margin-top: 4px; height: auto; opacity: 1; } @@ -472,18 +610,7 @@ th.sortable a, th.sorted a { display: block; overflow: hidden; - padding: 7px 10px 8px 7px; -} - -th.manage-column a, -th.sortable a:hover, -th.sortable a:active, -th.sortable a:focus { - color: #333; -} - -th.sortable a:focus { - background: #e1e1e1; + padding: 8px; } .fixed .column-comments.sortable a, @@ -497,32 +624,37 @@ th.sorted a span { cursor: pointer; } -th.sorted.asc .sorting-indicator, -th.desc:hover span.sorting-indicator { - display: block; - background-position: 0 0; -} - -th.sorted.desc .sorting-indicator, -th.asc:hover span.sorting-indicator { - display: block; - background-position: -7px 0; +th.sorted .sorting-indicator, +th.desc:hover span.sorting-indicator, +th.desc a:focus span.sorting-indicator, +th.asc:hover span.sorting-indicator, +th.asc a:focus span.sorting-indicator { + visibility: visible; } /* Bulk Actions */ -.tablenav-pages a { +.tablenav-pages a, +.tablenav-pages-navspan { font-weight: 600; - margin-left: 1px; padding: 0 2px; } + .tablenav-pages .current-page { - padding-top: 0; + margin: 0 0 0 2px; + padding-bottom: 5px; + font-size: 13px; text-align: center; } -.tablenav-pages .next-page { + +.tablenav .total-pages { + margin-left: 2px; +} + +.tablenav #table-paging { margin-right: 2px; } +.tablenav a.button, .tablenav a.button-secondary { display: block; margin: 3px 0 0 8px; @@ -541,12 +673,10 @@ th.asc:hover span.sorting-indicator { .tablenav .tablenav-pages { float: left; - display: block; + height: 28px; + margin-top: 3px; cursor: default; - height: 30px; color: #555; - line-height: 30px; - font-size: 12px; } .tablenav .no-pages, @@ -560,34 +690,44 @@ th.asc:hover span.sorting-indicator { padding: 3px 6px; } -.tablenav .tablenav-pages a { - padding: 0 10px 3px; - background: #eee; - background: rgba( 0, 0, 0, 0.05 ); +.tablenav .tablenav-pages a, +.tablenav-pages-navspan { + display: inline-block; + min-width: 17px; + border: 1px solid #ccc; /* same color as buttons border */ + padding: 3px 5px 7px; + background: #e5e5e5; font-size: 16px; - font-weight: normal; + line-height: 1; + font-weight: 400; + text-align: center; +} + +.tablenav-pages-navspan { + height: 16px; + border-color: #ddd; /* same as disabled buttons */ + background: #f7f7f7; /* same as disabled buttons */ + color: #a0a5aa; /* same as disabled buttons */ } .tablenav .tablenav-pages a:hover, .tablenav .tablenav-pages a:focus { + border-color: #5b9dd9; color: #fff; - background: #2ea2cc; + background: #00a0d2; + -webkit-box-shadow: none; + box-shadow: none; + outline: none; /* IE8 */ } -.tablenav .tablenav-pages a.disabled, -.tablenav .tablenav-pages a.disabled:hover, -.tablenav .tablenav-pages a.disabled:focus, -.tablenav .tablenav-pages a.disabled:active { - color: #aaa; - background: #eee; - background: rgba( 0, 0, 0, 0.05 ); +.tablenav .displaying-num { + margin-left: 7px; } -.tablenav .displaying-num { - margin-left: 2px; - color: #777; - font-size: 12px; - font-style: italic; +.tablenav .one-page .displaying-num { + display: inline-block; + margin-top: 5px; + margin-left: 0; } .tablenav .actions { @@ -613,71 +753,70 @@ classes exist in paginate_links() but not seen in list table output. */ .tablenav .next, .tablenav .prev { border-color: transparent; - color: #0074a2; + color: #0073aa; } .tablenav .next:hover, .tablenav .prev:hover { border-color: transparent; - color: #2ea2cc; + color: #00a0d2; } .tablenav .view-switch { float: left; - margin: 5px 8px 0 16px; + margin: 0 5px; + padding-top: 3px; } .wp-filter .view-switch { display: inline-block; vertical-align: middle; - padding: 15px 0; - margin: 0 0 0 20px; + padding: 12px 0; + margin: 0 2px 0 8px; } -.view-switch a { - text-decoration: none; +.media-toolbar.wp-filter .view-switch { + margin: 0 2px 0 12px; } -.view-switch > a { - display: inline-block; - width: 18px; - height: 18px; +.view-switch a { + float: right; + width: 28px; + height: 28px; + text-align: center; + line-height: 24px; + text-decoration: none; } -.view-switch > a:before { - color: #bbb; +.view-switch a:before { + color: #b4b9be; display: inline-block; - float: right; - font: normal 20px/1 'dashicons'; + font: normal 20px/1 dashicons; speak: none; vertical-align: middle; - margin-right: 0; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } -.view-switch > .view-list:before { - content: '\f163'; -} - -.view-switch a:hover:before { +.view-switch a:hover:before, +.view-switch a:focus:before { color: #727272; } .view-switch a.current:before { - color: #0074a2; + color: #0073aa; } -.view-switch > a + a { - margin-right: 5px; +.view-switch .view-list:before { + content: "\f163"; } -.view-switch > .view-excerpt:before { - content: '\f164'; +.view-switch .view-excerpt:before { + content: "\f164"; } -.view-switch > .view-grid:before { - content: '\f509'; +.view-switch .view-grid:before { + content: "\f509"; } .filter { @@ -737,15 +876,27 @@ p.pagenav { .row-actions { color: #ddd; font-size: 13px; - visibility: hidden; padding: 2px 0 0; + position: relative; + right: -9999em; } +/* ticket #34150 */ +.rtl .row-actions a { + display: inline-block; +} + +.row-actions .network_only, +.row-actions .network_active { + color: #000; +} + +.no-js .row-actions, tr:hover .row-actions, .mobile .row-actions, .row-actions.visible, -div.comment-item:hover .row-actions { - visibility: visible; +.comment-item:hover .row-actions { + position: static; } /* deprecated */ @@ -779,11 +930,6 @@ tr.inline-edit-row td, padding: 0 0.5em; } -#wpbody-content .quick-edit-row-page fieldset.inline-edit-col-right .inline-edit-col { - border-width: 0 1px 0 0; - border-style: none none none solid; -} - #wpbody-content .quick-edit-row-post .inline-edit-col-left { width: 40%; } @@ -824,14 +970,7 @@ tr.inline-edit-row td, .inline-edit-row fieldset .inline-edit-group { clear: both; -} - -.inline-edit-row fieldset .inline-edit-group:after { - content: "."; - display: block; - height: 0; - clear: both; - visibility: hidden; + line-height: 2.5; } .inline-edit-row p.submit { @@ -847,22 +986,37 @@ tr.inline-edit-row td, } /* Positioning */ -.inline-edit-row h4 { - margin: .2em 0; - padding: 0; - line-height: 23px; + +/* Needs higher specificity for the padding */ +#the-list .inline-edit-row .inline-edit-legend { + margin: 0; + padding: 0.2em 0.5em 0; + line-height: 2.5; + font-weight: 600; } + +#the-list #bulk-edit.inline-edit-row .inline-edit-legend { + padding: 0.2em 0.5em; +} + .inline-edit-row fieldset span.title, .inline-edit-row fieldset span.checkbox-title { margin: 0; padding: 0; - line-height: 27px; } .inline-edit-row fieldset label, .inline-edit-row fieldset span.inline-edit-categories-label { display: block; margin: .2em 0; + line-height: 2.5; +} + +.inline-edit-row fieldset.inline-edit-date label { + display: inline-block; + margin: 0; + line-height: 1.5; + vertical-align: baseline; } .inline-edit-row fieldset label.inline-edit-tags { @@ -874,15 +1028,27 @@ tr.inline-edit-row td, width: auto; } -.inline-edit-row fieldset label span.title { +.inline-edit-row fieldset label span.title, +.inline-edit-row fieldset.inline-edit-date legend { display: block; float: right; - width: 5em; + width: 6em; + line-height: 2.5; +} + +#posts-filter fieldset.inline-edit-date legend { + padding: 0; +} + +.inline-edit-row fieldset.inline-edit-date select { + margin: 1px; + line-height: 28px; } -.inline-edit-row fieldset label span.input-text-wrap { +.inline-edit-row fieldset label span.input-text-wrap, +.inline-edit-row fieldset .timestamp-wrap { display: block; - margin-right: 5em; + margin-right: 6em; } .quick-edit-row-post fieldset.inline-edit-col-right label span.title { @@ -890,17 +1056,23 @@ tr.inline-edit-row td, padding-left: 0.5em; } +.inline-edit-row .inline-edit-or { + margin: .2em 0 .2em 6px; + line-height: 2.5; +} + .inline-edit-row .input-text-wrap input[type=text] { width: 100%; } .inline-edit-row fieldset label input[type=checkbox] { - vertical-align: text-bottom; + vertical-align: middle; } .inline-edit-row fieldset label textarea { width: 100%; height: 4em; + vertical-align: top; } #wpbody-content .bulk-edit-row fieldset .inline-edit-group label { @@ -915,21 +1087,14 @@ tr.inline-edit-row td, width: 6em; } -.inline-edit-save .spinner { - padding: 4px 10px 0; - vertical-align: top; - float: left; -} - /* Styling */ -.inline-edit-row h4 { +.inline-edit-row .inline-edit-legend { text-transform: uppercase; } .inline-edit-row fieldset span.title, .inline-edit-row fieldset span.checkbox-title { font-style: italic; - line-height: 1.8em; } /* Specific Elements */ @@ -941,7 +1106,7 @@ tr.inline-edit-row td, .inline-edit-row fieldset input[name=hh], .inline-edit-row fieldset input[name=mn] { font-size: 12px; - width: 2.1em; + width: 2.3em; } .inline-edit-row fieldset input[name=aa] { @@ -1041,25 +1206,16 @@ ul.cat-checklist { margin-top: 4px; } -#update-plugins-table tbody td p { +.updates-table .plugin-title p { margin-top: 0; } -#update-plugins-table tbody td p strong { - font-size: 14px; -} - -.plugins thead th.check-column, -.plugins tfoot th.check-column, +.plugins thead td.check-column, +.plugins tfoot td.check-column, .plugins .inactive th.check-column { padding-right: 6px; } -#update-plugins-table thead th.check-column, -#update-plugins-table tfoot th.check-column { - padding-top: 11px; -} - .plugins, .plugins th, .plugins td { @@ -1114,10 +1270,6 @@ ul.cat-checklist { border-bottom: 0; } -.plugin-update-tr td { - border-top: 0; -} - .plugins .inactive td, .plugins .inactive th, .plugins .active td, @@ -1143,24 +1295,18 @@ ul.cat-checklist { .upgrade .plugins tr:last-of-type td, .upgrade .plugins tr:last-of-type th, .plugins tr.active + tr.inactive.update th, -.plugins tr.active + tr.inactive.update td { +.plugins tr.active + tr.inactive.update td, +.plugins .updated td, +.plugins .updated th, +.plugins tr.active + tr.inactive.updated th, +.plugins tr.active + tr.inactive.updated td { -webkit-box-shadow: none; box-shadow: none; } -.plugins .active.update td, -.plugins .active.update th, -tr.active.update + tr.plugin-update-tr .plugin-update { - background-color: #fef7f1; -} - -.plugins .active th.check-column { - border-right: 4px solid #2ea2cc; -} - -.plugins .active.update th.check-column, -.plugins .active.update + .plugin-update-tr .plugin-update { - border-right: 4px solid #d54e21; +.plugins .active th.check-column, +.plugin-update-tr.active td { + border-right: 4px solid #00a0d2; } #wpbody-content .plugins .plugin-title, @@ -1169,6 +1315,11 @@ tr.active.update + tr.plugin-update-tr .plugin-update { white-space:nowrap; } +.updates-table-screenshot { + float:right; + padding: 0 0 5px 10px; +} + .plugins .inactive .plugin-title strong { font-weight: 400; } @@ -1179,7 +1330,9 @@ tr.active.update + tr.plugin-update-tr .plugin-update { } .plugins .update .second, -.plugins .update .row-actions { +.plugins .update .row-actions, +.plugins .updated .second, +.plugins .updated .row-actions { padding-bottom: 0; } @@ -1189,49 +1342,72 @@ tr.active.update + tr.plugin-update-tr .plugin-update { border-top-width: 1px; } -.plugin-update-tr .update-message { - font-size: 13px; - font-weight: normal; - margin: 6px 12px 12px; - padding: 6px 12px; - margin: 0 31px 8px 10px; - background-color: #f7f7f7; - background-color: rgba(0,0,0,0.03); +.plugins .plugin-update-tr .plugin-update { + -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); + overflow: hidden; /* clearfix */ + padding: 0; } -.plugin-update-tr .update-message:before { - color: #d54e21; - content: '\f463'; +.plugins .plugin-update-tr .notice, +.plugins .plugin-update-tr div[class="update-message"] { /* back-compat for pre-4.6 */ + margin: 5px 40px 15px 20px; +} + +.plugins .notice p { + margin: 0.5em 0; +} + +.plugin-card .update-now:before { + color: #f56e28; + content: "\f463"; display: inline-block; - font: normal 20px/1 'dashicons'; + font: normal 20px/1 dashicons; + margin: 3px -2px 0 5px; speak: none; - margin: 0 -2px 0 8px; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; vertical-align: top; } -.plugins .plugin-update { - padding: 0; - border: none; - -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); +.plugin-card .updating-message:before { + content: "\f463"; + -webkit-animation: rotation 2s infinite linear; + animation: rotation 2s infinite linear; } -/* update notices for active plugins */ -tr.active + tr.plugin-update-tr .plugin-update { - background-color: #f7fcfe; +@-webkit-keyframes rotation { + 0% { + -webkit-transform: rotate(0deg); + transform: rotate(0deg); + } + 100% { + -webkit-transform: rotate(-359deg); + transform: rotate(-359deg); + } +} + +@keyframes rotation { + 0% { + -webkit-transform: rotate(0deg); + transform: rotate(0deg); + } + 100% { + -webkit-transform: rotate(-359deg); + transform: rotate(-359deg); + } } -tr.active + tr.plugin-update-tr .plugin-update .update-message { - background-color: #fcf3ef; +.plugin-card .updated-message:before { + color: #79ba49; + content: "\f147"; } -.plugin-install-php h3 { +.plugin-install-php h2 { clear: both; } -.plugin-install-php h4 { +.plugin-install-php h3 { margin: 2.5em 0 8px; } @@ -1256,7 +1432,7 @@ tr.active + tr.plugin-update-tr .plugin-update .update-message { width: -webkit-calc( 50% - 8px ); width: calc( 50% - 8px ); background-color: #fff; - border: 1px solid #dedede; + border: 1px solid #ddd; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; @@ -1297,14 +1473,6 @@ tr.active + tr.plugin-update-tr .plugin-update .update-message { } } -@media screen and ( max-width: 782px ) { - .plugin-card { - margin-right: 0; - margin-left: 0; - width: 100%; - } -} - .plugin-card-top { position: relative; padding: 20px 20px 10px; @@ -1316,7 +1484,7 @@ div.action-links, margin: 0; /* Override existing margins */ } -.plugin-card h4 { +.plugin-card h3 { margin: 0 0 12px; font-size: 18px; line-height: 1.3; @@ -1351,7 +1519,7 @@ div.action-links, clear: both; padding: 12px 20px; background-color: #fafafa; - border-top: 1px solid #dedede; + border-top: 1px solid #ddd; overflow: hidden; } @@ -1359,6 +1527,21 @@ div.action-links, display: inline; } +.plugin-card-update-failed .update-now { + font-weight: 600; +} + +.plugin-card-update-failed .notice-error { + margin: 0; + padding-right: 16px; + -webkit-box-shadow: 0 -1px 0 #ddd; + box-shadow: 0 -1px 0 #ddd; +} + +.plugin-card-update-failed .plugin-card-bottom { + display: none; +} + .plugin-card .column-rating { line-height: 23px; } @@ -1386,7 +1569,7 @@ div.action-links, } .plugin-card .column-compatibility span:before { - font: normal 20px/.5 'dashicons'; + font: normal 20px/.5 dashicons; speak: none; display: inline-block; padding: 0; @@ -1401,11 +1584,11 @@ div.action-links, } .plugin-card .compatibility-incompatible:before { - content: '\f158'; + content: "\f158"; } .plugin-card .compatibility-compatible:before { - content: '\f147'; + content: "\f147"; } .plugin-icon { @@ -1417,13 +1600,8 @@ div.action-links, margin: 0 0 20px 20px; } -.plugin-icon img { - width: 128px; - height: 128px; -} - .no-plugin-results { - color: #999; + color: #666; /* same as no themes and no media */ font-size: 18px; font-style: normal; margin: 0; @@ -1433,19 +1611,32 @@ div.action-links, /* ms */ /* Background Color for Site Status */ -.wp-list-table .site-deleted { +.wp-list-table .site-deleted, +.wp-list-table tr.site-deleted { background: #ff8573; } -.wp-list-table .site-spammed { +.wp-list-table .site-spammed, +.wp-list-table tr.site-spammed { background: #faafaa; } -.wp-list-table .site-archived { +.wp-list-table .site-archived, +.wp-list-table tr.site-archived { background: #ffebe8; } -.wp-list-table .site-mature { +.wp-list-table .site-mature, +.wp-list-table tr.site-mature { background: #fecac2; } +.sites.fixed .column-lastupdated, +.sites.fixed .column-registered { + width: 20%; +} + +.sites.fixed .column-users { + width: 80px; +} + /* =Media Queries -------------------------------------------------------------- */ @@ -1479,6 +1670,10 @@ div.action-links, .plugin-card .desc p:first-of-type { margin-top: 0; } + + .fixed .column-date { + width: 14%; + } } @media screen and ( max-width: 782px ) { @@ -1509,6 +1704,12 @@ div.action-links, display: none; } + .view-switch a { + width: 36px; + height: 36px; + line-height: 33px; + } + /* Pagination */ .tablenav.top .displaying-num { display: none; @@ -1517,12 +1718,14 @@ div.action-links, .tablenav.bottom .displaying-num { position: absolute; left: 0; - top: 10px; + top: 11px; + margin: 0; font-size: 14px; } - .tablenav-pages { + .tablenav .tablenav-pages { width: 100%; + height: auto; text-align: center; margin: 0 0 25px; } @@ -1540,19 +1743,23 @@ div.action-links, height: 0; } - .tablenav-pages .pagination-links .paging-input { - font-size: 18px; + .tablenav-pages .pagination-links { + font-size: 16px; } - .tablenav-pages .pagination-links a { - padding: 8px 20px 11px; + .tablenav-pages .pagination-links a, + .tablenav-pages-navspan { + padding: 9px 11px 12px; font-size: 18px; - background: rgba(0, 0, 0, 0.05); + } + + .tablenav-pages-navspan { + height: 18px; } .tablenav-pages .pagination-links .current-page { - padding: 10px; - font-size: 14px; + padding: 8px 9px 9px; + font-size: 16px; } /* WP List Table Adjustments: General */ @@ -1564,35 +1771,143 @@ div.action-links, font-size: 14px; } - /* Columns to hide */ - .fixed .column-date, - .fixed .column-author, - .column-categories, - .column-tags, - .tags .column-description, - .media .column-parent, - .users .column-email, - .users .column-name, - .sites .column-registered, - .sites .column-users { + .wp-list-table th.column-primary ~ th, + .wp-list-table tr:not(.inline-edit-row):not(.no-items) td.column-primary ~ td:not(.check-column) { display: none; } + .wp-list-table thead th.column-primary { + width: 100%; + } + + /* Checkboxes need to show */ + .wp-list-table tr th.check-column { + display: table-cell; + width: 35px; + } + + .wp-list-table .column-primary .toggle-row { + display: block; + } + + .wp-list-table tr:not(.inline-edit-row):not(.no-items) 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):not(.no-items) td.column-primary ~ td:not(.check-column) { + padding: 3px 35% 3px 8px; + } + + .wp-list-table tr:not(.inline-edit-row):not(.no-items) 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, + #commentsdiv .fixed .column-author { + display: none !important; + } + .fixed .column-comment .comment-author { display: block; } - /* Posts */ - .column-title { - width: 85%; + #the-comment-list .is-expanded td { + -webkit-box-shadow: none; + box-shadow: none; + } + + #the-comment-list .is-expanded td:last-child { + -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); + } + + /* Show comment bubble as text instead */ + .post-com-count .screen-reader-text { + position: static; + width: auto; + height: auto; + margin: 0; } - .fixed .column-comments, .widefat .check-column { - width: 35px + .column-response .post-com-count-no-comments:after, + .column-response .post-com-count-approved:after, + .column-comments .post-com-count-no-comments:after, + .column-comments .post-com-count-approved:after { + content: none; } - .widefat thead .check-column, .widefat tfoot .check-column { - padding: 10px 0 10px; + .column-response .post-com-count [aria-hidden="true"], + .column-comments .post-com-count [aria-hidden="true"] { + display: none; + } + + .column-response .post-com-count-wrapper, + .column-comments .post-com-count-wrapper { + white-space: normal; + } + + .column-response .post-com-count-wrapper > a, + .column-comments .post-com-count-wrapper > a { + display: block; + } + + .column-response .post-com-count-no-comments, + .column-response .post-com-count-approved, + .column-comments .post-com-count-no-comments, + .column-comments .post-com-count-approved { + margin-top: 0; + margin-left: 0.5em; + } + + .column-response .post-com-count-pending, + .column-comments .post-com-count-pending { + position: static; + height: auto; + min-width: 0; + padding: 0; + border: none; + -webkit-border-radius: 0; + border-radius: 0; + background: none; + color: #bb2a2a; + font-size: inherit; + line-height: inherit; + text-align: right; + } + + .column-response .post-com-count-pending:hover, + .column-comments .post-com-count-pending:hover { + color: #dc3232; + } + + .widefat thead td.check-column, + .widefat tfoot td.check-column { + padding-top: 10px; } .widefat * { @@ -1636,7 +1951,8 @@ div.action-links, font-size: 16px; } - .inline-edit-row fieldset label span.title { + .inline-edit-row fieldset label span.title, + .inline-edit-row fieldset.inline-edit-date legend { float: none; } @@ -1648,7 +1964,8 @@ div.action-links, padding: 0; } - .inline-edit-row fieldset label span.input-text-wrap { + .inline-edit-row fieldset label span.input-text-wrap, + .inline-edit-row fieldset .timestamp-wrap { margin-right: 0; } @@ -1662,41 +1979,38 @@ div.action-links, width: 4.5em; } - #bulk-titles div { - margin: 0.8em 0.3em; - } - - #bulk-titles div a { - height: 22px; + .inline-edit-row .inline-edit-or { + margin: 0 0 0 6px; } - /* Taxonomies */ - .tags .column-posts { - width: 74px; + #edithead .inside, + #commentsdiv #edithead .inside { + float: none; + text-align: right; + padding: 3px 5px; } - .tags .column-slug { - width: 30%; + #commentsdiv #edithead .inside input, + #edithead .inside input { + width: 100%; } - /* Comments */ - .comments .column-response { - width: 35%; + #edithead label { + display: block; } - /* Users */ - .users .column-role { - width: 35%; + #bulk-titles div { + margin: 0.8em 0.3em; } - /* Network admin sites */ - .sites .column-blogname { - width: 55%; + #bulk-titles div a { + height: 22px; } /* Updates */ - #wpbody-content #update-themes-table .plugin-title { + #wpbody-content .updates-table .plugin-title { width: auto; + white-space: normal; } /* Links */ @@ -1708,49 +2022,27 @@ div.action-links, overflow: hidden; } - /* Plugin/Theme Management Page */ - .wp-list-table.plugins { - position: relative; - margin-top: 35px; - margin-bottom: 50px; - } - - .wp-list-table.plugins thead .column-description, - #wpbody-content .wp-list-table.plugins tfoot .column-description, - .wp-list-table.plugins th#description { + /* List tables that don't toggle rows */ + .comments-box .toggle-row, + .wp-list-table.plugins .toggle-row { display: none; } - #wpbody-content .wp-list-table.plugins, - #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 { + /* Plugin/Theme Management */ + #wpbody-content .wp-list-table.plugins td { display: block; width: auto; + padding: 10px 9px; /* reset from other list tables that have a label at this width */ } - .wp-list-table.plugins thead, - .wp-list-table.plugins tfoot { - position: absolute; - top: -35px; - right: 0; - left: 0; - width: auto; - height: 35px; + #wpbody-content .wp-list-table.plugins .column-description { + padding-top: 2px; } - .wp-list-table.plugins tfoot { - bottom: -35px; - top: auto; - } - - .active, .inactive { - padding-top: 0; + #wpbody-content .wp-list-table.plugins .plugin-title, + #wpbody-content .wp-list-table.plugins .theme-title { + padding-left: 12px; + white-space: normal; } .wp-list-table.plugins .plugin-title, @@ -1759,20 +2051,26 @@ div.action-links, padding-bottom: 4px; } - .plugins tr.active + tr.inactive th.check-column, - .plugins tr.active + tr.inactive td, - .wp-list-table.plugins .plugin-title, - .wp-list-table.plugins .theme-title, - .wp-list-table.plugins tbody th { + .plugins #the-list tr > td:not(:last-child), + .plugins #the-list .update th, + .plugins #the-list .update td, + .wp-list-table.plugins #the-list .theme-title { -webkit-box-shadow: none; box-shadow: none; + border-top: none; + } + + .plugins #the-list tr td { + border-top: none; } .plugins tbody { 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); box-shadow: inset 0 -1px 0 rgba(0, 0, 0, 0.1); } @@ -1782,63 +2080,38 @@ div.action-links, border-top: none; } - .wp-list-table.plugins .column-description { - padding-top: 0; + /* mimic the checkbox th */ + .plugins .plugin-update-tr:before { + content: ""; + display: table-cell; } - .wp-list-table.plugins .manage-column.column-name, - .wp-list-table.plugins .column-description, - .wp-list-table.plugins .plugin-title, - .wp-list-table.plugins .theme-title { - padding-left: 12px; - padding-right: 46px; + .plugins .active.update + .plugin-update-tr:before { + border-right: 4px solid #d54e21; + background-color: #fef7f1; } - .wp-list-table.plugins tr { - position: relative; + .plugins #the-list .plugin-update-tr .plugin-update { + border-right: none; } - .wp-list-table.plugins th.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 th.check-column, - .wp-list-table.plugins tfoot th.check-column { - padding-right: 3px; - padding-top: 11px; - background: none; - } - - .widefat tbody th.check-column input[type="checkbox"] { - margin-top: -3px; - margin-right: 8px; - } - - .wp-list-table.plugins .active .check-column input, - .wp-list-table.plugins .update .check-column input { - margin-right: 5px; + .plugin-update-tr .update-message { + margin-right: 0; } - .wp-list-table.plugins thead .check-column input, - .wp-list-table.plugins tfoot .check-column input { - margin-top: -6px; + .plugins .active.update + .plugin-update-tr:before { + background-color: #f7fcfe; + border-right: 4px solid #00a0d2; } - .wp-list-table.plugins .active th.check-column { - background: none; + .plugins .plugin-update-tr .update-message { + margin-right: 0; } .wp-list-table.plugins .plugin-title strong, .wp-list-table.plugins .theme-title strong { font-size: 1.4em; - line-height: 1.6em; + line-height: 1.5; } /* Add New plugins page */ @@ -1872,4 +2145,22 @@ div.action-links, -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); } + + .plugin-card { + margin-right: 0; + margin-left: 0; + width: 100%; + } +} + +@media screen and ( max-width: 480px ) { + .tablenav-pages .current-page { + margin: 0; + } + + .tablenav-pages .tablenav-paging-text { + float: right; + width: 100%; + padding-top: 0.5em; + } }