Improve focus styles for the Switch View links in Posts listings and Media Library.

props afercia.
fixes #32294.
Built from https://develop.svn.wordpress.org/trunk@32485


git-svn-id: http://core.svn.wordpress.org/trunk@32455 1a063a9b-81f0-0310-95a4-ce76da25c4cd

wp-admin/css/common-rtl.css

@@ -933,7 +933,7 @@ th.action-links {
 	-moz-box-sizing: border-box;
 	box-sizing: border-box;
 	margin: 12px 0 25px;
-	padding: 0 20px;
+	padding: 0 10px;
 	width: 100%;
 	-webkit-box-shadow: 0 1px 1px rgba(0,0,0,0.04);
 	box-shadow: 0 1px 1px rgba(0,0,0,0.04);

wp-admin/css/common.css

@@ -933,7 +933,7 @@ th.action-links {
 	-moz-box-sizing: border-box;
 	box-sizing: border-box;
 	margin: 12px 0 25px;
-	padding: 0 20px;
+	padding: 0 10px;
 	width: 100%;
 	-webkit-box-shadow: 0 1px 1px rgba(0,0,0,0.04);
 	box-shadow: 0 1px 1px rgba(0,0,0,0.04);

wp-admin/css/list-tables-rtl.css

@@ -563,12 +563,18 @@ th.asc:hover span.sorting-indicator {
 }
 
 .tablenav .displaying-num {
-	margin-left: 2px;
+	margin-left: 7px;
 	color: #777;
 	font-size: 12px;
 	font-style: italic;
 }
 
+.tablenav .one-page .displaying-num {
+	display: inline-block;
+	margin-top: 2px;
+	margin-left: 0;
+}
+
 .tablenav .actions {
 	overflow: hidden;
 	padding: 2px 0 0 8px;
@@ -603,43 +609,43 @@ classes exist in paginate_links() but not seen in list table output. */
 
 .tablenav .view-switch {
 	float: left;
-	margin: 5px 8px 0 16px;
+	margin: 0 5px;
+	padding-top: 3px;
+	/* line-height in px same as .tablenav height */
+	line-height: 30px;
 }
 
 .wp-filter .view-switch {
 	display: inline-block;
 	vertical-align: middle;
-	padding: 15px 0;
+	padding: 12px 0;
-	margin: 0 0 0 20px;
+	margin: 0 2px 0 8px;
+}
+
+.media-toolbar.wp-filter .view-switch {
+	margin: 0 2px 0 12px;
 }
 
 .view-switch a {
-	text-decoration: none;
+	float: right;
+	width: 28px;
+	height: 28px;
+	text-align: center;
+	line-height: 24px;
 }
 
-.view-switch > a {
+.view-switch a:before {
-	display: inline-block;
-	width: 18px;
-	height: 18px;
-}
-
-.view-switch > a:before {
 	color: #b4b9be;
 	display: inline-block;
-	float: right;
 	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 {
+.view-switch a:hover:before,
-	content: '\f163';
+.view-switch a:focus:before {
-}
-
-.view-switch a:hover:before {
 	color: #727272;
 }
 
@@ -647,15 +653,15 @@ classes exist in paginate_links() but not seen in list table output. */
 	color: #0073aa;
 }
 
-.view-switch > a + a {
+.view-switch .view-list:before {
-	margin-right: 5px;
+	content: '\f163';
 }
 
-.view-switch > .view-excerpt:before {
+.view-switch .view-excerpt:before {
 	content: '\f164';
 }
 
-.view-switch > .view-grid:before {
+.view-switch .view-grid:before {
 	content: '\f509';
 }
 
@@ -1545,6 +1551,12 @@ div.action-links,
 		display: none;
 	}
 
+	.view-switch a {
+		width: 36px;
+		height: 36px;
+		line-height: 33px;
+	}
+
 	/* Pagination */
 	.tablenav.top .displaying-num {
 		display: none;

wp-admin/css/list-tables.css

@@ -563,12 +563,18 @@ th.asc:hover span.sorting-indicator {
 }
 
 .tablenav .displaying-num {
-	margin-right: 2px;
+	margin-right: 7px;
 	color: #777;
 	font-size: 12px;
 	font-style: italic;
 }
 
+.tablenav .one-page .displaying-num {
+	display: inline-block;
+	margin-top: 2px;
+	margin-right: 0;
+}
+
 .tablenav .actions {
 	overflow: hidden;
 	padding: 2px 8px 0 0;
@@ -603,43 +609,43 @@ classes exist in paginate_links() but not seen in list table output. */
 
 .tablenav .view-switch {
 	float: right;
-	margin: 5px 16px 0 8px;
+	margin: 0 5px;
+	padding-top: 3px;
+	/* line-height in px same as .tablenav height */
+	line-height: 30px;
 }
 
 .wp-filter .view-switch {
 	display: inline-block;
 	vertical-align: middle;
-	padding: 15px 0;
+	padding: 12px 0;
-	margin: 0 20px 0 0;
+	margin: 0 8px 0 2px;
+}
+
+.media-toolbar.wp-filter .view-switch {
+	margin: 0 12px 0 2px;
 }
 
 .view-switch a {
-	text-decoration: none;
+	float: left;
+	width: 28px;
+	height: 28px;
+	text-align: center;
+	line-height: 24px;
 }
 
-.view-switch > a {
+.view-switch a:before {
-	display: inline-block;
-	width: 18px;
-	height: 18px;
-}
-
-.view-switch > a:before {
 	color: #b4b9be;
 	display: inline-block;
-	float: left;
 	font: normal 20px/1 'dashicons';
 	speak: none;
 	vertical-align: middle;
-	margin-left: 0;
 	-webkit-font-smoothing: antialiased;
 	-moz-osx-font-smoothing: grayscale;
 }
 
-.view-switch > .view-list:before {
+.view-switch a:hover:before,
-	content: '\f163';
+.view-switch a:focus:before {
-}
-
-.view-switch a:hover:before {
 	color: #727272;
 }
 
@@ -647,15 +653,15 @@ classes exist in paginate_links() but not seen in list table output. */
 	color: #0073aa;
 }
 
-.view-switch > a + a {
+.view-switch .view-list:before {
-	margin-left: 5px;
+	content: '\f163';
 }
 
-.view-switch > .view-excerpt:before {
+.view-switch .view-excerpt:before {
 	content: '\f164';
 }
 
-.view-switch > .view-grid:before {
+.view-switch .view-grid:before {
 	content: '\f509';
 }
 
@@ -1545,6 +1551,12 @@ div.action-links,
 		display: none;
 	}
 
+	.view-switch a {
+		width: 36px;
+		height: 36px;
+		line-height: 33px;
+	}
+
 	/* Pagination */
 	.tablenav.top .displaying-num {
 		display: none;

wp-includes/version.php

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