Tuesday, 7 May 2013

Tutorial : Cantikkan Sidebar




Style 1

border: 1px dashed #000000;
background: url(URL BACKGROUND);
border-bottom-right-radius: 10px;
border-top-right-radius: 10px;
border-left: 1px solid #999999;
margin: 1.6em 0 .5em;
padding: 4px 5px;
background-color: $sidebarTitleBgColor;
font-size: 100%;
color: $sidebarTitleTextColor;
}
Style 2 
border: 2px solid #FAAFBE;
background: url(URL BACKGROUND);
margin: 1.6em 0 .5em;
padding: 4px 5px;
background-color: $sidebarTitleBgColor;
font-size: 100%;
color: $sidebarTitleTextColor;
}

Style 3 
border-bottom: 2px solid #8A4B08;
border-top: 2px solid #8A4B08;
background: url(URL BACKGROUND);
margin: 1.6em 0 .5em;
padding: 4px 5px;
background-color: $sidebarTitleBgColor;
font-size: 100%;
color: $sidebarTitleTextColor;
}

Style 4 
border-bottom: 2px dashed #58FAAC;
background: url(URL BACKGROUND);
margin: 1.6em 0 .5em;
padding: 4px 5px;
background-color: $sidebarTitleBgColor;
font-size: 100%;
color: $sidebarTitleTextColor;
}

Style 5 
border: 2px solid #333333;
background-colour: #FAAFBE;
border-bottom-right-radius: 25px;
border-top-right-radius: 25px;
border-top-left-radius: 25px;
border-left: 2px solid #333333;
}

Merah : URL background
Hijau : warna background
Biru : warna border
Oren : solid / dotted / dashed

Credit to : FatinJaafar

0 comments: