]> scripts.mit.edu Git - autoinstalls/wordpress.git/blobdiff - wp-admin/css/list-tables-rtl.css
WordPress 4.7
[autoinstalls/wordpress.git] / wp-admin / css / list-tables-rtl.css
index 6f36c9ebc7b9163b8da13f753ed8942234e8c059..250be23bbd202054c7b76f3c38aa01c6d4ae87cf 100644 (file)
-/* 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;
 }
 
-.post-com-count:hover {
-       background-position: center -3px;
+.column-response .post-com-count-wrapper,
+.column-comments .post-com-count-wrapper {
+       white-space: nowrap;
+       word-wrap: normal;
 }
 
-.post-com-count:hover span {
-       background-color: #2ea2cc;
+/* comments bubble common */
+.column-response .post-com-count,
+.column-comments .post-com-count {
+       display: inline-block;
+       vertical-align: top;
 }
 
-.post-com-count:hover:after {
-       border-top: 5px solid #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;
 }
 
-strong .post-com-count {
-       background-position: center -55px;
+.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;
 }
 
-strong .post-com-count span {
-       background-color: #0074a2;
+.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:after {
-       border-top: 5px solid #0074a2;
+.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;
 }
 
-.column-response .post-com-count {
-       float: right;
-       margin-left: 5px;
+.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;
+}
+
+.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;
+}
+
+/* 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;
@@ -263,6 +315,10 @@ table.fixed {
        width: 10%;
 }
 
+.fixed .column-posts {
+       width: 74px;
+}
+
 .fixed .column-comment .comment-author {
        display: none;
 }
@@ -284,7 +340,7 @@ table.fixed {
 }
 
 .fixed .column-comments {
-       width: 4em;
+       width: 5.5em;
        padding: 8px 0;
        text-align: right;
 }
@@ -293,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 */
@@ -318,6 +399,10 @@ table.fixed {
        width: 20%;
 }
 
+#comments-form .fixed .column-date {
+       width: 14%;
+}
+
 #commentsdiv.postbox .inside {
        margin: 0;
        padding: 0;
@@ -349,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;
@@ -359,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;
@@ -372,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;
@@ -396,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 {
@@ -411,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;
 }
@@ -437,7 +579,7 @@ tr .locked-info {
 }
 
 tr.wp-locked .locked-info {
-       margin-top: 8px;
+       margin-top: 4px;
        height: auto;
        opacity: 1;
 }
@@ -468,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,
@@ -493,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;
@@ -537,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,
@@ -556,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 {
@@ -591,6 +735,11 @@ th.asc:hover span.sorting-indicator {
        padding: 2px 0 0 8px;
 }
 
+.wp-filter .actions {
+       display: inline-block;
+       vertical-align: middle;
+}
+
 .tablenav .delete {
        margin-left: 20px;
 }
@@ -604,58 +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;
 }
 
-.view-switch {
+.tablenav .view-switch {
        float: left;
-       margin: 5px 8px 0 16px;
+       margin: 0 5px;
+       padding-top: 3px;
 }
 
-.view-switch img {
-       display: none;
+.wp-filter .view-switch {
+       display: inline-block;
+       vertical-align: middle;
+       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;
-       content: '\f163';
+.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 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 .view-list:before {
+       content: "\f163";
 }
 
-.view-switch > a + a:before {
-       margin-right: 5px;
-       content: '\f164';
+.view-switch .view-excerpt:before {
+       content: "\f164";
+}
+
+.view-switch .view-grid:before {
+       content: "\f509";
 }
 
 .filter {
@@ -671,6 +832,10 @@ classes exist in paginate_links() but not seen in list table output. */
        width: 4em;
 }
 
+#posts-filter .wp-filter {
+       margin-bottom: 0;
+}
+
 #posts-filter fieldset {
        float: right;
        margin: 0 0 1em 1.5ex;
@@ -711,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 */
@@ -753,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%;
 }
@@ -798,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 {
@@ -821,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 {
@@ -848,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;
 }
 
-.inline-edit-row fieldset label span.input-text-wrap {
+#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 .timestamp-wrap {
        display: block;
-       margin-right: 5em;
+       margin-right: 6em;
 }
 
 .quick-edit-row-post fieldset.inline-edit-col-right label span.title {
@@ -864,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 {
@@ -889,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 */
@@ -915,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] {
@@ -1015,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 {
@@ -1088,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,
@@ -1117,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,
@@ -1143,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;
 }
@@ -1153,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;
 }
 
@@ -1163,69 +1342,340 @@ 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 h4 {
+.plugin-install-php h2 {
+       clear: both;
+}
+
+.plugin-install-php h3 {
        margin: 2.5em 0 8px;
 }
 
+.plugin-install-php .wp-filter {
+       margin-bottom: 0;
+}
+
+/* Plugin card table view */
+.plugin-group {
+       overflow: hidden; /* clearfix */
+       margin-top: 1.5em;
+}
+
+.plugin-group h3 {
+       margin-top: 0;
+}
+
+.plugin-card {
+       float: right;
+       margin: 0 8px 16px;
+       width: 48.5%;
+       width: -webkit-calc( 50% - 8px );
+       width: calc( 50% - 8px );
+       background-color: #fff;
+       border: 1px solid #ddd;
+       -webkit-box-sizing: border-box;
+       -moz-box-sizing: border-box;
+       box-sizing: border-box;
+}
+
+.plugin-card:nth-child(odd) {
+       clear: both;
+       margin-right: 0;
+}
+
+.plugin-card:nth-child(even) {
+       margin-left: 0;
+}
+
+@media screen and ( min-width: 1600px ) {
+       .plugin-card {
+               width: 30%;
+               width: -webkit-calc( 33.1% - 8px );
+               width: calc( 33.1% - 8px );
+       }
+
+       .plugin-card:nth-child(odd) {
+               clear: none;
+               margin-right: 8px;
+       }
+
+       .plugin-card:nth-child(even) {
+               margin-left: 8px;
+       }
+
+       .plugin-card:nth-child(3n+1) {
+               clear: both;
+               margin-right: 0;
+       }
+
+       .plugin-card:nth-child(3n) {
+               margin-left: 0;
+       }
+}
+
+.plugin-card-top {
+       position: relative;
+       padding: 20px 20px 10px;
+       min-height: 135px;
+}
+
+div.action-links,
+.plugin-action-buttons {
+       margin: 0; /* Override existing margins */
+}
+
+.plugin-card h3 {
+       margin: 0 0 12px;
+       font-size: 18px;
+       line-height: 1.3;
+}
+
+.plugin-card .name,
+.plugin-card .desc {
+       margin-right: 148px; /* icon + margin */
+       margin-left: 120px; /* action links */
+}
+
+.plugin-card .action-links {
+       position: absolute;
+       top: 20px;
+       left: 20px;
+       width: 120px;
+}
+
+.plugin-action-buttons {
+       clear: left;
+       float: left;
+       margin-right: 2em;
+       margin-bottom: 1em;
+       text-align: left;
+}
+
+.plugin-action-buttons li {
+       margin-bottom: 10px;
+}
+
+.plugin-card-bottom {
+       clear: both;
+       padding: 12px 20px;
+       background-color: #fafafa;
+       border-top: 1px solid #ddd;
+       overflow: hidden;
+}
+
+.plugin-card-bottom .star-rating {
+       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;
+}
+
+.plugin-card .column-rating,
+.plugin-card .column-updated {
+       margin-bottom: 4px;
+}
+
+.plugin-card .column-rating,
+.plugin-card .column-downloaded {
+       float: right;
+       clear: right;
+       max-width: 180px;
+}
+
+.plugin-card .column-updated,
+.plugin-card .column-compatibility {
+       text-align: left;
+       float: left;
+       clear: left;
+       width: 65%;
+       width: -webkit-calc( 100% - 180px );
+       width: calc( 100% - 180px );
+}
+
+.plugin-card .column-compatibility span:before {
+       font: normal 20px/.5 dashicons;
+       speak: none;
+       display: inline-block;
+       padding: 0;
+       top: 4px;
+       right: -2px;
+       position: relative;
+       vertical-align: top;
+       -webkit-font-smoothing: antialiased;
+       -moz-osx-font-smoothing: grayscale;
+       text-decoration: none !important;
+       color: #444;
+}
+
+.plugin-card .compatibility-incompatible:before {
+       content: "\f158";
+}
+
+.plugin-card .compatibility-compatible:before {
+       content: "\f147";
+}
+
+.plugin-icon {
+       position: absolute;
+       top: 20px;
+       right: 20px;
+       width: 128px;
+       height: 128px;
+       margin: 0 0 20px 20px;
+}
+
+.no-plugin-results {
+       color: #666; /* same as no themes and no media */
+       font-size: 18px;
+       font-style: normal;
+       margin: 0;
+       padding: 100px 0 0;
+       text-align: center;
+}
+
 /* 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
 -------------------------------------------------------------- */
 
-/**
- * HiDPI Displays
- */
+@media screen and ( max-width: 1100px ) and ( min-width: 782px ), ( max-width: 480px ) {
+       .plugin-card .action-links {
+               position: static;
+               margin-right: 148px;
+               width: auto;
+       }
+
+       .plugin-action-buttons {
+               float: none;
+               margin: 1em 0 0;
+               text-align: right;
+       }
+
+       .plugin-action-buttons li {
+               display: inline-block;
+               vertical-align: middle;
+       }
+
+       .plugin-action-buttons li .button {
+               margin-left: 20px;
+       }
+
+       .plugin-card .name,
+       .plugin-card .desc {
+               margin-left: 0;
+       }
+
+       .plugin-card .desc p:first-of-type {
+               margin-top: 0;
+       }
+
+       .fixed .column-date {
+               width: 14%;
+       }
+}
+
 @media screen and ( max-width: 782px ) {
        /* WP List Table Options & Filters */
        .tablenav {
@@ -1233,7 +1683,7 @@ tr.active + tr.plugin-update-tr .plugin-update .update-message {
        }
 
        .tablenav.top {
-               margin: 0;
+               margin: 20px 0 5px 0;
        }
 
        .tablenav.bottom {
@@ -1249,10 +1699,17 @@ tr.active + tr.plugin-update-tr .plugin-update .update-message {
                display: block;
        }
 
-       .tablenav.top .actions, .view-switch {
+       .tablenav.top .actions,
+       .tablenav .view-switch {
                display: none;
        }
 
+       .view-switch a {
+               width: 36px;
+               height: 36px;
+               line-height: 33px;
+       }
+
        /* Pagination */
        .tablenav.top .displaying-num {
                display: none;
@@ -1261,12 +1718,14 @@ tr.active + tr.plugin-update-tr .plugin-update .update-message {
        .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;
        }
@@ -1284,19 +1743,23 @@ tr.active + tr.plugin-update-tr .plugin-update .update-message {
                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 */
@@ -1308,35 +1771,143 @@ tr.active + tr.plugin-update-tr .plugin-update .update-message {
                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 * {
@@ -1380,7 +1951,8 @@ tr.active + tr.plugin-update-tr .plugin-update .update-message {
                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;
        }
 
@@ -1392,7 +1964,8 @@ tr.active + tr.plugin-update-tr .plugin-update .update-message {
                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;
        }
 
@@ -1406,41 +1979,38 @@ tr.active + tr.plugin-update-tr .plugin-update .update-message {
                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: 50px;
+       #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 */
@@ -1452,49 +2022,27 @@ tr.active + tr.plugin-update-tr .plugin-update .update-message {
                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;
-       }
-
-       .wp-list-table.plugins tfoot {
-               bottom: -35px;
-               top: auto;
+       #wpbody-content .wp-list-table.plugins .column-description {
+               padding-top: 2px;
        }
 
-       .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,
@@ -1503,20 +2051,26 @@ tr.active + tr.plugin-update-tr .plugin-update .update-message {
                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);
        }
@@ -1526,63 +2080,38 @@ tr.active + tr.plugin-update-tr .plugin-update .update-message {
                border-top: none;
        }
 
-       .wp-list-table.plugins .column-description {
-               padding-top: 0;
-       }
-
-       .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;
-       }
-
-       .wp-list-table.plugins tr {
-               position: relative;
-       }
-
-       .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;
+       /* mimic the checkbox th */
+       .plugins .plugin-update-tr:before {
+               content: "";
+               display: table-cell;
        }
 
-       .wp-list-table.plugins thead th.check-column,
-       .wp-list-table.plugins tfoot th.check-column {
-               padding-right: 3px;
-               padding-top: 11px;
-               background: none;
+       .plugins .active.update + .plugin-update-tr:before {
+               border-right: 4px solid #d54e21;
+               background-color: #fef7f1;
        }
 
-       .widefat tbody th.check-column input[type="checkbox"] {
-               margin-top: -3px;
-               margin-right: 8px;
+       .plugins #the-list .plugin-update-tr .plugin-update {
+               border-right: none;
        }
 
-       .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 */
@@ -1616,4 +2145,22 @@ tr.active + tr.plugin-update-tr .plugin-update .update-message {
                -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;
+       }
 }