I was working on a project where I happened to implement Branding on SharePoint site. I created/modified the existing CSS Classes to achieve the desired result.
Here are some CSS classes listed below that I modified:
To hide Quick Launch
.ms-quicklaunchouter
{
display:none;
}
#s4-leftpanel-content
{
display:none;
}
.s4-ca
{
MIN-HEIGHT: 324px; BACKGROUND: #fff; MARGIN-LEFT: 0px; MARGIN-RIGHT: 0px
}
Change global navigation background color
.s4-tn
{
background:white;
}
Change the font color of the site actions text
.ms-menu-a span
{
color:black;
}
To hide title logo - breadcrumb
.s4-titlelogo
{
display:none;
}
Make breadcrumb bar height small
.s4-title, .s4-lp
{
background:white;
}
To hide breadcrumb tag & Notes section - breadcrumb
.ms-socialNotif
{
display:none;
}
Change the font color of Browse and Page text in the menu
.ms-cui-tt-span
{
color:black;
background:white;
}
Change the background color of top bar (site actions, browse, page)
.ms-cui-topBar2
{
background:white;
}
Make all menu item color black
.s4-tn li.static > .menu-item
{
color:black;
border-color:black;
}
Menu item background color
.s4-tn li.static a.menu-item
{
background:white;
}
Global navigatioh selected item color red i.e. first tab
.s4-toplinks .s4-tn a.selected
{
color:red;
border-color:black;
}
Global navigation menu item hover - black
.s4-toplinks .s4-tn a.selected:hover
{
color:black;
}
Menu item hover
.s4-tn li.static > a:hover
{
background:white;
border-color:black;
border:thin;
color:red;
}
Change the Action Button background color -Logged on Username
.ms-SpLinkButtonActive a,.ms-SpLinkButtonActive a:hover{
color:red;
text-decoration:none;
background:FFDBAD;
}
Change the background color of the web part header where the Title is 'Working at ABC'
.ms-WPHeader TD[title^="Working at ABC"]
{
background:#FF9900;
}
Change the font color of logged on username
.ms-SPLink A:link,.ms-SPLink A:visited
{
color:gray;
text-decoration:none;
font-size:14px;
font-weight:bold;
text-decoration:underline;
}
Showing posts with label CSS. Show all posts
Showing posts with label CSS. Show all posts
Saturday, April 10, 2010
Subscribe to:
Posts (Atom)