Add many new variables for label colors

src/definitions/elements/label.less

@@ -543,7 +543,7 @@ a.ui.active.label:ActiveHover:before {
 .ui.black.label {
   background-color: @black !important;
   border-color: @black !important;
-  color: @invertedTextColor !important;
+  color: @blackTextColor !important;
 }
 .ui.labels .black.label:before,
 .ui.black.labels .label:before,
@@ -573,7 +573,7 @@ a.ui.black.label:hover:before {
 .ui.blue.label {
   background-color: @blue !important;
   border-color: @blue !important;
-  color: @invertedTextColor !important;
+  color: @blueTextColor !important;
 }
 .ui.labels .blue.label:before,
 .ui.blue.labels .label:before,
@@ -585,7 +585,7 @@ a.ui.blue.labels .label:hover,
 a.ui.blue.label:hover {
   background-color: @blueHover !important;
   border-color: @blueHover !important;
-  color: @invertedTextColor !important;
+  color: @blueHoverTextColor !important;
 }
 .ui.labels a.blue.label:hover:before,
 .ui.blue.labels a.label:hover:before,
@@ -605,7 +605,7 @@ a.ui.blue.label:hover:before {
 .ui.green.label {
   background-color: @green !important;
   border-color: @green !important;
-  color: @invertedTextColor !important;
+  color: @greenTextColor !important;
 }
 .ui.labels .green.label:before,
 .ui.green.labels .label:before,
@@ -637,7 +637,7 @@ a.ui.green.label:hover:before {
 .ui.orange.label {
   background-color: @orange !important;
   border-color: @orange !important;
-  color: @invertedTextColor !important;
+  color: @orangeTextColor !important;
 }
 .ui.labels .orange.label:before,
 .ui.orange.labels .label:before,
@@ -649,7 +649,7 @@ a.ui.orange.labels .label:hover,
 a.ui.orange.label:hover {
   background-color: @orangeHover !important;
   border-color: @orangeHover !important;
-  color: @invertedTextColor !important;
+  color: @orangeHoverTextColor !important;
 }
 .ui.labels a.orange.label:hover:before,
 .ui.orange.labels a.label:hover:before,
@@ -669,7 +669,7 @@ a.ui.orange.label:hover:before {
 .ui.pink.label {
   background-color: @pink !important;
   border-color: @pink !important;
-  color: @invertedTextColor !important;
+  color: @pinkTextColor !important;
 }
 .ui.labels .pink.label:before,
 .ui.pink.labels .label:before,
@@ -681,7 +681,7 @@ a.ui.pink.labels .label:hover,
 a.ui.pink.label:hover {
   background-color: @pinkHover !important;
   border-color: @pinkHover !important;
-  color: @invertedTextColor !important;
+  color: @pinkHoverTextColor !important;
 }
 .ui.labels a.pink.label:hover:before,
 .ui.pink.labels a.label:hover:before,
@@ -701,7 +701,7 @@ a.ui.pink.label:hover:before {
 .ui.purple.label {
   background-color: @purple !important;
   border-color: @purple !important;
-  color: @invertedTextColor !important;
+  color: @purpleTextColor !important;
 }
 .ui.labels .purple.label:before,
 .ui.purple.labels .label:before,
@@ -713,7 +713,7 @@ a.ui.purple.labels .label:hover,
 a.ui.purple.label:hover {
   background-color: @purpleHover !important;
   border-color: @purpleHover !important;
-  color: @invertedTextColor !important;
+  color: @purpleHoverTextColor !important;
 }
 .ui.labels a.purple.label:hover:before,
 .ui.purple.labels a.label:hover:before,
@@ -733,7 +733,7 @@ a.ui.purple.label:hover:before {
 .ui.red.label {
   background-color: @red !important;
   border-color: @red !important;
-  color: @invertedTextColor !important;
+  color: @redTextColor !important;
 }
 .ui.labels .red.label:before,
 .ui.red.labels .label:before,
@@ -749,7 +749,7 @@ a.ui.red.labels .label:hover,
 a.ui.red.label:hover{
   background-color: @redHover !important;
   border-color: @redHover !important;
-  color: @invertedTextColor !important;
+  color: @redHoverTextColor !important;
 }
 .ui.labels a.red.label:hover:before,
 .ui.red.labels a.label:hover:before,
@@ -765,7 +765,7 @@ a.ui.red.label:hover:before {
 .ui.teal.label {
   background-color: @teal !important;
   border-color: @teal !important;
-  color: @invertedTextColor !important;
+  color: @tealTextColor !important;
 }
 .ui.labels .teal.label:before,
 .ui.teal.labels .label:before,
@@ -777,7 +777,7 @@ a.ui.teal.labels .label:hover,
 a.ui.teal.label:hover {
   background-color: @tealHover !important;
   border-color: @tealHover !important;
-  color: @invertedTextColor !important;
+  color: @tealHoverTextColor !important;
 }
 .ui.labels a.teal.label:hover:before,
 .ui.teal.labels a.label:hover:before,
@@ -797,7 +797,7 @@ a.ui.teal.label:hover:before {
 .ui.yellow.label {
   background-color: @yellow !important;
   border-color: @yellow !important;
-  color: @invertedTextColor !important;
+  color: @yellowTextColor !important;
 }
 .ui.labels .yellow.label:before,
 .ui.yellow.labels .label:before,
@@ -809,7 +809,7 @@ a.ui.yellow.labels .label:hover,
 a.ui.yellow.label:hover {
   background-color: @yellowHover !important;
   border-color: @yellowHover !important;
-  color: @invertedTextColor !important;
+  color: @yellowHoverTextColor !important;
 }
 .ui.labels a.yellow.label:hover:before,
 .ui.yellow.labels a.label:hover:before,

src/themes/default/elements/label.variables

@@ -120,6 +120,27 @@
 @ribbonImageDistance: ~"calc("@ribbonImageMargin~" + "@ribbonTriangleSize~")";
 @rightRibbonImageOffset:  ~"calc(100% + "@ribbonImageMargin~" + "@ribbonTriangleSize~")";
 
+/* Colors */
+@blackTextColor: @white;
+@blueTextColor: @white;
+@greenTextColor: @white;
+@orangeTextColor: @white;
+@pinkTextColor: @white;
+@purpleTextColor: @white;
+@redTextColor: @white;
+@tealTextColor: @white;
+@yellowTextColor: @white;
+
+@blackHoverTextColor: @white;
+@blueHoverTextColor: @white;
+@greenHoverTextColor: @white;
+@orangeHoverTextColor: @white;
+@pinkHoverTextColor: @white;
+@purpleHoverTextColor: @white;
+@redHoverTextColor: @white;
+@tealHoverTextColor: @white;
+@yellowHoverTextColor: @white;
+
 @blackRibbonShadow: darken(@black, 10);
 @blueRibbonShadow: darken(@blue, 10);
 @greenRibbonShadow: darken(@green, 10);