Hey,
I have a question about customising the following menu:
Is it possible to remove the Manager, App and Jobs links whilst keeping the Logout link? How would I remove any one of those links?
It would be good to be able to control which of these links different types of users (admin, dev etc) can see but for now, just knowing how to remove some of those links whilst keeping others would be great to know 🙂
I think that this is another application.css job but I am not sure.
Thanks in advance for your help.
The remorse: Classnames were not left on these links that would allow you to apply different styles to each link from your application's CSS. It'd be great if they had class="logoutLink" and class="managerLink" etc and this sort of thing would be trivial.
The good news: There is some non-trivial but still simple CSS that will do it.
.AccountBar ul li {
display:none;
}
.AccountBar ul li:last-child {
display:list-item;
}
The bad news: this CSS will not work on internet explorer 6, 7 or 8. Which pretty much rules it out unless for some reason all your users are on firefox, chrome, etc...
The other ideas: 1) from application.js you write a little bit of Javascript to use the same CSS selectors (jquery implements its own selectors so you can use the same CSS selector approach or several other approaches for that matter). However the other links may briefly flash as the page loads.
2) make a custom module that's basically a straight copy of all the 'AccountBar.*' files, but you find the bits in the mako template that create the other links and you remove them (mako template means the .html file)
The remorse: Classnames were not left on these links that would allow you to apply different styles to each link from your application's CSS. It'd be great if they had class="logoutLink" and class="managerLink" etc and this sort of thing would be trivial.
The good news: There is some non-trivial but still simple CSS that will do it.
.AccountBar ul li {
display:none;
}
.AccountBar ul li:last-child {
display:list-item;
}
The bad news: this CSS will not work on internet explorer 6, 7 or 8. Which pretty much rules it out unless for some reason all your users are on firefox, chrome, etc...
The other ideas: 1) from application.js you write a little bit of Javascript to use the same CSS selectors (jquery implements its own selectors so you can use the same CSS selector approach or several other approaches for that matter). However the other links may briefly flash as the page loads.
2) make a custom module that's basically a straight copy of all the 'AccountBar.*' files, but you find the bits in the mako template that create the other links and you remove them (mako template means the .html file)
Thanks for the info
If you know how to write the javascript that would make this work, could you share it please?
Because IE never implemented the ':last-child' selector, and without there being any other identifiable classname or id on the li element (and without even fancier selectors that might do the trick), IE is left with no way to do it at all.
Why does this CSS not work in IE?
Somewhat related question: