Uinified the grid variables

LIN3S · Feb 15, 2017 · 6ba50fc · 6ba50fc
1 parent b870193
commit 6ba50fc
Show file tree

Hide file tree

Showing 8 changed files with 22 additions and 19 deletions.
diff --git a/README.md b/README.md
@@ -28,14 +28,24 @@ The best practice is to create a row.scss component that wraps all the grid gene
 following code:
 
 ```scss
-$grid-row-type: 'adaptive';
-$grid-row-column-count: 12;
+$grid-type: 'adaptive'; // also, it can be fluid
+
+$row-padding: 15px;
+$row-width: 1290;
+
+$column-count: 12;
+$column-gutter: 30px;
 
 $small-cols: 6;
 $medium-cols: 3, 4, 6;
 $large-cols: 1, 2, 3, 4, 6;
 $xlarge-cols: 6;
 
+$small-breakpoint: 640;
+$medium-breakpoint: 1024;
+$large-breakpoint: 1279;
+$xlarge-breakpoint: 1440;
+
 @import '../../node_modules/lin3s-css-grid/scss/row';
 ```
 

diff --git a/example/index.html b/example/index.html
@@ -2,16 +2,16 @@
 <html lang="en">
 <head>
     <meta charset="utf-8">
-    <title>untitled</title>
+    <title>LIN3S CSS Grid</title>
     <meta name="viewport" content="width=device-width, initial-scale=1.0">
     <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
 
     <link rel="stylesheet" type="text/css" href="https://raw.github.com/necolas/normalize.css/master/normalize.css"/>
     <link href="https://fonts.googleapis.com/css?family=Raleway" rel="stylesheet"/>
-    <link rel="stylesheet" type="text/css" href="/css/app.css"/>
+    <link rel="stylesheet" type="text/css" href="css/app.css"/>
 </head>
 <body>
-    <h1>LIN3S CSS Adaptive Grid</h1>
+    <h1>LIN3S CSS Grid | Adaptive example</h1>
     <div class="row">
         <div class="row__column row__column--large-1 row__column--medium-3 row__column--small-6">1</div>
         <div class="row__column row__column--large-1 row__column--medium-3 row__column--small-6">1</div>

diff --git a/example/scss/_row.scss b/example/scss/_row.scss
@@ -9,9 +9,6 @@
 // @author Beñat Espiña <[email protected]>
 // @author Mikel Tuesta <[email protected]>
 
-$grid-row-type: 'adaptive';
-$grid-row-column-count: 12;
-
 $small-cols: 6;
 $medium-cols: 3, 4, 6;
 $large-cols: 1, 2, 3, 4, 6;

diff --git a/package.json b/package.json
@@ -1,7 +1,7 @@
 {
   "name": "lin3s-css-grid",
   "description": "Simple CSS grid based on Flexbox in the LIN3S way",
-  "version": "0.2.0",
+  "version": "0.3.0",
   "license": "MIT",
   "keywords": [
     "adaptive-grid",

diff --git a/scss/_placeholders.scss b/scss/_placeholders.scss
@@ -20,7 +20,7 @@
 
 %grid__row--fluid {
   @extend %grid__row;
-  max-width: $fluid-row-width + $column-gutter;
+  max-width: $row-width + $column-gutter;
 }
 
 %grid__row--fluid-one-column {

diff --git a/scss/_row.scss b/scss/_row.scss
@@ -13,18 +13,17 @@
 @import 'mixins';
 @import 'variables';
 
-$grid-row-type: 'adaptive' !default;
-$grid-row-column-count: 12 !default;
+$grid-type: 'adaptive' !default;
 
 $small-cols: 6 !default;
 $medium-cols: 3, 4, 6 !default;
 $large-cols: 1, 2, 3, 4, 6 !default;
 $xlarge-cols: 6 !default;
 
-@include grid__row('.row', $grid-row-type);
+@include grid__row('.row', $grid-type);
 
 .row__column {
-  @include grid__column($grid-row-column-count);
+  @include grid__column($column-count);
 }
 
 .row .row {

diff --git a/scss/_variables.scss b/scss/_variables.scss
@@ -46,13 +46,13 @@ $column-count: 12 !default;
 $column-gutter: 30px !default;
 $row-padding: 15px !default;
 
-$fluid-row-width: 1290 !default;
+$row-width: 1290 !default;
 
 $adaptive-row-small-width: 666 !default;
 $adaptive-row-medium-width: 666 !default;
 $adaptive-row-large-width: 930 !default;
 $adaptive-row-xlarge-width: 1170 !default;
-$adaptive-row-xxlarge-width: $fluid-row-width;
+$adaptive-row-xxlarge-width: $row-width;
 
 $grid: (
   'adaptive': (

diff --git a/scss/dist.scss b/scss/dist.scss
@@ -9,9 +9,6 @@
 // @author Beñat Espiña <[email protected]>
 // @author Mikel Tuesta <[email protected]>
 
-$grid-row-type: 'adaptive';
-$grid-row-column-count: 12;
-
 $small-cols: 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12;
 $medium-cols: 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12;
 $large-cols: 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12;