Updating docs, uncompiled

diff --git a/doc/includes/grid/examples_grid_row_collapse.html b/doc/includes/grid/examples_grid_row_collapse.html
new file mode 100644 (file)
index 0000000..9cd188f
--- /dev/null
+++ b/doc/includes/grid/examples_grid_row_collapse.html
@@ -0,0 +1,12 @@
+{{#markdown}}
+```html
+<div class="row small-collapse medium-uncollapse">
+       <div class="small-12 meidum-6 columns">
+               Adds gutter at medium media query
+       </div>
+       <div class="small-12 meidum-6 columns">
+               Adds gutter at medium media query
+       </div>
+</div>
+```
+{{/markdown}}

diff --git a/doc/includes/grid/examples_grid_row_collapse_rendered.html b/doc/includes/grid/examples_grid_row_collapse_rendered.html
new file mode 100644 (file)
index 0000000..aad84f7
--- /dev/null
+++ b/doc/includes/grid/examples_grid_row_collapse_rendered.html
@@ -0,0 +1,8 @@
+<div class="row small-collapse medium-uncollapse">
+       <div class="small-12 meidum-6 columns">
+               Adds gutter at medium media query
+       </div>
+       <div class="small-12 meidum-6 columns">
+               Adds gutter at medium media query
+       </div>
+</div>
\ No newline at end of file

diff --git a/doc/pages/components/grid.html b/doc/pages/components/grid.html
index e6224d21ff237280f49ce9cd751a163a2b21de2f..ba5ee304adc4961ddb5b8bb4912603ce78a3c7fb 100644 (file)
--- a/doc/pages/components/grid.html
+++ b/doc/pages/components/grid.html
@@ -89,6 +89,20 @@ In order to work around browsers' different rounding behaviors, Foundation will
 
 ***
 
+### Collapse/Uncollapse Rows
+
+There are times when you won't want each media query to be collapsed or uncollapsed. In this case, use the media query size you want and collapse or uncollapse and add that to your `row` element. Example shows no gutter at small media size and then adds the gutter to columns at medium.
+
+<h4>HTML</h4>
+
+{{> examples_grid_row_collapse}}
+
+<h4>Rendered HTML</h4>
+
+{{> examples_grid_row_collapse_rendered}}
+
+***
+
 ### 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-uncentered`.