Remove duplicate text alignment classes

The text alignment loop is all that’s needed to generate text alignment
classes. This removes the previous explicit classes, and places the
loop include where the classes were.

diff --git a/scss/foundation/components/_type.scss b/scss/foundation/components/_type.scss
index c272c68bab2b850207771af2bc655c78cc3ea3d6..601db28fc8dd0db59ff0b0feb65844910f2798b1 100755 (executable)
--- a/scss/foundation/components/_type.scss
+++ b/scss/foundation/components/_type.scss
@@ -142,7 +142,6 @@ $text-breakpoint-up-queries:
       text-align: #{$alignment} !important;
     }
   }
-  
   @each $current-text-breakpoint in $text-breakpoint-sizes {
     @media #{nth($text-breakpoint-only-queries, index($text-breakpoint-sizes, $current-text-breakpoint))} {
       @each $alignment in $text-alignments {
@@ -161,7 +160,6 @@ $text-breakpoint-up-queries:
   }
 }
 
-@include text-alignment-loop;
 
 //
 // Typography Placeholders
@@ -183,81 +181,7 @@ $text-breakpoint-up-queries:
 @include exports("type") {
   @if $include-html-type-classes {
 
-    // Global Text Styles
-    .text-left    { text-align: left !important; }
-    .text-right   { text-align: right !important; }
-    .text-center  { text-align: center !important; }
-    .text-justify { text-align: justify !important; }
-
-    @media #{$small-only} {
-        .small-only-text-left    { text-align: left !important; }
-        .small-only-text-right   { text-align: right !important; }
-        .small-only-text-center  { text-align: center !important; }
-        .small-only-text-justify { text-align: justify !important; }
-    }
-
-    @media #{$small-up} {
-        .small-text-left    { text-align: left !important; }
-        .small-text-right   { text-align: right !important; }
-        .small-text-center  { text-align: center !important; }
-        .small-text-justify { text-align: justify !important; }
-    }
-
-    @media #{$medium-only} {
-        .medium-only-text-left    { text-align: left !important; }
-        .medium-only-text-right   { text-align: right !important; }
-        .medium-only-text-center  { text-align: center !important; }
-        .medium-only-text-justify { text-align: justify !important; }
-    }
-
-    @media #{$medium-up} {
-        .medium-text-left    { text-align: left !important; }
-        .medium-text-right   { text-align: right !important; }
-        .medium-text-center  { text-align: center !important; }
-        .medium-text-justify { text-align: justify !important; }
-    }
-
-    @media #{$large-only} {
-        .large-only-text-left    { text-align: left !important; }
-        .large-only-text-right   { text-align: right !important; }
-        .large-only-text-center  { text-align: center !important; }
-        .large-only-text-justify { text-align: justify !important; }
-    }
-
-    @media #{$large-up} {
-        .large-text-left    { text-align: left !important; }
-        .large-text-right   { text-align: right !important; }
-        .large-text-center  { text-align: center !important; }
-        .large-text-justify { text-align: justify !important; }
-    }
-
-    @media #{$xlarge-only} {
-        .xlarge-only-text-left    { text-align: left !important; }
-        .xlarge-only-text-right   { text-align: right !important; }
-        .xlarge-only-text-center  { text-align: center !important; }
-        .xlarge-only-text-justify { text-align: justify !important; }
-    }
-
-    @media #{$xlarge-up} {
-        .xlarge-text-left    { text-align: left !important; }
-        .xlarge-text-right   { text-align: right !important; }
-        .xlarge-text-center  { text-align: center !important; }
-        .xlarge-text-justify { text-align: justify !important; }
-    }
-
-    @media #{$xxlarge-only} {
-        .xxlarge-only-text-left    { text-align: left !important; }
-        .xxlarge-only-text-right   { text-align: right !important; }
-        .xxlarge-only-text-center  { text-align: center !important; }
-        .xxlarge-only-text-justify { text-align: justify !important; }
-    }
-
-    @media #{$xxlarge-up} {
-        .xxlarge-text-left    { text-align: left !important; }
-        .xxlarge-text-right   { text-align: right !important; }
-        .xxlarge-text-center  { text-align: center !important; }
-        .xxlarge-text-justify { text-align: justify !important; }
-    }
+    @include text-alignment-loop;
 
     /* Typography resets */
     div,