I started to work a bit on with D7 and on of the first steps was to install the admin_menu. I activated the better toolbar also. But after I activated it I though "why is the styling of this module just a little different than the default styling".

What I hoped was to get the samestyling as the D7 toolbar with the extra features of the dropdown admin menu. I like the D7 style a litle better than the current styling. I talked about it with sun on IRC and he stated that "it's outdated and needs updating". We talked about it and the suggestion came to do a small proposal and make list of things I was thinkin of.

There are two files attached. One is the better toolbar style as it currently is. And the second is the style used by D7. Here is the list of things I would change.

  • First I would remove the gradient in the background.
  • I would bring down the font size a little to that of D7.
  • Span the shortcut bar the the same over the complete width.
  • Remove the red 'alert' button behind the users name in the top.
  • Bring the gradient that is in D7 below the bar to into the same place

It looks to me as if the current D7 toolbar is copied from the Better Toolbar with these minor changes that I mentioned. It would be great to see admin_menu transform into a core module that is there for the DX and UX experience. Maybe aligning this module a bit more would be a step in that direction.

By aligning the two users will have get a more comfortable feeling in using new features. They don't have to adjust to much.

CommentFileSizeAuthor
#15 toolbar.patch439 bytesKiphaas7
#8 admin_menu.toolbar.8.patch3.6 KBsun
#4 admin_menu_toolbar.patch2.3 KBmatglas86
#1 admin_menu_toolbar.patch2.32 KBmatglas86
d7-admin-toolbar.png8.64 KBmatglas86
d7-better-toolbar.png11.46 KBmatglas86
Support from Acquia helps fund testing for Drupal Acquia logo

Comments

matglas86’s picture

matglas86 CreditAttribution: matglas86 commented
FileSize
admin_menu_toolbar.patch2.32 KB

I tried the above proposed styling on the toolbar and created a patch. The patch was run again the module root. I hope I did it right, this is my second patch every posted on Drupal. Hope somebody can try it and give some feedback.

sun’s picture

sun
Primary language German
Location Karlsruhe
CreditAttribution: sun commented
Title: Proposing to align Better Toolbar styling with the default D7 toolbar style. » Align Better Toolbar style with core Toolbar style

Are these styles actually copied/synced from toolbar.css or did you do them in a "custom resembling" approach?

+	margin-top: 5px;

There are lots of TABs in this patch ;)

+#admin-menu li.admin-menu-shortcuts:hover span.toggle { ¶

And trailing white-space.

Powered by Dreditor.

matglas86’s picture

matglas86 CreditAttribution: matglas86 commented
Status: Active » Needs work

I did 90% custom resembling. There is a only one css decleration that I copied. I think the white-space things are bad result of my Windows + Eclipse settings.

matglas86’s picture

matglas86 CreditAttribution: matglas86 commented
FileSize
admin_menu_toolbar.patch2.3 KB

Here is the revised patch with a fix for the white-spaces.

matglas86’s picture

matglas86 CreditAttribution: matglas86 commented
Status: Needs work » Needs review

I posted it with needs work but actualy it needs review :)

andypost’s picture

andypost
he/him
Primary language Russian
CreditAttribution: andypost commented 
+++ admin_menu_toolbar.css	(revision 5)
@@ -122,6 +144,7 @@
+    white-space: nowrap;

another space margin wrong

Powered by Dreditor.

matglas86’s picture

matglas86 CreditAttribution: matglas86 commented

Should I post a new patch? Is someone willing to give it a try and see if the visual results is what it should be?

sun’s picture

sun
Primary language German
Location Karlsruhe
CreditAttribution: sun commented
Status: Needs review » Fixed
FileSize
admin_menu.toolbar.8.patch3.6 KB

Not really comfortable with some of these changes. Took the time to extensively diff toolbar.css against admin_menu_toolbar.css and merged in the updates since the last merger.

Thanks for reporting, reviewing, and testing! Committed attached patch to HEAD.

A new development snapshot will be available within the next 12 hours. This improvement will be available in the next official release.

Feel free to re-open this issue if you find any issues, please. In particular, I tested with FF 3.5 only.

matglas86’s picture

matglas86 CreditAttribution: matglas86 commented

Thanks for taking the time to look at the patch and bringing this to the HEAD. I'll take a look at, also on IE, and see if there are things that I need to be fixed still.

froboy’s picture

froboy
he/him
Primary language English
Location Chicago, IL
CreditAttribution: froboy commented

Thanks for the patch sun. This does fix my issue in #994050: Toolbar style tweak

I tested in Safari, Chrome, and FF (latest) on Mac and Win and all seems consistent and working well. IE8 was a different story... http://screencast.com/t/fQWBjOyiuwog

Here's a short list:

  • No active item highlight
  • No dropdowns
  • No rounded corners on anything
  • Shortcuts dropdown doesn't work

Personally I always tell my users to only use IE when absolutely necessary (i.e. NEVER with Drupal) but we all still have to deal with it, so there it is.

callison’s picture

callison CreditAttribution: callison commented
Status: Fixed » Needs work

IMHO, I think there is still a little work to be done to get this more in line with the D7 toolbar. Namely, the shortcut bar that appears when you hover over the arrow is very difficult to use. I much prefer the D7 method of clicking the arrow and the bar is dropped permanently until the arrow is clicked again. I find it very cumbersome to hover over the arrow, slowly move my mouse along the bar (without touching any of the above menu items) until I get all the way to the buttons on the left side. I'd love to hear other's thoughts - this is just my initial impression.

sun’s picture

sun
Primary language German
Location Karlsruhe
CreditAttribution: sun commented
Status: Needs work » Fixed

@callison: That's #742184: Shortcut.module integration

callison’s picture

callison CreditAttribution: callison commented

@sun: I thought about posting it there, but it seemed to make more sense here since it really has to do with styling and nothing really to do with the functionality of the shortcut links themselves, which is what I thought #742184: Shortcut.module integration was about.

Status: Fixed » Closed (fixed)

Automatically closed -- issue fixed for 2 weeks with no activity.

Kiphaas7’s picture

Kiphaas7 CreditAttribution: Kiphaas7 commented
Category: feature » bug
Status: Closed (fixed) » Needs review
FileSize
toolbar.patch439 bytes

The commit which belongs to this issue ( http://drupalcode.org/project/admin_menu.git/commit/d56c7c4 ) introduced the following:

 #admin-menu {
...
+  position: fixed;
...

Which makes the "Keep menu at top of page" option useless. I propose removing the position fixed, and let the option "Keep menu at top of page" deal whether or not the menu should be fixed.

sun’s picture

sun
Primary language German
Location Karlsruhe
CreditAttribution: sun commented
Status: Needs review » Fixed

#15 was fixed via #1086346: Better Toolbar does not respect 'Keep menu at top of page' setting

Somehow I thought this issue wasn't done yet, but apparently, we performed a full sync in #8 already...

Thus, reverting to fixed.

Status: Fixed » Closed (fixed)

Automatically closed -- issue fixed for 2 weeks with no activity.

sun’s picture

sun
Primary language German
Location Karlsruhe
CreditAttribution: sun commented

FWIW, we plan to diverge from core Toolbar's style in #1683132: Extra 20px padding causes horizontal scrolling