Changeset 32074

Timestamp:

04/08/2015 04:07:51 PM (12 years ago)

Author:

helen

Message:

Toolbar: Search item consistency for focus state and IE8.

props afercia.
fixes #31322.

Location:

trunk/src/wp-includes

Files:

• css/admin-bar.css (modified) (8 diffs)
• js/admin-bar.js (modified) (1 diff)

trunk/src/wp-includes/css/admin-bar.css

@@ -283 +283 @@
 #wpadminbar li.hover .ab-icon:before,
 #wpadminbar li.hover .ab-item:before,
-#wpadminbar li:hover #adminbarsearch:before {
+#wpadminbar li:hover #adminbarsearch:before,
+#wpadminbar li #adminbarsearch.adminbar-focused:before {
         color: #00b9eb;
 }
@@ -388 +389 @@
 }
 
+#wpadminbar.ie8 #wp-admin-bar-my-account.with-avatar .ab-item {
+        white-space: nowrap;
+}
+
 #wpadminbar #wp-admin-bar-user-actions > li {
         margin-left: 16px;
@@ -437 +442 @@
 }
 
-#wpadminbar .quicklinks li#wp-admin-bar-my-account.with-avatar > a img {
-        width: 16px;
+#wpadminbar #wp-admin-bar-my-account.with-avatar > a img {
+        width: auto;
         height: 16px;
         padding: 0;
@@ -448 +453 @@
         float: none;
         display: inline;
+}
+
+#wpadminbar.ie8 #wp-admin-bar-my-account.with-avatar > a img {
+        width: auto;
 }
 
@@ -553 +562 @@
  * Search
  */
+#wpadminbar.ie8 #wp-admin-bar-search {
+        display: block;
+        min-width: 32px;
+}
 #wpadminbar #wp-admin-bar-search .ab-item {
         padding: 0;
@@ -562 +575 @@
         height: 32px;
         padding: 0 2px;
+        z-index: 1;
 }
 
@@ -582 +596 @@
         height: 24px;
         width: 24px;
+        max-width: none;
         padding: 0 3px 0 24px;
         margin: 0;
@@ -617 +632 @@
 
 #wpadminbar.ie8 > #wp-toolbar > #wp-admin-bar-top-secondary > #wp-admin-bar-search #adminbarsearch input.adminbar-input {
-        margin-top: 4px;
-        background-color: #464646;
+        /* IE8 z-index bug with transparent / empty elements - fill in with an encoded transparent GIF */
+        background: transparent 0 0 repeat scroll url("data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBR‌​AA7");
+}
+
+/* IE8 doesn't redraw the pseudo elements unless you make a change to the content */
+#wpadminbar.ie8 #adminbarsearch.adminbar-focused:before {
+        content: '\f179 '; /* extra space */
 }
 
 #wpadminbar.ie8 > #wp-toolbar > #wp-admin-bar-top-secondary > #wp-admin-bar-search #adminbarsearch input.adminbar-input:focus {
-        background-color: #fff;
+        background: #fff;
+        z-index: -1;
 }
 

trunk/src/wp-includes/js/admin-bar.js

@@ -150 +150 @@
                 });
 
+                $( '#adminbar-search' ).on({
+                        focus: function() {
+                                $( '#adminbarsearch' ).addClass( 'adminbar-focused' );
+                        }, blur: function() {
+                                $( '#adminbarsearch' ).removeClass( 'adminbar-focused' );
+                        }
+                } );
+
                 // Empty sessionStorage on logging out
                 if ( 'sessionStorage' in window ) {