I've used some CSS to restyle the titlebar breadcrumbs in a SharePoint 2010 mysite.
.s4-title h1 a, .s4-title h2 a, .s4-titlesep h2, .s4-title h2, .ms-ltviewselectormenuheader .ms-viewselector a
{
font-family: Verdana;
color: #777777;
font-weight: bold;
font-size: 10pt;
}
.s4-title h1 a:hover, .s4-title h2 a:hover, .ms-ltviewselectormenuheader .ms-viewselector a:hover
{
font-family: Verdana;
color: #454545;
font-weight: bold;
font-size: 10pt;
text-decoration: underline;
}
This gives me menus that look exactly like I want them to. And they underline and go darker as required when you hover over them (sorry not enough rep to show the image)
However, some SharePoint javascript is overriding my efforts when I navigate to a document library such as Dave Hooper > Share Documents > All Documents and hover over the 'all documents' link:
I presume the styling is changing due to some built in javascript as disabling it makes it behave like the 'Shared Documents' links. But obviously the site needs javascript and I still want the popup to appear and allow users to change views etc.
So I presume I need to override some Javascript somehow? Any ideas?
Thanks @dandroid and @sig-weber! In the end I had to do a little more work (should I put the complete answer in a comment or is editing my original post the right thing to do?) but @sig-weber did the hard work:
.ms-ltviewselectormenuheader .ms-viewselectorhover
{
border: 0px;
padding: 2px 0 0 0px;
text-decoration: underline;
}
.ms-ltviewselectormenuheader .ms-viewselectorhover A
{
font-family: Verdana;
color: #454545;
font-weight: bold;
background-color: #FFFFFF;
font-size: 10pt;
text-decoration: underline !important;
background-image: none;
padding: 2px 0 0 0px;
margin: 0 0 0 6px;
}