richard
/
SemanSemantic-UItic-UI
mirror of https://github.com/Semantic-Org/Semantic-UI.git
1
0
Fork 0
Code Issues Projects Releases Wiki Activity
Browse Source

Adds colored basic labels

pull/2850/head
Jack Lukic 9 years ago
parent
54d01adcff
commit
8d6939084b
1 changed files with 260 additions and 120 deletions
Split View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 380
      src/definitions/elements/label.less

380
src/definitions/elements/label.less
View File

@ -538,22 +538,34 @@ a.ui.active.label:ActiveHover:before {
border-color: @red !important;
color: @redTextColor !important;
}
.ui.red.corner.label,
.ui.red.corner.label:hover {
background-color: transparent !important;
}
a.ui.red.labels .label:hover,
/* Link */
.ui.red.labels .laabel:hover,
a.ui.red.label:hover{
background-color: @redHover !important;
border-color: @redHover !important;
color: @redHoverTextColor !important;
}
/* Corner */
.ui.red.corner.label,
.ui.red.corner.label:hover {
background-color: transparent !important;
}
/* Ribbon */
.ui.red.ribbon.label {
border-color: @redRibbonShadow !important;
}
/* Basic */
.ui.basic.red.label {
background-color: @white !important;
color: @red !important;
border-color: @red !important;
}
.ui.basic.orange.labels a.label:hover,
a.ui.basic.red.label:hover {
background-color: @white !important;
color: @redHover !important;
border-color: @redHover !important;
}
/*--- Orange ---*/
.ui.orange.labels .label,
@ -562,22 +574,34 @@ a.ui.red.label:hover{
border-color: @orange !important;
color: @orangeTextColor !important;
}
.ui.orange.corner.label,
.ui.orange.corner.label:hover {
background-color: transparent !important;
}
a.ui.orange.labels .label:hover,
/* Link */
.ui.orange.labels a.label:hover,
a.ui.orange.label:hover{
background-color: @orangeHover !important;
border-color: @orangeHover !important;
color: @orangeHoverTextColor !important;
}
/* Corner */
.ui.orange.corner.label,
.ui.orange.corner.label:hover {
background-color: transparent !important;
}
/* Ribbon */
.ui.orange.ribbon.label {
border-color: @orangeRibbonShadow !important;
}
/* Basic */
.ui.basic.orange.label {
background-color: @white !important;
color: @orange !important;
border-color: @orange !important;
}
.ui.basic.orange.labels a.label:hover,
a.ui.basic.orange.label:hover {
background-color: @white !important;
color: @orangeHover !important;
border-color: @orangeHover !important;
}
/*--- Yellow ---*/
.ui.yellow.labels .label,
@ -586,22 +610,34 @@ a.ui.orange.label:hover{
border-color: @yellow !important;
color: @yellowTextColor !important;
}
.ui.yellow.corner.label,
.ui.yellow.corner.label:hover {
background-color: transparent !important;
}
a.ui.yellow.labels .label:hover,
/* Link */
.ui.yellow.labels a.label:hover,
a.ui.yellow.label:hover{
background-color: @yellowHover !important;
border-color: @yellowHover !important;
color: @yellowHoverTextColor !important;
}
/* Corner */
.ui.yellow.corner.label,
.ui.yellow.corner.label:hover {
background-color: transparent !important;
}
/* Ribbon */
.ui.yellow.ribbon.label {
border-color: @yellowRibbonShadow !important;
}
/* Basic */
.ui.basic.yellow.label {
background-color: @white !important;
color: @yellow !important;
border-color: @yellow !important;
}
.ui.basic.orange.labels a.label:hover,
a.ui.basic.yellow.label:hover {
background-color: @white !important;
color: @yellowHover !important;
border-color: @yellowHover !important;
}
/*--- Olive ---*/
.ui.olive.labels .label,
@ -610,22 +646,34 @@ a.ui.yellow.label:hover{
border-color: @olive !important;
color: @oliveTextColor !important;
}
.ui.olive.corner.label,
.ui.olive.corner.label:hover {
background-color: transparent !important;
}
a.ui.olive.labels .label:hover,
/* Link */
.ui.olive.labels .alabel:hover,
a.ui.olive.label:hover{
background-color: @oliveHover !important;
border-color: @oliveHover !important;
color: @oliveHoverTextColor !important;
}
/* Corner */
.ui.olive.corner.label,
.ui.olive.corner.label:hover {
background-color: transparent !important;
}
/* Ribbon */
.ui.olive.ribbon.label {
border-color: @greenRibbonShadow !important;
}
/* Basic */
.ui.basic.olive.label {
background-color: @white !important;
color: @olive !important;
border-color: @olive !important;
}
.ui.basic.orange.labels a.label:hover,
a.ui.basic.olive.label:hover {
background-color: @white !important;
color: @oliveHover !important;
border-color: @oliveHover !important;
}
/*--- Green ---*/
.ui.green.labels .label,
@ -634,22 +682,34 @@ a.ui.olive.label:hover{
border-color: @green !important;
color: @greenTextColor !important;
}
.ui.green.corner.label,
.ui.green.corner.label:hover {
background-color: transparent !important;
}
a.ui.green.labels .label:hover,
/* Link */
.ui.green.labels .alabel:hover,
a.ui.green.label:hover{
background-color: @greenHover !important;
border-color: @greenHover !important;
color: @greenHoverTextColor !important;
}
/* Corner */
.ui.green.corner.label,
.ui.green.corner.label:hover {
background-color: transparent !important;
}
/* Ribbon */
.ui.green.ribbon.label {
border-color: @greenRibbonShadow !important;
}
/* Basic */
.ui.basic.green.label {
background-color: @white !important;
color: @green !important;
border-color: @green !important;
}
.ui.basic.orange.labels a.label:hover,
a.ui.basic.green.label:hover {
background-color: @white !important;
color: @greenHover !important;
border-color: @greenHover !important;
}
/*--- Teal ---*/
.ui.teal.labels .label,
@ -658,22 +718,34 @@ a.ui.green.label:hover{
border-color: @teal !important;
color: @tealTextColor !important;
}
.ui.teal.corner.label,
.ui.teal.corner.label:hover {
background-color: transparent !important;
}
a.ui.teal.labels .label:hover,
/* Link */
.ui.teal.labels .laabel:hover,
a.ui.teal.label:hover{
background-color: @tealHover !important;
border-color: @tealHover !important;
color: @tealHoverTextColor !important;
}
/* Corner */
.ui.teal.corner.label,
.ui.teal.corner.label:hover {
background-color: transparent !important;
}
/* Ribbon */
.ui.teal.ribbon.label {
border-color: @tealRibbonShadow !important;
}
/* Basic */
.ui.basic.teal.label {
background-color: @white !important;
color: @teal !important;
border-color: @teal !important;
}
.ui.basic.orange.labels a.label:hover,
a.ui.basic.teal.label:hover {
background-color: @white !important;
color: @tealHover !important;
border-color: @tealHover !important;
}
/*--- Blue ---*/
.ui.blue.labels .label,
@ -682,22 +754,34 @@ a.ui.teal.label:hover{
border-color: @blue !important;
color: @blueTextColor !important;
}
.ui.blue.corner.label,
.ui.blue.corner.label:hover {
background-color: transparent !important;
}
a.ui.blue.labels .label:hover,
/* Link */
.ui.blue.labels .laabel:hover,
a.ui.blue.label:hover{
background-color: @blueHover !important;
border-color: @blueHover !important;
color: @blueHoverTextColor !important;
}
/* Corner */
.ui.blue.corner.label,
.ui.blue.corner.label:hover {
background-color: transparent !important;
}
/* Ribbon */
.ui.blue.ribbon.label {
border-color: @blueRibbonShadow !important;
}
/* Basic */
.ui.basic.blue.label {
background-color: @white !important;
color: @blue !important;
border-color: @blue !important;
}
.ui.basic.orange.labels a.label:hover,
a.ui.basic.blue.label:hover {
background-color: @white !important;
color: @blueHover !important;
border-color: @blueHover !important;
}
/*--- Violet ---*/
.ui.violet.labels .label,
@ -706,22 +790,34 @@ a.ui.blue.label:hover{
border-color: @violet !important;
color: @violetTextColor !important;
}
.ui.violet.corner.label,
.ui.violet.corner.label:hover {
background-color: transparent !important;
}
a.ui.violet.labels .label:hover,
/* Link */
.ui.violet.labels a.label:hover,
a.ui.violet.label:hover{
background-color: @violetHover !important;
border-color: @violetHover !important;
color: @violetHoverTextColor !important;
}
/* Corner */
.ui.violet.corner.label,
.ui.violet.corner.label:hover {
background-color: transparent !important;
}
/* Ribbon */
.ui.violet.ribbon.label {
border-color: @violetRibbonShadow !important;
}
/* Basic */
.ui.basic.violet.label {
background-color: @white !important;
color: @violet !important;
border-color: @violet !important;
}
.ui.basic.orange.labels a.label:hover,
a.ui.basic.violet.label:hover {
background-color: @white !important;
color: @violetHover !important;
border-color: @violetHover !important;
}
/*--- Purple ---*/
.ui.purple.labels .label,
@ -730,22 +826,34 @@ a.ui.violet.label:hover{
border-color: @purple !important;
color: @purpleTextColor !important;
}
.ui.purple.corner.label,
.ui.purple.corner.label:hover {
background-color: transparent !important;
}
a.ui.purple.labels .label:hover,
/* Link */
.ui.purple.labels a.label:hover,
a.ui.purple.label:hover{
background-color: @purpleHover !important;
border-color: @purpleHover !important;
color: @purpleHoverTextColor !important;
}
/* Corner */
.ui.purple.corner.label,
.ui.purple.corner.label:hover {
background-color: transparent !important;
}
/* Ribbon */
.ui.purple.ribbon.label {
border-color: @purpleRibbonShadow !important;
}
/* Basic */
.ui.basic.purple.label {
background-color: @white !important;
color: @purple !important;
border-color: @purple !important;
}
.ui.basic.orange.labels a.label:hover,
a.ui.basic.purple.label:hover {
background-color: @white !important;
color: @purpleHover !important;
border-color: @purpleHover !important;
}
/*--- Pink ---*/
.ui.pink.labels .label,
@ -754,22 +862,34 @@ a.ui.purple.label:hover{
border-color: @pink !important;
color: @pinkTextColor !important;
}
.ui.pink.corner.label,
.ui.pink.corner.label:hover {
background-color: transparent !important;
}
a.ui.pink.labels .label:hover,
/* Link */
.ui.pink.labels .laabel:hover,
a.ui.pink.label:hover{
background-color: @pinkHover !important;
border-color: @pinkHover !important;
color: @pinkHoverTextColor !important;
}
/* Corner */
.ui.pink.corner.label,
.ui.pink.corner.label:hover {
background-color: transparent !important;
}
/* Ribbon */
.ui.pink.ribbon.label {
border-color: @pinkRibbonShadow !important;
}
/* Basic */
.ui.basic.pink.label {
background-color: @white !important;
color: @pink !important;
border-color: @pink !important;
}
.ui.basic.orange.labels a.label:hover,
a.ui.basic.pink.label:hover {
background-color: @white !important;
color: @pinkHover !important;
border-color: @pinkHover !important;
}
/*--- Brown ---*/
.ui.brown.labels .label,
@ -778,22 +898,34 @@ a.ui.pink.label:hover{
border-color: @brown !important;
color: @brownTextColor !important;
}
.ui.brown.corner.label,
.ui.brown.corner.label:hover {
background-color: transparent !important;
}
a.ui.brown.labels .label:hover,
/* Link */
.ui.brown.labels .alabel:hover,
a.ui.brown.label:hover{
background-color: @brownHover !important;
border-color: @brownHover !important;
color: @brownHoverTextColor !important;
}
/* Corner */
.ui.brown.corner.label,
.ui.brown.corner.label:hover {
background-color: transparent !important;
}
/* Ribbon */
.ui.brown.ribbon.label {
border-color: @brownRibbonShadow !important;
}
/* Basic */
.ui.basic.brown.label {
background-color: @white !important;
color: @brown !important;
border-color: @brown !important;
}
.ui.basic.orange.labels a.label:hover,
a.ui.basic.brown.label:hover {
background-color: @white !important;
color: @brownHover !important;
border-color: @brownHover !important;
}
/*--- Grey ---*/
.ui.grey.labels .label,
@ -802,29 +934,33 @@ a.ui.brown.label:hover{
border-color: @grey !important;
color: @greyTextColor !important;
}
.ui.labels .grey.label:before,
.ui.grey.labels .label:before,
.ui.grey.label:before {
background-color: @grey !important;
}
.ui.grey.corner.label,
.ui.grey.corner.label:hover {
background-color: transparent !important;
}
a.ui.grey.labels .label:hover,
/* Link */
.ui.grey.labels .laabel:hover,
a.ui.grey.label:hover{
background-color: @greyHover !important;
border-color: @greyHover !important;
color: @greyHoverTextColor !important;
}
.ui.labels a.grey.label:hover:before,
.ui.grey.labels a.label:hover:before,
a.ui.grey.label:hover:before {
background-color: @greyHover !important;
/* Corner */
.ui.grey.corner.label,
.ui.grey.corner.label:hover {
background-color: transparent !important;
}
/* Ribbon */
.ui.grey.ribbon.label {
border-color: @greyRibbonShadow !important;
border-color: @brownRibbonShadow !important;
}
/* Basic */
.ui.basic.grey.label {
background-color: @white !important;
color: @grey !important;
border-color: @grey !important;
}
.ui.basic.orange.labels a.label:hover,
a.ui.basic.grey.label:hover {
background-color: @white !important;
color: @greyHover !important;
border-color: @greyHover !important;
}
/*--- Black ---*/
@ -834,29 +970,33 @@ a.ui.grey.label:hover:before {
border-color: @black !important;
color: @blackTextColor !important;
}
.ui.labels .black.label:before,
.ui.black.labels .label:before,
.ui.black.label:before {
background-color: @black !important;
}
.ui.black.corner.label,
.ui.black.corner.label:hover {
background-color: transparent !important;
}
a.ui.black.labels .label:hover,
/* Link */
.ui.black.labels .alabel:hover,
a.ui.black.label:hover{
background-color: @blackHover !important;
border-color: @blackHover !important;
color: @blackHoverTextColor !important;
}
.ui.labels a.black.label:hover:before,
.ui.black.labels a.label:hover:before,
a.ui.black.label:hover:before {
background-color: @blackHover !important;
/* Corner */
.ui.black.corner.label,
.ui.black.corner.label:hover {
background-color: transparent !important;
}
/* Ribbon */
.ui.black.ribbon.label {
border-color: @greyRibbonShadow !important;
border-color: @brownRibbonShadow !important;
}
/* Basic */
.ui.basic.black.label {
background-color: @white !important;
color: @black !important;
border-color: @black !important;
}
.ui.basic.orange.labels a.label:hover,
a.ui.basic.black.label:hover {
background-color: @white !important;
color: @blackHover !important;
border-color: @blackHover !important;
}

Write Preview
Loading…
Cancel
Save