From 8eb3a6bbd1498ef0ecf1f18049d587a587813446 Mon Sep 17 00:00:00 2001
From: jlukic <jacklukic@gmail.com>
Date: Fri, 22 May 2015 17:51:14 -0400
Subject: [PATCH] #2280 Fix segment colors

---
 src/definitions/elements/segment.less         | 143 +++++++++---------
 src/themes/default/elements/segment.variables |   1 -
 2 files changed, 72 insertions(+), 72 deletions(-)

diff --git a/src/definitions/elements/segment.less b/src/definitions/elements/segment.less
index a62e57b59..542ffe4a0 100755
--- a/src/definitions/elements/segment.less
+++ b/src/definitions/elements/segment.less
@@ -352,110 +352,111 @@
        Colors
 --------------------*/
 
-.ui.black.segment:not(.inverted) {
-  border-top: @coloredBorderSize solid @black;
-}
-.ui.blue.segment:not(.inverted) {
-  border-top: @coloredBorderSize solid @blue;
+/* Red */
+.ui.red.segment:not(.inverted) {
+  border-top: @coloredBorderSize solid @red;
 }
-.ui.green.segment:not(.inverted) {
-  border-top: @coloredBorderSize solid @green;
+.ui.inverted.red.segment {
+  background-color: @red !important;
+  color: @white !important;
 }
+
+/* Orange */
 .ui.orange.segment:not(.inverted) {
   border-top: @coloredBorderSize solid @orange;
 }
-.ui.pink.segment:not(.inverted) {
-  border-top: @coloredBorderSize solid @pink;
-}
-.ui.purple.segment:not(.inverted) {
-  border-top: @coloredBorderSize solid @purple;
-}
-.ui.red.segment:not(.inverted) {
-  border-top: @coloredBorderSize solid @red;
-}
-.ui.teal.segment:not(.inverted) {
-  border-top: @coloredBorderSize solid @teal;
+.ui.inverted.orange.segment {
+  background-color: @orange !important;
+  color: @white !important;
 }
+
+/* Yellow */
 .ui.yellow.segment:not(.inverted) {
   border-top: @coloredBorderSize solid @yellow;
 }
-
-.ui.black.segment:not(.inverted):not(.attached) {
-  border-top-left-radius: @coloredBorderRadius !important;
-  border-top-right-radius: @coloredBorderRadius !important;
-}
-.ui.blue.segment:not(.inverted):not(.attached) {
-  border-top-left-radius: @coloredBorderRadius !important;
-  border-top-right-radius: @coloredBorderRadius !important;
-}
-.ui.green.segment:not(.inverted):not(.attached) {
-  border-top-left-radius: @coloredBorderRadius !important;
-  border-top-right-radius: @coloredBorderRadius !important;
-}
-.ui.orange.segment:not(.inverted):not(.attached) {
-  border-top-left-radius: @coloredBorderRadius !important;
-  border-top-right-radius: @coloredBorderRadius !important;
-}
-.ui.pink.segment:not(.inverted):not(.attached) {
-  border-top-left-radius: @coloredBorderRadius !important;
-  border-top-right-radius: @coloredBorderRadius !important;
+.ui.inverted.yellow.segment {
+  background-color: @yellow !important;
+  color: @white !important;
 }
-.ui.purple.segment:not(.inverted):not(.attached) {
-  border-top-left-radius: @coloredBorderRadius !important;
-  border-top-right-radius: @coloredBorderRadius !important;
+
+/* Green */
+.ui.green.segment:not(.inverted) {
+  border-top: @coloredBorderSize solid @green;
 }
-.ui.red.segment:not(.inverted):not(.attached) {
-  border-top-left-radius: @coloredBorderRadius !important;
-  border-top-right-radius: @coloredBorderRadius !important;
+.ui.inverted.green.segment {
+  background-color: @green !important;
+  color: @white !important;
 }
-.ui.teal.segment:not(.inverted):not(.attached) {
-  border-top-left-radius: @coloredBorderRadius !important;
-  border-top-right-radius: @coloredBorderRadius !important;
+
+/* Teal */
+.ui.teal.segment:not(.inverted) {
+  border-top: @coloredBorderSize solid @teal;
 }
-.ui.yellow.segment:not(.inverted):not(.attached) {
-  border-top-left-radius: @coloredBorderRadius !important;
-  border-top-right-radius: @coloredBorderRadius !important;
+.ui.inverted.teal.segment {
+  background-color: @teal !important;
+  color: @white !important;
 }
 
-/*-------------------
-   Inverted Colors
---------------------*/
-
-.ui.inverted.segment,
-.ui.inverted.black.segment {
-  background-color: @black !important;
-  color: @white !important;
+/* Blue */
+.ui.blue.segment:not(.inverted) {
+  border-top: @coloredBorderSize solid @blue;
 }
 .ui.inverted.blue.segment {
   background-color: @blue !important;
   color: @white !important;
 }
-.ui.inverted.green.segment {
-  background-color: @green !important;
+
+/* Violet */
+.ui.violet.segment:not(.inverted) {
+  border-top: @coloredBorderSize solid @violet;
+}
+.ui.inverted.violet.segment {
+  background-color: @violet !important;
   color: @white !important;
 }
-.ui.inverted.orange.segment {
-  background-color: @orange !important;
+
+/* Purple */
+.ui.purple.segment:not(.inverted) {
+  border-top: @coloredBorderSize solid @purple;
+}
+.ui.inverted.purple.segment {
+  background-color: @purple !important;
   color: @white !important;
 }
+
+/* Pink */
+.ui.pink.segment:not(.inverted) {
+  border-top: @coloredBorderSize solid @pink;
+}
 .ui.inverted.pink.segment {
   background-color: @pink !important;
   color: @white !important;
 }
-.ui.inverted.purple.segment {
-  background-color: @purple !important;
-  color: @white !important;
+
+/* Brown */
+.ui.brown.segment:not(.inverted) {
+  border-top: @coloredBorderSize solid @brown;
 }
-.ui.inverted.red.segment {
-  background-color: @red !important;
+.ui.inverted.brown.segment {
+  background-color: @brown !important;
   color: @white !important;
 }
-.ui.inverted.teal.segment {
-  background-color: @teal !important;
+
+/* Grey */
+.ui.grey.segment:not(.inverted) {
+  border-top: @coloredBorderSize solid @grey;
+}
+.ui.inverted.grey.segment {
+  background-color: @grey !important;
   color: @white !important;
 }
-.ui.inverted.yellow.segment {
-  background-color: @yellow !important;
+
+/* Black */
+.ui.black.segment:not(.inverted) {
+  border-top: @coloredBorderSize solid @black;
+}
+.ui.inverted.black.segment {
+  background-color: @black !important;
   color: @white !important;
 }
 
diff --git a/src/themes/default/elements/segment.variables b/src/themes/default/elements/segment.variables
index 829ad2e5f..6454edd1b 100644
--- a/src/themes/default/elements/segment.variables
+++ b/src/themes/default/elements/segment.variables
@@ -87,7 +87,6 @@
 
 /* Colors */
 @coloredBorderSize: 2px;
-@coloredBorderRadius: @borderRadius;
 
 /* Ordinality */
 @secondaryBackground: #FAF9FA;