Admin bar sprite tidy up

[apeatling]

As of r16619 the admin bar sprite needs to be tidied up. A few things:

• The sprite still includes the WordPress.com logo
  
• There are images for the search button - these could probably be removed and changed to CSS
  
• The top horizontal and vertical lines are not needed (as far as I'm aware)
  
• The checkmark is not used and can be removed
  
• The spacing around the images could probably be tightened up
  

User Darren_ is currently patching this as per our conversation earlier (​https://irclogs.wordpress.org/chanlog.php?channel=wordpress-dev&day=2010-11-29#m210424).

[nacin]

Indeed, let's reduce this sprite to as little as possible.

Also, mentions of it in admin-bar.dev.css should be modified from d=08102010 to ver=yyyymmdd, where that's the date of the commit.

[nacin]

I am thinking the search button can be made entirely CSS3. And potentially the main gradient as well.

[filosofo]

Since Darren_ is taking out the wp.com logo, maybe he could make the gradient go down another line's worth, so sub-menu hovers can go to 2 lines.

[apeatling]

I think the gradients could definitely go CSS, that'll fix the multi-line issue too.

[darrenmeehan]

I've removed the need for most of the sprite. The search box is now completely css, as are the gradients. Having some problems with the drop down menus in IE though.

[darrenmeehan]

admin-bar.dev.css using gradients

[ryan]

Diffs for admin-bar.dev.css

[nacin]

We need the new sprite image from darrenmeehan.

[ocean90]

We can make the search button and input field with CSS too, have a patch here but it needs a refresh. Wanted?

Also, do we want to support Internet Explorer with the filter hack? We didn't have it for the admin header/footer too.

[nacin]

Replying to ocean90:

We can make the search button and input field with CSS too, have a patch here but it needs a refresh. Wanted?

Yeah, let's do it. Would love to not have a single image, personally.

Also, do we want to support Internet Explorer with the filter hack? We didn't have it for the admin header/footer too.

Doesn't matter to me. I imagine it doesn't look so good without the gradient, but then again, if you've ever looked at the admin in IE6...

[ocean90]

adminbar.patch:

• removes wp_admin_bar_me_separator() and adds the avatar to wp_admin_bar_my_account_menu() to fix arrow background
• removes wp_admin_bar_blog_separator() because it's not used, wp.com remain
• adds some inline docs
• reduces the sprite through the use of CSS gradient, now only 3 images.

Tested on OS X with Chrome, Safari, Firefox and Windows with IE 6-9, Chrome, Opera, Firefox.

[ryan]

(In [16897]) Admin bar sprite cleanups. Props ocean90, darrenmeehan. see #15611

[demetris]

Issues in admin bar after r16897

[demetris]

After r16897 the first item and its dropdown have some issues. See attached screenshot.

[ocean90]

demetris: Thx, I forget to handle no gravatars. Patch is in work.

[ocean90]

15611.no.gravatar.patch will fix the problem mentioned by demetris.

[nacin]

(In [16913]) Fix admin bar styling when no avatars are in use. props ocean90, see #15611.

[ocean90]

Closing it as fixed.

[ocean90]

Reopen for 15611.logout.patch. Sorry. :-(

[westi]

(In [16934]) Give the Logout menu item the correct parent so it appears when we have avatars as well as when we don't. Fixes #15611 props ocean90.