Posted by scottrigby on September 26, 2009 at 10:00pm
| Project: | Administration menu |
| Version: | 6.x-3.x-dev |
| Component: | User interface |
| Category: | bug report |
| Priority: | minor |
| Assigned: | Unassigned |
| Status: | closed (fixed) |
Issue Summary
The toolbar opens to the right, off the screen in Garland. See this comment #554124-10: D7 styles in 6.x-3.0-alpha3 (Missing toolbar.png) for (slightly) longer description with screenshots :)
PS, that issue - resolved by Dave Reid - was about a missing png, whereas this issue is just about the toolbar display.
Comments
#1
Confirmed not showing properly in Acquia Marina or Zero Point.
#2
Screenshots please.
#3
In attachment, toolbar extends off right edge of screen. Is this same/related issue?
#4
@sun: the screenshots are already in the linked issue-comment above. I didn't want to upload duplicate images (plus i deleted from my desktop). I can re-upload if absolutely necessary, but here are the links for convenience:
http://drupal.org/files/issues/554124_10_1.png
http://drupal.org/files/issues/554124_10_2.png
http://drupal.org/files/issues/554124_10_3.png
@DigitalFrontiersMedia: yes it looks like the same issue.
#5
A temporary fix would be to change float right to float left instead at #admin-menu li.admin-menu-shortcuts
#6
Thanks Kam , but the fix appeared pretty messy in my browser. What about this instead? I need help with the js though, since it currently uses one function to pop open every menu.
On hover, the adminmenu ul elements are given the property of
left: auto; display: block, when this particular content menu could beleft: 85% ; display: block. This would make this menu start 85% of the way across the page. The better option would be to get it to start a specific number of pixels from the right (in theory,right: 160px ; display: block), but for some reason CSS doesn't work like that -- I don't really get it, but whatever.If I could get that to happen on mouseover, then I could make this change to the stylesheet, and things would be grand.
#admin-menu li.admin-menu-shortcuts ul {background:transparent none repeat scroll 0 0;
display:none;
left:-999em;
line-height:1.2em;
margin:0;
position:absolute;
width:100%;
}
This is a copy of
#admin-menu li ul, but with the width set to100%instead of160 px. This makes it so that this block goes all the way to the right-most side of the screen. So we would have it going from 85% of the way across, right to the end. Looks alright on firebug, but can't make it happen with the JS, since all menus use the same bit of code.Anyhow, this is the js that makes that happen (from
admin_menu.js), but I'm not sure how to tweak it to keep it doing the same thing on every other menu, but act different for this pesky content menu.// Delayed mouseout.$('li', $adminMenu).hover(function() {
// Stop the timer.
clearTimeout(this.sfTimer);
// Display child lists.
$('> ul', this).css({left: 'auto', display: 'block'})
// Immediately hide nephew lists.
.parent().siblings('li').children('ul').css({left: '-999em', display: 'none'});
}, function() {
// Start the timer.
var uls = $('> ul', this);
this.sfTimer = setTimeout(function() {
uls.css({left: '-999em', display: 'none'});
}, 400);
});
};
Probably not the most elegant of solutions, but until a CSS guru comes along, this is the direction I need to take :)
If you can figure it out, lemme know!
#7
Oy... now that I've typed it out, it seems pretty unwieldy... probably a deadend, but whatever
#8
I can confirm screenshots from #4 in both Garland and the backported Seven
#9
I resolved this by adding the following line in my theme's CSS. Worked on 3 themes i tried.
#admin-menu li.admin-menu-shortcuts ul {margin-left: -155px;}also, you don't need to fix the toolbar.png issue first.
#10
#11
(subscribe)
#12
Om hover this should also be set:
right: 10px
works like a charm for me in ff3.6 & ie8!
#13
Can someone roll a proper patch for this?
#14
Haven't got a clue how to roll a patch, yet, still learning myself moduledev.
Could someone link me to some info about it?
// Tim
#15
Code in #9 worked for 6.x-3.x-dev (2010-Mar-12).
Patch to include code in #9.
#16
Alternative.
Modified code in #12 worked for 6.x-3.x-dev (2010-Mar-12).
Changes:
Code:
#admin-menu li.admin-menu-shortcuts ul {right: 10px;}Patch:
#17
Hey hawleyal, the one-liner css code fixed this issue for me. There is a minor issue with different font sizes though, where width should be adjusted (max-width set perhaps or width set to auto?)
Take a look at attached screenshot to see what I mean...
#18
edit!
@klonos, #17
agree it shouldn't do that.
however, mine doesn't.
do you have the latest dev ver?
i see:
<li style="width: auto;"><a href="#" style="display: block;">text</a>
</li>
what browser are you using?
moreover, the admin menu works okay if decrease font-size / zoom out.
totally borks on increase font-size / zoom in.
#19
These are changes to the toolbar and should be included in admin_menu_toolbar.css rather than admin_menu.css.
This fixes the display, but I think a better question is why is this shortcut menu over on the right anyway? Isn't this where you go to logout? d7's shortcuts are all left aligned. I appreciate that admin_menu_toolbar is only half baked, but is there a convincing argument as to why the shortcuts are right aligned?
#20
@fenstrat
Thanks for the correction.
My users were screaming at me. I just needed a quick fix.
-AH
#21
I didn't test the latest patch. Though I wanted to mention that I started to work on this in #742184: Shortcut.module integration and identified a full range of other problems.
#22
@hawleyal: I almost always use dev builds (wherever available). So, yes it was the latest dev version.
Furthermore, I don't think that it is browser specific, since the issue is there in both IE8 and also in different versions of fx3 (3.6.x & 3.7a3pre).
I now use the updated patch in #19 applied in admin_menu_toolbar.css. Issue still there, but remains minor as I can live with it for the time being (at least the menu doesn't go off screen now!).
Thanx for the fix!
#23
Patch #19 by fenstrat works for me on a dozen of different themes.
#24
patch #19 works for me
#25
@ #9 : Brilliant, thank you!
#26
#19 works great, but added
+ clear:both
to get the items to show underneath one another (on chrome anyway)
#27
They're ment to be next to each other. But yeah, clear: both; on the li will place them under each other.
#28
Subscribing...
#29
Still getting this bug (without patch) in firefox 3.6.6 and chrome 5. tried it with bluemarine, chameleon and garland themes in Drupal 6.17
But patch seemed to fix it
#30
Agreeing with #19. The patch works, but why is this button on the right?
#31
Patch from #19 still works fine for me in D6.17 in all contrib and custom themes. Also I can confirm that the suggestion to add
clear: both;makes the menu items display vertically (underneath one another) on fx3.6 or ie8. Thanx Michael!@fenstrat, #27: hey Saul, I don't know what exactly you mean by saying They're ment to be next to each other (?), but having them display vertically solves another issue I often come across... If you try to move your mouse (in a rather hasty and perhaps clumsy way) to the left-most item, then the menu might disappear on you. If you don't understand what I am trying to describe, I can provide a short screencast to demonstrate it.
I know there might be concerns about this patch (I honestly don't understand why since it seems to be a no-brainer), but it seems to fix this issue for a lot of people and it's been around for 2-3 months now. So, I am setting it to RTBC to have it committed asap.
#32
@klonos They're ment to be next to each other - As far as I can tell these shortcut menu items are meant to be horizontally aligned next to each other. The idea being to mimic the behaviour of d7's toolbar. I also understand what you're trying to describe with the mouseout issues when the items are horizontally aligned, but that's probably best solved with a suckerfish type solution to hide the menu after a short delay on mouseout. Probably outside the scope of this issue.
So yes, #19 is RTBC.
#33
I agree on both ;)
#34
+1 Thank you for providing the patch.
#35
installed this patch on numerous D6 sites with various configs and it works on all Mac browsers (FF,Ch,Sfi). I say commit the thing and save me time on the next site I build.
Commit! #19
Commit! #19
Commit! #19
Thanks for all the hard work, too!
#36
...just reporting that patch in #19 still works with latest 2010-Jul-28 dev.
#37
Not sure why all of you are happy with #19, I'm personally not, but for now, I don't really care, because this entire thing needs to be completely revamped in #742184: Shortcut.module integration
Thanks for reporting, reviewing, and testing! Committed to all branches.
A new development snapshot will be available within the next 12 hours. This improvement will be available in the next official release.
#38
Confirming fixed in latest dev (2010-Jul-29). One less patch to maintain and re-apply on each installation after each update ;)
#39
Automatically closed -- issue fixed for 2 weeks with no activity.