Enable flexbox grid CSS on our docs page

- Creates new flexbox grid Sass file in our docs assets
- Updates the Gruntfile to compile said new Sass file and minify the output
- Update notice on flexbox docs page for how it works
- Only enable compiled flexbox grid CSS in hosted docs site, not in dev (for easier and specific debugging of all flexbox features)

1 files changed, 2 insertions, 42 deletions

diff --git a/scss/bootstrap-grid.scss b/scss/bootstrap-grid.scss
index 5dc331eb6..40680ca96 100644
--- a/scss/bootstrap-grid.scss
+++ b/scss/bootstrap-grid.scss
@@ -8,53 +8,13 @@
 // Variables
 //
 
-
-// Grid breakpoints
-//
-// Define the minimum and maximum dimensions at which your layout will change,
-// adapting to different screen sizes, for use in media queries.
-
-$grid-breakpoints: (
-  // Extra small screen / phone
-  xs: 0,
-  // Small screen / phone
-  sm: 544px,
-  // Medium screen / tablet
-  md: 768px,
-  // Large screen / desktop
-  lg: 992px,
-  // Extra large screen / wide desktop
-  xl: 1200px
-) !default;
-
-
-// Grid containers
-//
-// Define the maximum width of `.container` for different screen sizes.
-
-$container-max-widths: (
-  sm: 576px,
-  md: 720px,
-  lg: 940px,
-  xl: 1140px
-) !default;
-
-
-// Grid columns
-//
-// Set the number of columns and specify the width of the gutters.
-
-$grid-columns:               12 !default;
-$grid-gutter-width:          1.875rem !default; // 30px
-
+@import "custom";
+@import "variables";
 
 //
 // Grid mixins
 //
 
-@import "custom";
-@import "variables";
-
 @import "mixins/clearfix";
 @import "mixins/breakpoints";
 @import "mixins/grid-framework";