]> git.ipfire.org Git - thirdparty/foundation/foundation-sites.git/commitdiff
change block grid class 9365/head
authorandycochran <andrewthomascochran@gmail.com>
Wed, 30 Nov 2016 02:14:16 +0000 (21:14 -0500)
committerandycochran <andrewthomascochran@gmail.com>
Wed, 30 Nov 2016 02:14:16 +0000 (21:14 -0500)
docs/pages/grid.md
scss/grid/_classes.scss

index e882f01e813d5afed95f3565e277fd7a9c18ae81..301f8f4a9b2d93880c788ba752daea073a94f0ae 100644 (file)
@@ -433,26 +433,26 @@ Using these source ordering classes, you can shift columns around between our br
 
 ### Block Grids
 
-Block grids are a shorthand way to create equally-sized columns. Add a class of the format `.[size]-up-[n]` to change the number of columns within the row. By default, the max number of columns you can use with block grid are 8. Adding the `.block-grid-column` class to columns will apply a bottom margin equal to the width of gutters.
+Block grids are a shorthand way to create equally-sized columns. Add a class of the format `.[size]-up-[n]` to change the number of columns within the row. By default, the max number of columns you can use with block grid are 8. Adding the `.column-block` class to columns will apply a bottom margin equal to the width of gutters.
 
 ```html_example
 <div class="row small-up-2 medium-up-3 large-up-4">
-  <div class="column block-grid-column">
+  <div class="column column-block">
     <img src="//placehold.it/600x600" class="thumbnail" alt="">
   </div>
-  <div class="column block-grid-column">
+  <div class="column column-block">
     <img src="//placehold.it/600x600" class="thumbnail" alt="">
   </div>
-  <div class="column block-grid-column">
+  <div class="column column-block">
     <img src="//placehold.it/600x600" class="thumbnail" alt="">
   </div>
-  <div class="column block-grid-column">
+  <div class="column column-block">
     <img src="//placehold.it/600x600" class="thumbnail" alt="">
   </div>
-  <div class="column block-grid-column">
+  <div class="column column-block">
     <img src="//placehold.it/600x600" class="thumbnail" alt="">
   </div>
-  <div class="column block-grid-column">
+  <div class="column column-block">
     <img src="//placehold.it/600x600" class="thumbnail" alt="">
   </div>
 </div>
index a1bb3e0488327d83a81913075cded9e542067fe0..55cda3e865f15871b18d76442bfd0093148d7193 100644 (file)
@@ -22,7 +22,7 @@
   $offset: 'offset',
   $end: 'end',
   $expanded: 'expanded',
-  $block-grid: 'block-grid'
+  $block: 'block'
 ) {
   // Row
   .#{$row} {
   }
 
   // Block grid columns
-  .#{$block-grid}-#{$column} {
-    @include block-grid-column;
+  .#{$column}-#{$block} {
+    @include grid-column-margin;
   }
 
   @if $column == 'column' {