Cut back specificity of .x-centered grid classes so they don't override .x-uncentered...

diff --git a/docs/pages/grid.md b/docs/pages/grid.md
index af4041caab04547b41aa91e6f8e3a2740150d4c8..354c0a0ea083792f654c0e427b3d50513b33e65b 100644 (file)
--- a/docs/pages/grid.md
+++ b/docs/pages/grid.md
@@ -315,7 +315,7 @@ There are times when you won't want each media query to be collapsed or uncollap
 
 ### Centered Columns
 
-Center your columns by adding a class of `.small-centered` to your column. Large will inherit small centering by default, but you can also center solely on large by applying a `.large-centered` class. To uncenter on large screens, use `.large-uncenter`.
+Center your columns by adding a class of `.small-centered` to your column. Large will inherit small centering by default, but you can also center solely on large by applying a `.large-centered` class. To uncenter on large screens, use `.large-uncentered`.
 
 ```html
 <div class="row">
@@ -325,7 +325,7 @@ Center your columns by adding a class of `.small-centered` to your column. Large
   <div class="small-6 large-centered columns">6 centered</div>
 </div>
 <div class="row">
-  <div class="small-9 small-centered large-uncenter columns">9 centered</div>
+  <div class="small-9 small-centered large-uncentered columns">9 centered</div>
 </div>
 <div class="row">
   <div class="small-11 small-centered columns">11 centered</div>
@@ -339,7 +339,7 @@ Center your columns by adding a class of `.small-centered` to your column. Large
   <div class="small-6 large-centered columns">6 centered, large</div>
 </div>
 <div class="row display">
-  <div class="small-9 small-centered large-uncenter columns">9 centered small</div>
+  <div class="small-9 small-centered large-uncentered columns">9 centered small</div>
 </div>
 <div class="row display">
   <div class="small-11 small-centered columns">11 centered</div>

diff --git a/scss/grid/_classes.scss b/scss/grid/_classes.scss
index e22c3726170ff526944e4ea6ef4dde24ca6baaa1..46a2ab5847259ddcd9846a2b2954d1afa4c8997d 100644 (file)
--- a/scss/grid/_classes.scss
+++ b/scss/grid/_classes.scss
@@ -15,7 +15,7 @@
   $push: 'push',
   $pull: 'pull',
   $center: 'centered',
-  $uncenter: 'uncenter',
+  $uncenter: 'uncentered',
   $collapse: 'collapse',
   $uncollapse: 'uncollapse',
   $offset: 'offset',
@@ -120,7 +120,7 @@
       }
 
       // Positioning
-      .#{$column}.#{$size}-#{$center} {
+      .#{$size}-#{$center} {
         @include grid-col-pos(center);
       }
 

diff --git a/scss/grid/_position.scss b/scss/grid/_position.scss
index 891eb637dd7737efc1f46c2d0459184c9988676d..da60ae697cf4150a24bf96f151ab288dd041bb35 100644 (file)
--- a/scss/grid/_position.scss
+++ b/scss/grid/_position.scss
@@ -27,7 +27,7 @@
 }
 
 /// Reset a position definition.
-@mixin grid-column-unposition() {
+@mixin grid-column-unposition {
   position: static;
   margin-left: 0;
   margin-right: 0;
@@ -40,7 +40,7 @@
 }
 
 /// Disable the default behavior of the last column in a row aligning to the opposite edge.
-@mixin grid-column-end() {
+@mixin grid-column-end {
   // This extra specificity is required for the property to be applied
   &:last-child:last-child {
     float: $global-left;
@@ -55,7 +55,7 @@
 
 /// Shorthand for `grid-column-unposition()`.
 /// @alias grid-column-unposition
-@mixin grid-col-unpos() {
+@mixin grid-col-unpos {
   @include grid-column-unposition;
 }
 
@@ -67,6 +67,6 @@
 
 /// Shorthand for `grid-column-end()`.
 /// @alias grid-column-end
-@mixin grid-col-end() {
+@mixin grid-col-end {
   @include grid-column-end;
 }