From a750de4c5ab8c8ce17ecd921b2bbcdcc7479f4f1 Mon Sep 17 00:00:00 2001
From: Adam Wathan <adam.wathan@gmail.com>
Date: Thu, 3 Aug 2017 21:37:12 -0400
Subject: [PATCH] Define all text colors at once to prevent responsive order
 bugs

---
 docs/source/_assets/less/main.less | 22 +++++++++++++++++-----
 src/generators/text-colors.less    | 14 +++++++-------
 src/utilities/text.less            | 23 +++++++++++------------
 3 files changed, 35 insertions(+), 24 deletions(-)

diff --git a/docs/source/_assets/less/main.less b/docs/source/_assets/less/main.less
index 4f21926f3..dd00eaaea 100644
--- a/docs/source/_assets/less/main.less
+++ b/docs/source/_assets/less/main.less
@@ -19,11 +19,23 @@ a {
   }
 }
 
-.define-text-color('primary';
-  default #3498DB,
-  'light' lighten(#3498DB, 25%),
-  'dark' #2980B9
-;);
+
+@text-colors:
+  'light' @text-light,
+  'light-soft' @text-light-soft,
+  'light-softer' @text-light-softer,
+  'light-softest' @text-light-softest,
+
+  'dark' @text-dark,
+  'dark-soft' @text-dark-soft,
+  'dark-softer' @text-dark-softer,
+  'dark-softest' @text-dark-softest,
+
+  'primary' #3498DB,
+  'primary-light' lighten(#3498DB, 25%),
+  'primary-dark' #2980B9,
+;
+
 
 @bg-colors:
   'light' hsl(0, 0%, 100%),
diff --git a/src/generators/text-colors.less b/src/generators/text-colors.less
index 41cae466f..764f6ade7 100644
--- a/src/generators/text-colors.less
+++ b/src/generators/text-colors.less
@@ -1,16 +1,16 @@
-.define-text-color(@color-name; @variants) {
-  .generate-utility-variants(~"text-@{color-name}"; @variants; {
+.define-text-colors(@variants) {
+  .generate-utility-variants('text'; @variants; {
     color: extract(@__variant-value, 2);
   });
 }
 
-.define-text-color(@color-name; @variants; none) {
-  .define-text-color(@color-name; @variants);
+.define-text-colors(@variants; none) {
+  .define-text-colors(@variants);
 }
 
-.define-text-color(@color-name; @variants; @screens) when not (@screens = none) {
-  .define-text-color(@color-name; @variants);
-  .generate-responsive-utility-variants(~"text-@{color-name}"; @variants; @screens; {
+.define-text-colors(@variants; @screens) when not (@screens = none) {
+  .define-text-colors(@variants);
+  .generate-responsive-utility-variants('text'; @variants; @screens; {
     color: extract(@__variant-value, 2);
   });
 }
diff --git a/src/utilities/text.less b/src/utilities/text.less
index 60923b200..654f44a33 100644
--- a/src/utilities/text.less
+++ b/src/utilities/text.less
@@ -63,19 +63,18 @@
 ; @screens);
 
 // Colors
-.define-text-color(light;
-  default @text-light,
-  'soft' @text-light-soft,
-  'softer' @text-light-softer,
-  'softest' @text-light-softest
-; @screens);
+@text-colors:
+  'light' @text-light,
+  'light-soft' @text-light-soft,
+  'light-softer' @text-light-softer,
+  'light-softest' @text-light-softest,
 
-.define-text-color(dark;
-  default @text-dark,
-  'soft' @text-dark-soft,
-  'softer' @text-dark-softer,
-  'softest' @text-dark-softest
-; @screens);
+  'dark' @text-dark,
+  'dark-soft' @text-dark-soft,
+  'dark-softer' @text-dark-softer,
+  'dark-softest' @text-dark-softest,
+;
+.define-text-colors(@text-colors; @screens);
 
 // Line heights
 .leading-none { line-height: 1; }