From 97e01b6bcdc4beb6f70a8d5578e4ea0dec3fbd37 Mon Sep 17 00:00:00 2001 From: John Otander Date: Tue, 6 Jan 2015 10:40:12 -0700 Subject: [PATCH 1/7] Remove gh-pages css --- index.furtive.min.css | 1 - 1 file changed, 1 deletion(-) delete mode 100644 index.furtive.min.css diff --git a/index.furtive.min.css b/index.furtive.min.css deleted file mode 100644 index 8676f21..0000000 --- a/index.furtive.min.css +++ /dev/null @@ -1 +0,0 @@ -/*! normalize.css v3.0.1 | MIT License | git.io/normalize */html{font-family:sans-serif;-ms-text-size-adjust:100%;-webkit-text-size-adjust:100%}body{margin:0}footer,section{display:block}a{background:0 0}a:active,a:hover{outline:0}img{border:0}code{font-size:1em}input,textarea{color:inherit;font:inherit;margin:0}input[type=submit]{-webkit-appearance:button;cursor:pointer}button::-moz-focus-inner,input::-moz-focus-inner{border:0;padding:0}input{line-height:normal}textarea{overflow:auto}table{border-collapse:collapse;border-spacing:0}td,th{padding:0}.grd{padding-left:1rem;padding-right:1rem}.grd .row{max-width:100%;box-sizing:border-box;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-box-orient:horizontal;-webkit-box-direction:normal;-webkit-flex-direction:row;-ms-flex-direction:row;flex-direction:row;-webkit-flex-wrap:wrap;-ms-flex-wrap:wrap;flex-wrap:wrap}.grd .col-1,.grd .col-2,.grd .col-3,.grd .col-4,.grd .col-5,.grd .col-6{box-sizing:border-box;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-box-flex:1;-webkit-flex:1;-ms-flex:1;flex:1;-webkit-box-orient:vertical;-webkit-box-direction:normal;-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column;padding-left:.25rem;padding-right:.25rem}.grd .col-1{max-width:14.28571%;-webkit-flex-basis:14.28571%;-ms-flex-preferred-size:14.28571%;flex-basis:14.28571%}.grd .col-2{max-width:28.57142%;-webkit-flex-basis:28.57142%;-ms-flex-preferred-size:28.57142%;flex-basis:28.57142%}.grd .col-3{max-width:42.85714%;-webkit-flex-basis:42.85714%;-ms-flex-preferred-size:42.85714%;flex-basis:42.85714%}.grd .col-4{max-width:57.14285%;-webkit-flex-basis:57.14285%;-ms-flex-preferred-size:57.14285%;flex-basis:57.14285%}.grd .col-5{max-width:71.4285%;-webkit-flex-basis:71.4285%;-ms-flex-preferred-size:71.4285%;flex-basis:71.4285%}.grd .col-6{max-width:85.7142%;-webkit-flex-basis:85.7142%;-ms-flex-preferred-size:85.7142%;flex-basis:85.7142%}*,:after,:before{box-sizing:border-box}.measure{max-width:48rem;margin:0 auto}a{color:#3498db}a:active,a:focus,a:hover{color:#217dbb}.bg--red{background-color:#e74c3c}.bg--orange{background-color:#f39c12}.bg--blue{background-color:#3498db}.bg--green{background-color:#25ba84}.bg--white{background-color:#fff}.bg--light-gray{background-color:rgba(216,216,216,.99)}.bg--mid-gray{background-color:rgba(144,144,144,.99)}.bg--dark-gray{background-color:rgba(72,72,72,.99)}.bg--off-white{background-color:rgba(250,250,250,.99)}.fnt--red{color:#e74c3c}.fnt--orange{color:#f39c12}.fnt--blue{color:#3498db}.fnt--green{color:#25ba84}.fnt--white{color:#fff}.fnt--light-gray{color:rgba(216,216,216,.99)}.fnt--mid-gray{color:rgba(144,144,144,.99)}.fnt--dark-gray{color:rgba(72,72,72,.99)}.fnt--off-white{color:rgba(250,250,250,.99)}.m0{margin:0}.m1{margin:1rem}.mx1{margin-left:1rem;margin-right:1rem}.my1{margin-top:1rem;margin-bottom:1rem}.m2{margin:2rem}.mx2{margin-left:2rem;margin-right:2rem}.my2{margin-top:2rem;margin-bottom:2rem}.p0{padding:0}.p1{padding:1rem}.px1{padding-left:1rem;padding-right:1rem}.py1{padding-top:1rem;padding-bottom:1rem}.p2{padding:2rem}.px2{padding-left:2rem;padding-right:2rem}.py2{padding-top:2rem;padding-bottom:2rem}html{font-size:12px}@media screen and (min-width:32rem) and (max-width:48rem){html{font-size:15px}}@media screen and (min-width:48rem){html{font-size:16px}}body{font-family:HelveticaNeue-Light,"Helvetica Neue Light","Helvetica Neue",Helvetica,Arial,sans-serif;font-weight:400;line-height:1.85;color:#333}p{font-size:1rem;margin-bottom:1.3rem}.h1,.h2,.h3,.h4,h1,h2,h3,h4{margin:1.414rem 0 .5rem;font-weight:inherit;line-height:1.42}.h1,h1{margin-top:0;font-size:3.998rem}.h2,h2{font-size:2.827rem}.h3,h3{font-size:1.999rem}.h4,h4{font-size:1.414rem}.h5,table th{font-size:1.121rem}.h6,h6{font-size:.88rem}.btn--s,.small,small{font-size:.707em}code{font-family:Monaco,"Lucida Console",Courier,monospace}.italic{font-style:italic}.thin{font-weight:100}.bold{font-weight:700}.caps,table th{font-variant:small-caps}.muted{opacity:.7}.txt--center{text-align:center}.txt--right{text-align:right}.txt--left,table th{text-align:left}.oflow-y--scroll{overflow-y:scroll}.w100--s{width:100%;display:block}@media screen and (min-width:32rem){.w100--s{width:auto;display:inline-block}}img,textarea{max-width:100%}.btn,.btn--blue,.btn--gray,.btn--green,.btn--link{border-radius:3px}.brdr--light-gray{border:thin solid rgba(216,216,216,.99)}.brdr--mid-gray{border:thin solid rgba(144,144,144,.99)}.brdr--dark-gray{border:thin solid rgba(72,72,72,.99)}.brdr--off-white{border:thin solid rgba(250,250,250,.99)}.btn,.btn--blue,.btn--gray,.btn--green,.btn--link{padding:.5rem 1rem;border:2px solid #ccc;color:#333;text-decoration:none;text-align:center}.btn:active,.btn:focus,.btn:hover{background-color:rgba(0,0,0,.05);color:#000}.btn--link{border-color:transparent;color:#3498db}.btn--link:hover{background-color:transparent;color:#1d6fa5}.btn--blue{border-color:#2792d9;background-color:#3498db;color:#fff}.btn--blue:active,.btn--blue:focus,.btn--blue:hover{color:#fff;background-color:#217dbb}.btn--green{border-color:#22a977;background-color:#25ba84;color:#fff}.btn--green:active,.btn--green:focus,.btn--green:hover{color:#fff;background-color:#1d8f65}.btn--gray{border-color:rgba(59,59,59,.99);background-color:rgba(72,72,72,.99);color:#fff}.btn--gray:active,.btn--gray:focus,.btn--gray:hover{color:#fff;background-color:rgba(46,46,46,.99)}.btn--s{padding:.5rem}.list--unstyled{list-style-type:none}input,textarea{padding:.5rem;margin-bottom:.5rem;display:block;width:100%;box-shadow:none;border:thin solid rgba(216,216,216,.99)}input[type=submit]{margin-top:.85rem}.media{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-box-align:start;-webkit-align-items:flex-start;-ms-flex-align:start;align-items:flex-start}.media .media-figure{margin-right:1em}.media .media-body{-webkit-box-flex:1;-webkit-flex:1 0 0;-ms-flex:1 0 0;flex:1 0 0}table>thead{border-bottom:thin solid rgba(250,250,250,.99)}table td,table th{padding:.25rem;word-wrap:none;line-height:1} \ No newline at end of file From 139de11e31028dfb9b7fea87dec803523885c9ce Mon Sep 17 00:00:00 2001 From: John Otander Date: Tue, 6 Jan 2015 10:57:15 -0700 Subject: [PATCH 2/7] Add gulp task for rework-flex-grid --- gulpfile.js | 22 ++++++++++++++++++++++ package.json | 6 +++++- 2 files changed, 27 insertions(+), 1 deletion(-) diff --git a/gulpfile.js b/gulpfile.js index 20722b7..bec6741 100644 --- a/gulpfile.js +++ b/gulpfile.js @@ -7,6 +7,10 @@ var size = require('gulp-size'); var uncss = require('gulp-uncss'); var header = require('gulp-header'); var gutil = require('gulp-util'); +var rework = require('gulp-rework'); +var grid = require('rework-flex-grid'); +var replace = require('gulp-replace'); +var clean = require('gulp-clean'); var a11y = require('a11y'); var pkg = require('./package.json'); @@ -32,6 +36,24 @@ gulp.task('scss', function() { .pipe(gulp.dest('css')); }); +gulp.task('rework-grid', function() { + return gulp.src('scss/_grid.scss') + .pipe(replace(/\.*/, '')) + .pipe(clean()) + .pipe(rework( + grid({ + numColumns: 6, + classNames: { + grid: 'grd', + row: 'row', + col: 'col' + } + }) + )) + .pipe(gulp.dest('scss')); + +}); + gulp.task('uncss', function() { return gulp.src('css/furtive.min.css') .pipe(size({ gzip: true, showFiles: true })) diff --git a/package.json b/package.json index a375580..0853172 100644 --- a/package.json +++ b/package.json @@ -27,13 +27,17 @@ "gray": "0.0.4", "gulp": "^3.8.8", "gulp-autoprefixer": "^1.0.1", + "gulp-clean": "^0.3.1", "gulp-header": "^1.2.2", "gulp-minify-css": "^0.3.10", "gulp-rename": "^1.2.0", + "gulp-replace": "^0.5.0", + "gulp-rework": "^1.0.2", "gulp-sass": "^0.7.3", "gulp-size": "^1.1.0", "gulp-uncss": "^0.5.1", "gulp-util": "^3.0.1", - "normalize.css": "^3.0.1" + "normalize.css": "^3.0.1", + "rework-flex-grid": "0.0.1" } } From a7b99d42c6e32725bcac658dd9930543ae2034ab Mon Sep 17 00:00:00 2001 From: John Otander Date: Tue, 6 Jan 2015 10:57:40 -0700 Subject: [PATCH 3/7] Add latest grid --- scss/_grid.scss | 182 ++++++++++++++++++++++++++++++++---------------- 1 file changed, 121 insertions(+), 61 deletions(-) diff --git a/scss/_grid.scss b/scss/_grid.scss index 46c436f..ed90836 100644 --- a/scss/_grid.scss +++ b/scss/_grid.scss @@ -1,89 +1,149 @@ -// From: https://github.com/johnotander/flexbox.git - .grd { padding-left: 1rem; padding-right: 1rem; } -.grd .row { - max-width: 100%; +.grd-row { box-sizing: border-box; display: flex; flex-direction: row; flex-wrap: wrap; + max-width: 100%; } -.grd .col, -.grd .col-1, -.grd .col-2, -.grd .col-3, -.grd .col-4, -.grd .col-5, -.grd .col-6, -.grd .col-7 { - box-sizing: border-box; - display: flex; - flex: 1; - flex-direction: column; - padding-left: .25rem; - padding-right: .25rem; -} - -.grd .col-1 { - max-width: 14.28571%; - flex-basis: 14.28571%; -} - -.grd .col--offset-1 { - margin-left: 14.28571%; -} - -.grd .col-2 { - max-width: 28.57142%; - flex-basis: 28.57142%; -} - -.grd .col--offset-2 { - margin-left: 28.57142%; -} - -.grd .col-3 { - max-width: 42.85714%; - flex-basis: 42.85714%; -} - -.grd .col--offset-3 { - margin-left: 42.85714%; +.grd-row-col-1-6 { + max-width: 16.6666666667%; + flex-basis: 16.6666666667%; } -.grd .col-4 { - max-width: 57.14285%; - flex-basis: 57.14285%; +.grd-row-col-2-6 { + max-width: 33.3333333333%; + flex-basis: 33.3333333333%; } -.grd .col--offset-4 { - margin-left: 57.14285%; +.grd-row-col-3-6 { + max-width: 50%; + flex-basis: 50%; } -.grd .col-5 { - max-width: 71.4285%; - flex-basis: 71.4285%; +.grd-row-col-4-6 { + max-width: 66.6666666667%; + flex-basis: 66.6666666667%; } -.grd .col--offset-5 { - margin-left: 71.4285%; +.grd-row-col-5-6 { + max-width: 83.3333333333%; + flex-basis: 83.3333333333%; } -.grd .col-6 { - max-width: 85.7142%; - flex-basis: 85.7142%; +.grd-row-col-6 { + max-width: 100%; + flex-basis: 100%; } -.grd .col--offset-6 { - margin-left: 85.7142%; +.grd-row-col-1-6,.grd-row-col-1-6--sm,.grd-row-col-1-6--md,.grd-row-col-1-6--lg,.grd-row-col-2-6,.grd-row-col-2-6--sm,.grd-row-col-2-6--md,.grd-row-col-2-6--lg,.grd-row-col-3-6,.grd-row-col-3-6--sm,.grd-row-col-3-6--md,.grd-row-col-3-6--lg,.grd-row-col-4-6,.grd-row-col-4-6--sm,.grd-row-col-4-6--md,.grd-row-col-4-6--lg,.grd-row-col-5-6,.grd-row-col-5-6--sm,.grd-row-col-5-6--md,.grd-row-col-5-6--lg,.grd-row-col-6,.grd-row-col-6--sm,.grd-row-col-6--md,.grd-row-col-6--lg { + flex: 1; + flex-direction: column; + box-sizing: border-box; } -.grd .col-7 { +.grd-row-col-1-6--sm,.grd-row-col-1-6--md,.grd-row-col-1-6--lg,.grd-row-col-2-6--sm,.grd-row-col-2-6--md,.grd-row-col-2-6--lg,.grd-row-col-3-6--sm,.grd-row-col-3-6--md,.grd-row-col-3-6--lg,.grd-row-col-4-6--sm,.grd-row-col-4-6--md,.grd-row-col-4-6--lg,.grd-row-col-5-6--sm,.grd-row-col-5-6--md,.grd-row-col-5-6--lg,.grd-row-col-6--sm,.grd-row-col-6--md,.grd-row-col-6--lg { max-width: 100%; flex-basis: 100%; } + +@media screen and (min-width: 32rem) { + .grd-row-col-1-6--sm { + max-width: 16.6666666667%; + flex-basis: 16.6666666667%; + } + + .grd-row-col-2-6--sm { + max-width: 33.3333333333%; + flex-basis: 33.3333333333%; + } + + .grd-row-col-3-6--sm { + max-width: 50%; + flex-basis: 50%; + } + + .grd-row-col-4-6--sm { + max-width: 66.6666666667%; + flex-basis: 66.6666666667%; + } + + .grd-row-col-5-6--sm { + max-width: 83.3333333333%; + flex-basis: 83.3333333333%; + } + + .grd-row-col-6--sm { + max-width: 100%; + flex-basis: 100%; + } +} + +@media screen and (min-width: 48rem) { + .grd-row-col-1-6--md { + max-width: 16.6666666667%; + flex-basis: 16.6666666667%; + } + + .grd-row-col-2-6--md { + max-width: 33.3333333333%; + flex-basis: 33.3333333333%; + } + + .grd-row-col-3-6--md { + max-width: 50%; + flex-basis: 50%; + } + + .grd-row-col-4-6--md { + max-width: 66.6666666667%; + flex-basis: 66.6666666667%; + } + + .grd-row-col-5-6--md { + max-width: 83.3333333333%; + flex-basis: 83.3333333333%; + } + + .grd-row-col-6--md { + max-width: 100%; + flex-basis: 100%; + } +} + +@media screen and (min-width: 64rem) { + .grd-row-col-1-6--lg { + max-width: 16.6666666667%; + flex-basis: 16.6666666667%; + } + + .grd-row-col-2-6--lg { + max-width: 33.3333333333%; + flex-basis: 33.3333333333%; + } + + .grd-row-col-3-6--lg { + max-width: 50%; + flex-basis: 50%; + } + + .grd-row-col-4-6--lg { + max-width: 66.6666666667%; + flex-basis: 66.6666666667%; + } + + .grd-row-col-5-6--lg { + max-width: 83.3333333333%; + flex-basis: 83.3333333333%; + } + + .grd-row-col-6--lg { + max-width: 100%; + flex-basis: 100%; + } +} \ No newline at end of file From 10f4302b941040253c3c15b4036d8691f00ac580 Mon Sep 17 00:00:00 2001 From: John Otander Date: Tue, 6 Jan 2015 11:04:56 -0700 Subject: [PATCH 4/7] Add changelog and bump version --- CHANGELOG.md | 29 +++++++++++++++++++++++++++++ package.json | 2 +- 2 files changed, 30 insertions(+), 1 deletion(-) create mode 100644 CHANGELOG.md diff --git a/CHANGELOG.md b/CHANGELOG.md new file mode 100644 index 0000000..4fd5825 --- /dev/null +++ b/CHANGELOG.md @@ -0,0 +1,29 @@ +# Furtive Changelog + +## 2.0.0 Replace the flex grid + +The grid now uses the following, 6 column grid system with md, lg breakpoints: + +```scss +.grd { /* ... */ } +.grd-row { /* ... */ } +.grd-row-col-1-6 { /* ... */ } +.grd-row-col-2-6 { /* ... */ } +.grd-row-col-3-6 { /* ... */ } +.grd-row-col-4-6 { /* ... */ } +.grd-row-col-5-6 { /* ... */ } +.grd-row-col-6 { /* ... */ } + +.grid-row-col-3-6--md { /* ... */ } +.grid-row-col-3-6--lg { /* ... */ } +``` + +The class naming scheme has slightly changed, ensuring the lowest specificity possible. + +## 1.0.2 Last version before breaking grid changes + + + +## 1.0.0 Initial release + +The first implementation of Furtive. diff --git a/package.json b/package.json index 0853172..a672e36 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "furtive", - "version": "1.0.2", + "version": "2.0.0", "description": "A forward-thinking, CSS micro-framework. Minimal by design.", "homepage": "https://github.com/johnotander/furtive", "main": "gulpfile.js", From 679146e59e5ff8e0728c62fce7d98348afbfd6de Mon Sep 17 00:00:00 2001 From: John Otander Date: Tue, 6 Jan 2015 11:08:31 -0700 Subject: [PATCH 5/7] Update the explainer page --- index.html | 62 ++++++++++++++++++++++++++---------------------------- 1 file changed, 30 insertions(+), 32 deletions(-) diff --git a/index.html b/index.html index 7ee0649..9aedf84 100644 --- a/index.html +++ b/index.html @@ -51,62 +51,60 @@

Installing Furtive

Responsive Grid System

- Furtive comes with a responsive grid system based on display: flex;. There are 7 available columns, - however this is easy to customize. + Furtive comes with a responsive grid system based on display: flex;. There are 6 available columns, + however this is easy to customize since it's dynamically generated as part of the build process with + rework-flex-grid.

-  .grd > .row > .col +  .grd > .grd-row > .grd-row-col
-
-
-  .col-1 -
-
-  .col-6 -
-
-
-
-  .col-2 +
+
+  .col-1
-
+
 .col-5
-
-
-  .col-3 +
+
+  .col-2
-
+
 .col-4
-
-
-  .col-4 +
+
+  .col-3
-
+
 .col-3
-
-
-  .col-5 +
+
+  .col-4
-
+
 .col-2
-
-
-  .col-6 +
+
+  .col-5
-
+
 .col-1
+
+
+  .col-6 +
+
@@ -139,7 +137,7 @@

Forms

Forms are typically a key component for most websites and web applications. As - such, Furtive seeks to keep them consistent, coherent, and elegant for all devices. + such, Furtive seeks to keep them consistent, coherent, and elegant for all devices.

From a972e7663a74f06ff686c6575cd3a4980a5c65d8 Mon Sep 17 00:00:00 2001 From: John Otander Date: Tue, 6 Jan 2015 11:09:30 -0700 Subject: [PATCH 6/7] Update the css, add the latest size --- README.md | 2 +- css/furtive.css | 208 +++++++++++++++++++++++++++++--------------- css/furtive.min.css | 2 +- index.html | 2 +- 4 files changed, 143 insertions(+), 71 deletions(-) diff --git a/README.md b/README.md index 3f57f41..d78d8b5 100644 --- a/README.md +++ b/README.md @@ -2,7 +2,7 @@ A forward-thinking, lightweight, CSS microframework. Minimal by design. -__2.5kB gzipped.__ +__2.67kB gzipped.__ Furtive is _truly_ mobile-first and nearly all dimensions are done in `rem`. It also has a small footprint, cutting down on the bandwidth necessary diff --git a/css/furtive.css b/css/furtive.css index 1724881..2e13cfe 100644 --- a/css/furtive.css +++ b/css/furtive.css @@ -1,7 +1,7 @@ /** * furtive - A forward-thinking, CSS micro-framework. Minimal by design. * @author John Otander (http://johnotander.com/) - * @version v1.0.2 + * @version v2.0.0 * @link https://github.com/johnotander/furtive * @license MIT */ @@ -328,8 +328,7 @@ td, th { padding-left: 1rem; padding-right: 1rem; } -.grd .row { - max-width: 100%; +.grd-row { box-sizing: border-box; display: -webkit-box; display: -webkit-flex; @@ -342,14 +341,46 @@ td, th { flex-direction: row; -webkit-flex-wrap: wrap; -ms-flex-wrap: wrap; - flex-wrap: wrap; } + flex-wrap: wrap; + max-width: 100%; } -.grd .col, .grd .col-1, .grd .col-2, .grd .col-3, .grd .col-4, .grd .col-5, .grd .col-6, .grd .col-7 { - box-sizing: border-box; - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; +.grd-row-col-1-6 { + max-width: 16.66667%; + -webkit-flex-basis: 16.66667%; + -ms-flex-preferred-size: 16.66667%; + flex-basis: 16.66667%; } + +.grd-row-col-2-6 { + max-width: 33.33333%; + -webkit-flex-basis: 33.33333%; + -ms-flex-preferred-size: 33.33333%; + flex-basis: 33.33333%; } + +.grd-row-col-3-6 { + max-width: 50%; + -webkit-flex-basis: 50%; + -ms-flex-preferred-size: 50%; + flex-basis: 50%; } + +.grd-row-col-4-6 { + max-width: 66.66667%; + -webkit-flex-basis: 66.66667%; + -ms-flex-preferred-size: 66.66667%; + flex-basis: 66.66667%; } + +.grd-row-col-5-6 { + max-width: 83.33333%; + -webkit-flex-basis: 83.33333%; + -ms-flex-preferred-size: 83.33333%; + flex-basis: 83.33333%; } + +.grd-row-col-6 { + max-width: 100%; + -webkit-flex-basis: 100%; + -ms-flex-preferred-size: 100%; + flex-basis: 100%; } + +.grd-row-col-1-6, .grd-row-col-1-6--sm, .grd-row-col-1-6--md, .grd-row-col-1-6--lg, .grd-row-col-2-6, .grd-row-col-2-6--sm, .grd-row-col-2-6--md, .grd-row-col-2-6--lg, .grd-row-col-3-6, .grd-row-col-3-6--sm, .grd-row-col-3-6--md, .grd-row-col-3-6--lg, .grd-row-col-4-6, .grd-row-col-4-6--sm, .grd-row-col-4-6--md, .grd-row-col-4-6--lg, .grd-row-col-5-6, .grd-row-col-5-6--sm, .grd-row-col-5-6--md, .grd-row-col-5-6--lg, .grd-row-col-6, .grd-row-col-6--sm, .grd-row-col-6--md, .grd-row-col-6--lg { -webkit-box-flex: 1; -webkit-flex: 1; -ms-flex: 1; @@ -359,69 +390,110 @@ td, th { -webkit-flex-direction: column; -ms-flex-direction: column; flex-direction: column; - padding-left: 0.25rem; - padding-right: 0.25rem; } - -.grd .col-1 { - max-width: 14.28571%; - -webkit-flex-basis: 14.28571%; - -ms-flex-preferred-size: 14.28571%; - flex-basis: 14.28571%; } - -.grd .col--offset-1 { - margin-left: 14.28571%; } - -.grd .col-2 { - max-width: 28.57142%; - -webkit-flex-basis: 28.57142%; - -ms-flex-preferred-size: 28.57142%; - flex-basis: 28.57142%; } - -.grd .col--offset-2 { - margin-left: 28.57142%; } - -.grd .col-3 { - max-width: 42.85714%; - -webkit-flex-basis: 42.85714%; - -ms-flex-preferred-size: 42.85714%; - flex-basis: 42.85714%; } - -.grd .col--offset-3 { - margin-left: 42.85714%; } - -.grd .col-4 { - max-width: 57.14285%; - -webkit-flex-basis: 57.14285%; - -ms-flex-preferred-size: 57.14285%; - flex-basis: 57.14285%; } - -.grd .col--offset-4 { - margin-left: 57.14285%; } - -.grd .col-5 { - max-width: 71.4285%; - -webkit-flex-basis: 71.4285%; - -ms-flex-preferred-size: 71.4285%; - flex-basis: 71.4285%; } - -.grd .col--offset-5 { - margin-left: 71.4285%; } - -.grd .col-6 { - max-width: 85.7142%; - -webkit-flex-basis: 85.7142%; - -ms-flex-preferred-size: 85.7142%; - flex-basis: 85.7142%; } - -.grd .col--offset-6 { - margin-left: 85.7142%; } - -.grd .col-7 { + box-sizing: border-box; } + +.grd-row-col-1-6--sm, .grd-row-col-1-6--md, .grd-row-col-1-6--lg, .grd-row-col-2-6--sm, .grd-row-col-2-6--md, .grd-row-col-2-6--lg, .grd-row-col-3-6--sm, .grd-row-col-3-6--md, .grd-row-col-3-6--lg, .grd-row-col-4-6--sm, .grd-row-col-4-6--md, .grd-row-col-4-6--lg, .grd-row-col-5-6--sm, .grd-row-col-5-6--md, .grd-row-col-5-6--lg, .grd-row-col-6--sm, .grd-row-col-6--md, .grd-row-col-6--lg { max-width: 100%; -webkit-flex-basis: 100%; -ms-flex-preferred-size: 100%; flex-basis: 100%; } +@media screen and (min-width: 32rem) { + .grd-row-col-1-6--sm { + max-width: 16.66667%; + -webkit-flex-basis: 16.66667%; + -ms-flex-preferred-size: 16.66667%; + flex-basis: 16.66667%; } + .grd-row-col-2-6--sm { + max-width: 33.33333%; + -webkit-flex-basis: 33.33333%; + -ms-flex-preferred-size: 33.33333%; + flex-basis: 33.33333%; } + .grd-row-col-3-6--sm { + max-width: 50%; + -webkit-flex-basis: 50%; + -ms-flex-preferred-size: 50%; + flex-basis: 50%; } + .grd-row-col-4-6--sm { + max-width: 66.66667%; + -webkit-flex-basis: 66.66667%; + -ms-flex-preferred-size: 66.66667%; + flex-basis: 66.66667%; } + .grd-row-col-5-6--sm { + max-width: 83.33333%; + -webkit-flex-basis: 83.33333%; + -ms-flex-preferred-size: 83.33333%; + flex-basis: 83.33333%; } + .grd-row-col-6--sm { + max-width: 100%; + -webkit-flex-basis: 100%; + -ms-flex-preferred-size: 100%; + flex-basis: 100%; } } + +@media screen and (min-width: 48rem) { + .grd-row-col-1-6--md { + max-width: 16.66667%; + -webkit-flex-basis: 16.66667%; + -ms-flex-preferred-size: 16.66667%; + flex-basis: 16.66667%; } + .grd-row-col-2-6--md { + max-width: 33.33333%; + -webkit-flex-basis: 33.33333%; + -ms-flex-preferred-size: 33.33333%; + flex-basis: 33.33333%; } + .grd-row-col-3-6--md { + max-width: 50%; + -webkit-flex-basis: 50%; + -ms-flex-preferred-size: 50%; + flex-basis: 50%; } + .grd-row-col-4-6--md { + max-width: 66.66667%; + -webkit-flex-basis: 66.66667%; + -ms-flex-preferred-size: 66.66667%; + flex-basis: 66.66667%; } + .grd-row-col-5-6--md { + max-width: 83.33333%; + -webkit-flex-basis: 83.33333%; + -ms-flex-preferred-size: 83.33333%; + flex-basis: 83.33333%; } + .grd-row-col-6--md { + max-width: 100%; + -webkit-flex-basis: 100%; + -ms-flex-preferred-size: 100%; + flex-basis: 100%; } } + +@media screen and (min-width: 64rem) { + .grd-row-col-1-6--lg { + max-width: 16.66667%; + -webkit-flex-basis: 16.66667%; + -ms-flex-preferred-size: 16.66667%; + flex-basis: 16.66667%; } + .grd-row-col-2-6--lg { + max-width: 33.33333%; + -webkit-flex-basis: 33.33333%; + -ms-flex-preferred-size: 33.33333%; + flex-basis: 33.33333%; } + .grd-row-col-3-6--lg { + max-width: 50%; + -webkit-flex-basis: 50%; + -ms-flex-preferred-size: 50%; + flex-basis: 50%; } + .grd-row-col-4-6--lg { + max-width: 66.66667%; + -webkit-flex-basis: 66.66667%; + -ms-flex-preferred-size: 66.66667%; + flex-basis: 66.66667%; } + .grd-row-col-5-6--lg { + max-width: 83.33333%; + -webkit-flex-basis: 83.33333%; + -ms-flex-preferred-size: 83.33333%; + flex-basis: 83.33333%; } + .grd-row-col-6--lg { + max-width: 100%; + -webkit-flex-basis: 100%; + -ms-flex-preferred-size: 100%; + flex-basis: 100%; } } + *, *:after, *:before { box-sizing: border-box; } diff --git a/css/furtive.min.css b/css/furtive.min.css index dc1f5bc..a52a387 100644 --- a/css/furtive.min.css +++ b/css/furtive.min.css @@ -1 +1 @@ -/*! normalize.css v3.0.1 | MIT License | git.io/normalize */html{font-family:sans-serif;-ms-text-size-adjust:100%;-webkit-text-size-adjust:100%}body{margin:0}article,aside,details,figcaption,figure,footer,header,hgroup,main,nav,section,summary{display:block}audio,canvas,progress,video{display:inline-block;vertical-align:baseline}audio:not([controls]){display:none;height:0}[hidden],template{display:none}a{background:0 0}a:active,a:hover{outline:0}abbr[title]{border-bottom:1px dotted}b,strong{font-weight:700}dfn{font-style:italic}mark{background:#ff0;color:#000}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sup{top:-.5em}sub{bottom:-.25em}img{border:0}svg:not(:root){overflow:hidden}figure{margin:1em 40px}hr{box-sizing:content-box;height:0}pre{overflow:auto}code,kbd,pre,samp{font-family:monospace,monospace;font-size:1em}button,input,optgroup,select,textarea{color:inherit;font:inherit;margin:0}button{overflow:visible}button,select{text-transform:none}button,html input[type=button],input[type=reset],input[type=submit]{-webkit-appearance:button;cursor:pointer}button[disabled],html input[disabled]{cursor:default}button::-moz-focus-inner,input::-moz-focus-inner{border:0;padding:0}input{line-height:normal}input[type=checkbox],input[type=radio]{box-sizing:border-box;padding:0}input[type=number]::-webkit-inner-spin-button,input[type=number]::-webkit-outer-spin-button{height:auto}input[type=search]{-webkit-appearance:textfield;box-sizing:content-box}input[type=search]::-webkit-search-cancel-button,input[type=search]::-webkit-search-decoration{-webkit-appearance:none}fieldset{border:1px solid silver;margin:0 2px;padding:.35em .625em .75em}legend{border:0;padding:0}textarea{overflow:auto}optgroup{font-weight:700}table{border-collapse:collapse;border-spacing:0}td,th{padding:0}.grd{padding-left:1rem;padding-right:1rem}.grd .row{max-width:100%;box-sizing:border-box;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-box-orient:horizontal;-webkit-box-direction:normal;-webkit-flex-direction:row;-ms-flex-direction:row;flex-direction:row;-webkit-flex-wrap:wrap;-ms-flex-wrap:wrap;flex-wrap:wrap}.grd .col,.grd .col-1,.grd .col-2,.grd .col-3,.grd .col-4,.grd .col-5,.grd .col-6,.grd .col-7{box-sizing:border-box;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-box-flex:1;-webkit-flex:1;-ms-flex:1;flex:1;-webkit-box-orient:vertical;-webkit-box-direction:normal;-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column;padding-left:.25rem;padding-right:.25rem}.grd .col-1{max-width:14.28571%;-webkit-flex-basis:14.28571%;-ms-flex-preferred-size:14.28571%;flex-basis:14.28571%}.grd .col--offset-1{margin-left:14.28571%}.grd .col-2{max-width:28.57142%;-webkit-flex-basis:28.57142%;-ms-flex-preferred-size:28.57142%;flex-basis:28.57142%}.grd .col--offset-2{margin-left:28.57142%}.grd .col-3{max-width:42.85714%;-webkit-flex-basis:42.85714%;-ms-flex-preferred-size:42.85714%;flex-basis:42.85714%}.grd .col--offset-3{margin-left:42.85714%}.grd .col-4{max-width:57.14285%;-webkit-flex-basis:57.14285%;-ms-flex-preferred-size:57.14285%;flex-basis:57.14285%}.grd .col--offset-4{margin-left:57.14285%}.grd .col-5{max-width:71.4285%;-webkit-flex-basis:71.4285%;-ms-flex-preferred-size:71.4285%;flex-basis:71.4285%}.grd .col--offset-5{margin-left:71.4285%}.grd .col-6{max-width:85.7142%;-webkit-flex-basis:85.7142%;-ms-flex-preferred-size:85.7142%;flex-basis:85.7142%}.grd .col--offset-6{margin-left:85.7142%}.grd .col-7{max-width:100%;-webkit-flex-basis:100%;-ms-flex-preferred-size:100%;flex-basis:100%}*,:after,:before{box-sizing:border-box}.measure{max-width:48rem;margin:0 auto}a{color:#3498db}a:active,a:focus,a:hover{color:#217dbb}.bg--red{background-color:#e74c3c}.bg--orange{background-color:#f39c12}.bg--blue{background-color:#3498db}.bg--green{background-color:#25ba84}.bg--white{background-color:#fff}.bg--light-gray{background-color:rgba(216,216,216,.99)}.bg--mid-gray{background-color:rgba(144,144,144,.99)}.bg--dark-gray{background-color:rgba(72,72,72,.99)}.bg--off-white{background-color:rgba(250,250,250,.99)}.fnt--red{color:#e74c3c}.fnt--orange{color:#f39c12}.fnt--blue{color:#3498db}.fnt--green{color:#25ba84}.fnt--white{color:#fff}.fnt--light-gray{color:rgba(216,216,216,.99)}.fnt--mid-gray{color:rgba(144,144,144,.99)}.fnt--dark-gray{color:rgba(72,72,72,.99)}.fnt--off-white{color:rgba(250,250,250,.99)}.m0{margin:0}.mx0{margin-left:0;margin-right:0}.my0{margin-top:0;margin-bottom:0}.m1{margin:1rem}.mx1{margin-left:1rem;margin-right:1rem}.my1{margin-top:1rem;margin-bottom:1rem}.m2{margin:2rem}.mx2{margin-left:2rem;margin-right:2rem}.my2{margin-top:2rem;margin-bottom:2rem}.p0{padding:0}.px0{padding-left:0;padding-right:0}.py0{padding-top:0;padding-bottom:0}.p1{padding:1rem}.px1{padding-left:1rem;padding-right:1rem}.py1{padding-top:1rem;padding-bottom:1rem}.p2{padding:2rem}.px2{padding-left:2rem;padding-right:2rem}.py2{padding-top:2rem;padding-bottom:2rem}html{font-size:12px}@media screen and (min-width:32rem) and (max-width:48rem){html{font-size:15px}}@media screen and (min-width:48rem){html{font-size:16px}}body{font-family:HelveticaNeue-Light,"Helvetica Neue Light","Helvetica Neue",Helvetica,Arial,sans-serif;font-weight:400;line-height:1.85;color:#333}.p,p{font-size:1rem;margin-bottom:1.3rem}.h1,.h2,.h3,.h4,h1,h2,h3,h4{margin:1.414rem 0 .5rem;font-weight:inherit;line-height:1.42}.h1,h1{margin-top:0;font-size:3.998rem}.h2,h2{font-size:2.827rem}.h3,h3{font-size:1.999rem}.h4,h4{font-size:1.414rem}.h5,h5,table th{font-size:1.121rem}.h6,h6{font-size:.88rem}.btn--s,.small,small{font-size:.707em}code,pre{font-family:Monaco,"Lucida Console",Courier,monospace}.italic{font-style:italic}.thin{font-weight:100}.bold{font-weight:700}.caps,table th{font-variant:small-caps}.justify{text-align:justify}.ellipsis{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.muted{opacity:.7}.clearfix:after{content:"";display:table;clear:both}.flt--left{float:left}.flt--right{float:right}.flt--none{float:none}.center{margin:auto}.txt--center{text-align:center}.txt--right{text-align:right}.txt--left,table th{text-align:left}.oflow-y--scroll{overflow-y:scroll}.w100,.w100--s{width:100%;display:block}@media screen and (min-width:32rem){.w100--s{width:auto;display:inline-block}}canvas,iframe,img,select,svg,textarea,video{max-width:100%}.brdr--rounded,.btn,.btn--blue,.btn--gray,.btn--green,.btn--link{border-radius:3px}.brdr--light-gray{border:thin solid rgba(216,216,216,.99)}.brdr--mid-gray{border:thin solid rgba(144,144,144,.99)}.brdr--dark-gray{border:thin solid rgba(72,72,72,.99)}.brdr--off-white{border:thin solid rgba(250,250,250,.99)}.btn,.btn--blue,.btn--gray,.btn--green,.btn--link{padding:.5rem 1rem;border:2px solid #ccc;color:#333;text-decoration:none;text-align:center}.btn:active,.btn:focus,.btn:hover{background-color:rgba(0,0,0,.05);color:#000}.btn--link{border-color:transparent;color:#3498db}.btn--link:hover{background-color:transparent;color:#1d6fa5}.btn--blue{border-color:#2792d9;background-color:#3498db;color:#fff}.btn--blue:active,.btn--blue:focus,.btn--blue:hover{color:#fff;background-color:#217dbb}.btn--green{border-color:#22a977;background-color:#25ba84;color:#fff}.btn--green:active,.btn--green:focus,.btn--green:hover{color:#fff;background-color:#1d8f65}.btn--gray{border-color:rgba(59,59,59,.99);background-color:rgba(72,72,72,.99);color:#fff}.btn--gray:active,.btn--gray:focus,.btn--gray:hover{color:#fff;background-color:rgba(46,46,46,.99)}.btn--s{padding:.5rem}.list--unstyled{list-style-type:none}input,textarea{padding:.5rem;margin-bottom:.5rem;display:block;width:100%;box-shadow:none;border:thin solid rgba(216,216,216,.99)}input[type=submit]{margin-top:.85rem}.media{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-box-align:start;-webkit-align-items:flex-start;-ms-flex-align:start;align-items:flex-start}.media .media-figure{margin-right:1em}.media .media-body{-webkit-box-flex:1;-webkit-flex:1 0 0;-ms-flex:1 0 0;flex:1 0 0}table>thead{border-bottom:thin solid rgba(250,250,250,.99)}table td,table th{padding:.25rem;word-wrap:none;line-height:1} \ No newline at end of file +/*! normalize.css v3.0.1 | MIT License | git.io/normalize */html{font-family:sans-serif;-ms-text-size-adjust:100%;-webkit-text-size-adjust:100%}body{margin:0}article,aside,details,figcaption,figure,footer,header,hgroup,main,nav,section,summary{display:block}audio,canvas,progress,video{display:inline-block;vertical-align:baseline}audio:not([controls]){display:none;height:0}[hidden],template{display:none}a{background:0 0}a:active,a:hover{outline:0}abbr[title]{border-bottom:1px dotted}b,strong{font-weight:700}dfn{font-style:italic}mark{background:#ff0;color:#000}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sup{top:-.5em}sub{bottom:-.25em}img{border:0}svg:not(:root){overflow:hidden}figure{margin:1em 40px}hr{box-sizing:content-box;height:0}pre{overflow:auto}code,kbd,pre,samp{font-family:monospace,monospace;font-size:1em}button,input,optgroup,select,textarea{color:inherit;font:inherit;margin:0}button{overflow:visible}button,select{text-transform:none}button,html input[type=button],input[type=reset],input[type=submit]{-webkit-appearance:button;cursor:pointer}button[disabled],html input[disabled]{cursor:default}button::-moz-focus-inner,input::-moz-focus-inner{border:0;padding:0}input{line-height:normal}input[type=checkbox],input[type=radio]{box-sizing:border-box;padding:0}input[type=number]::-webkit-inner-spin-button,input[type=number]::-webkit-outer-spin-button{height:auto}input[type=search]{-webkit-appearance:textfield;box-sizing:content-box}input[type=search]::-webkit-search-cancel-button,input[type=search]::-webkit-search-decoration{-webkit-appearance:none}fieldset{border:1px solid silver;margin:0 2px;padding:.35em .625em .75em}legend{border:0;padding:0}textarea{overflow:auto}optgroup{font-weight:700}table{border-collapse:collapse;border-spacing:0}td,th{padding:0}.grd{padding-left:1rem;padding-right:1rem}.grd-row{box-sizing:border-box;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-box-orient:horizontal;-webkit-box-direction:normal;-webkit-flex-direction:row;-ms-flex-direction:row;flex-direction:row;-webkit-flex-wrap:wrap;-ms-flex-wrap:wrap;flex-wrap:wrap;max-width:100%}.grd-row-col-1-6{max-width:16.66667%;-webkit-flex-basis:16.66667%;-ms-flex-preferred-size:16.66667%;flex-basis:16.66667%}.grd-row-col-2-6{max-width:33.33333%;-webkit-flex-basis:33.33333%;-ms-flex-preferred-size:33.33333%;flex-basis:33.33333%}.grd-row-col-3-6{max-width:50%;-webkit-flex-basis:50%;-ms-flex-preferred-size:50%;flex-basis:50%}.grd-row-col-4-6{max-width:66.66667%;-webkit-flex-basis:66.66667%;-ms-flex-preferred-size:66.66667%;flex-basis:66.66667%}.grd-row-col-5-6{max-width:83.33333%;-webkit-flex-basis:83.33333%;-ms-flex-preferred-size:83.33333%;flex-basis:83.33333%}.grd-row-col-6{max-width:100%;-webkit-flex-basis:100%;-ms-flex-preferred-size:100%;flex-basis:100%}.grd-row-col-1-6,.grd-row-col-1-6--lg,.grd-row-col-1-6--md,.grd-row-col-1-6--sm,.grd-row-col-2-6,.grd-row-col-2-6--lg,.grd-row-col-2-6--md,.grd-row-col-2-6--sm,.grd-row-col-3-6,.grd-row-col-3-6--lg,.grd-row-col-3-6--md,.grd-row-col-3-6--sm,.grd-row-col-4-6,.grd-row-col-4-6--lg,.grd-row-col-4-6--md,.grd-row-col-4-6--sm,.grd-row-col-5-6,.grd-row-col-5-6--lg,.grd-row-col-5-6--md,.grd-row-col-5-6--sm,.grd-row-col-6,.grd-row-col-6--lg,.grd-row-col-6--md,.grd-row-col-6--sm{-webkit-box-flex:1;-webkit-flex:1;-ms-flex:1;flex:1;-webkit-box-orient:vertical;-webkit-box-direction:normal;-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column;box-sizing:border-box}.grd-row-col-1-6--lg,.grd-row-col-1-6--md,.grd-row-col-1-6--sm,.grd-row-col-2-6--lg,.grd-row-col-2-6--md,.grd-row-col-2-6--sm,.grd-row-col-3-6--lg,.grd-row-col-3-6--md,.grd-row-col-3-6--sm,.grd-row-col-4-6--lg,.grd-row-col-4-6--md,.grd-row-col-4-6--sm,.grd-row-col-5-6--lg,.grd-row-col-5-6--md,.grd-row-col-5-6--sm,.grd-row-col-6--lg,.grd-row-col-6--md,.grd-row-col-6--sm{max-width:100%;-webkit-flex-basis:100%;-ms-flex-preferred-size:100%;flex-basis:100%}@media screen and (min-width:32rem){.grd-row-col-1-6--sm{max-width:16.66667%;-webkit-flex-basis:16.66667%;-ms-flex-preferred-size:16.66667%;flex-basis:16.66667%}.grd-row-col-2-6--sm{max-width:33.33333%;-webkit-flex-basis:33.33333%;-ms-flex-preferred-size:33.33333%;flex-basis:33.33333%}.grd-row-col-3-6--sm{max-width:50%;-webkit-flex-basis:50%;-ms-flex-preferred-size:50%;flex-basis:50%}.grd-row-col-4-6--sm{max-width:66.66667%;-webkit-flex-basis:66.66667%;-ms-flex-preferred-size:66.66667%;flex-basis:66.66667%}.grd-row-col-5-6--sm{max-width:83.33333%;-webkit-flex-basis:83.33333%;-ms-flex-preferred-size:83.33333%;flex-basis:83.33333%}.grd-row-col-6--sm{max-width:100%;-webkit-flex-basis:100%;-ms-flex-preferred-size:100%;flex-basis:100%}}@media screen and (min-width:48rem){.grd-row-col-1-6--md{max-width:16.66667%;-webkit-flex-basis:16.66667%;-ms-flex-preferred-size:16.66667%;flex-basis:16.66667%}.grd-row-col-2-6--md{max-width:33.33333%;-webkit-flex-basis:33.33333%;-ms-flex-preferred-size:33.33333%;flex-basis:33.33333%}.grd-row-col-3-6--md{max-width:50%;-webkit-flex-basis:50%;-ms-flex-preferred-size:50%;flex-basis:50%}.grd-row-col-4-6--md{max-width:66.66667%;-webkit-flex-basis:66.66667%;-ms-flex-preferred-size:66.66667%;flex-basis:66.66667%}.grd-row-col-5-6--md{max-width:83.33333%;-webkit-flex-basis:83.33333%;-ms-flex-preferred-size:83.33333%;flex-basis:83.33333%}.grd-row-col-6--md{max-width:100%;-webkit-flex-basis:100%;-ms-flex-preferred-size:100%;flex-basis:100%}}@media screen and (min-width:64rem){.grd-row-col-1-6--lg{max-width:16.66667%;-webkit-flex-basis:16.66667%;-ms-flex-preferred-size:16.66667%;flex-basis:16.66667%}.grd-row-col-2-6--lg{max-width:33.33333%;-webkit-flex-basis:33.33333%;-ms-flex-preferred-size:33.33333%;flex-basis:33.33333%}.grd-row-col-3-6--lg{max-width:50%;-webkit-flex-basis:50%;-ms-flex-preferred-size:50%;flex-basis:50%}.grd-row-col-4-6--lg{max-width:66.66667%;-webkit-flex-basis:66.66667%;-ms-flex-preferred-size:66.66667%;flex-basis:66.66667%}.grd-row-col-5-6--lg{max-width:83.33333%;-webkit-flex-basis:83.33333%;-ms-flex-preferred-size:83.33333%;flex-basis:83.33333%}.grd-row-col-6--lg{max-width:100%;-webkit-flex-basis:100%;-ms-flex-preferred-size:100%;flex-basis:100%}}*,:after,:before{box-sizing:border-box}.measure{max-width:48rem;margin:0 auto}a{color:#3498db}a:active,a:focus,a:hover{color:#217dbb}.bg--red{background-color:#e74c3c}.bg--orange{background-color:#f39c12}.bg--blue{background-color:#3498db}.bg--green{background-color:#25ba84}.bg--white{background-color:#fff}.bg--light-gray{background-color:rgba(216,216,216,.99)}.bg--mid-gray{background-color:rgba(144,144,144,.99)}.bg--dark-gray{background-color:rgba(72,72,72,.99)}.bg--off-white{background-color:rgba(250,250,250,.99)}.fnt--red{color:#e74c3c}.fnt--orange{color:#f39c12}.fnt--blue{color:#3498db}.fnt--green{color:#25ba84}.fnt--white{color:#fff}.fnt--light-gray{color:rgba(216,216,216,.99)}.fnt--mid-gray{color:rgba(144,144,144,.99)}.fnt--dark-gray{color:rgba(72,72,72,.99)}.fnt--off-white{color:rgba(250,250,250,.99)}.m0{margin:0}.mx0{margin-left:0;margin-right:0}.my0{margin-top:0;margin-bottom:0}.m1{margin:1rem}.mx1{margin-left:1rem;margin-right:1rem}.my1{margin-top:1rem;margin-bottom:1rem}.m2{margin:2rem}.mx2{margin-left:2rem;margin-right:2rem}.my2{margin-top:2rem;margin-bottom:2rem}.p0{padding:0}.px0{padding-left:0;padding-right:0}.py0{padding-top:0;padding-bottom:0}.p1{padding:1rem}.px1{padding-left:1rem;padding-right:1rem}.py1{padding-top:1rem;padding-bottom:1rem}.p2{padding:2rem}.px2{padding-left:2rem;padding-right:2rem}.py2{padding-top:2rem;padding-bottom:2rem}html{font-size:12px}@media screen and (min-width:32rem) and (max-width:48rem){html{font-size:15px}}@media screen and (min-width:48rem){html{font-size:16px}}body{font-family:HelveticaNeue-Light,"Helvetica Neue Light","Helvetica Neue",Helvetica,Arial,sans-serif;font-weight:400;line-height:1.85;color:#333}.p,p{font-size:1rem;margin-bottom:1.3rem}.h1,.h2,.h3,.h4,h1,h2,h3,h4{margin:1.414rem 0 .5rem;font-weight:inherit;line-height:1.42}.h1,h1{margin-top:0;font-size:3.998rem}.h2,h2{font-size:2.827rem}.h3,h3{font-size:1.999rem}.h4,h4{font-size:1.414rem}.h5,h5,table th{font-size:1.121rem}.h6,h6{font-size:.88rem}.btn--s,.small,small{font-size:.707em}code,pre{font-family:Monaco,"Lucida Console",Courier,monospace}.italic{font-style:italic}.thin{font-weight:100}.bold{font-weight:700}.caps,table th{font-variant:small-caps}.justify{text-align:justify}.ellipsis{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.muted{opacity:.7}.clearfix:after{content:"";display:table;clear:both}.flt--left{float:left}.flt--right{float:right}.flt--none{float:none}.center{margin:auto}.txt--center{text-align:center}.txt--right{text-align:right}.txt--left,table th{text-align:left}.oflow-y--scroll{overflow-y:scroll}.w100,.w100--s{width:100%;display:block}@media screen and (min-width:32rem){.w100--s{width:auto;display:inline-block}}canvas,iframe,img,select,svg,textarea,video{max-width:100%}.brdr--rounded,.btn,.btn--blue,.btn--gray,.btn--green,.btn--link{border-radius:3px}.brdr--light-gray{border:thin solid rgba(216,216,216,.99)}.brdr--mid-gray{border:thin solid rgba(144,144,144,.99)}.brdr--dark-gray{border:thin solid rgba(72,72,72,.99)}.brdr--off-white{border:thin solid rgba(250,250,250,.99)}.btn,.btn--blue,.btn--gray,.btn--green,.btn--link{padding:.5rem 1rem;border:2px solid #ccc;color:#333;text-decoration:none;text-align:center}.btn:active,.btn:focus,.btn:hover{background-color:rgba(0,0,0,.05);color:#000}.btn--link{border-color:transparent;color:#3498db}.btn--link:hover{background-color:transparent;color:#1d6fa5}.btn--blue{border-color:#2792d9;background-color:#3498db;color:#fff}.btn--blue:active,.btn--blue:focus,.btn--blue:hover{color:#fff;background-color:#217dbb}.btn--green{border-color:#22a977;background-color:#25ba84;color:#fff}.btn--green:active,.btn--green:focus,.btn--green:hover{color:#fff;background-color:#1d8f65}.btn--gray{border-color:rgba(59,59,59,.99);background-color:rgba(72,72,72,.99);color:#fff}.btn--gray:active,.btn--gray:focus,.btn--gray:hover{color:#fff;background-color:rgba(46,46,46,.99)}.btn--s{padding:.5rem}.list--unstyled{list-style-type:none}input,textarea{padding:.5rem;margin-bottom:.5rem;display:block;width:100%;box-shadow:none;border:thin solid rgba(216,216,216,.99)}input[type=submit]{margin-top:.85rem}.media{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-box-align:start;-webkit-align-items:flex-start;-ms-flex-align:start;align-items:flex-start}.media .media-figure{margin-right:1em}.media .media-body{-webkit-box-flex:1;-webkit-flex:1 0 0;-ms-flex:1 0 0;flex:1 0 0}table>thead{border-bottom:thin solid rgba(250,250,250,.99)}table td,table th{padding:.25rem;word-wrap:none;line-height:1} \ No newline at end of file diff --git a/index.html b/index.html index 9aedf84..13eb77c 100644 --- a/index.html +++ b/index.html @@ -14,7 +14,7 @@

Furtive
- A forward-thinking, CSS micro-framework (2.5kB). + A forward-thinking, CSS micro-framework (2.67kB).

Github From 54cccbbe6a12521bb4758d94bb437c67f1c69ee2 Mon Sep 17 00:00:00 2001 From: John Otander Date: Tue, 6 Jan 2015 11:12:52 -0700 Subject: [PATCH 7/7] Update the explainer page --- gulpfile.js | 3 +-- index.html | 30 +++++++++++------------------- site/index.furtive.min.css | 1 + 3 files changed, 13 insertions(+), 21 deletions(-) create mode 100644 site/index.furtive.min.css diff --git a/gulpfile.js b/gulpfile.js index bec6741..755ba1a 100644 --- a/gulpfile.js +++ b/gulpfile.js @@ -51,14 +51,13 @@ gulp.task('rework-grid', function() { }) )) .pipe(gulp.dest('scss')); - }); gulp.task('uncss', function() { return gulp.src('css/furtive.min.css') .pipe(size({ gzip: true, showFiles: true })) .pipe(uncss({ html: ['index.html'] })) - .pipe(rename('index.furtive.min.css')) + .pipe(rename('site/index.furtive.min.css')) .pipe(cssmin()) .pipe(size({ gzip: true, showFiles: true })) .pipe(gulp.dest('./')); diff --git a/index.html b/index.html index 13eb77c..d6d9681 100644 --- a/index.html +++ b/index.html @@ -7,7 +7,7 @@ - +
@@ -38,14 +38,6 @@

Why Furtive?

-
-
-

Installing Furtive

- $ npm install --save furtive
- $ bower install --save furtive
- $ git clone https://github.com/johnotander/furtive -
-

Responsive Grid System

@@ -61,42 +53,42 @@

Responsive Grid System

 .grd > .grd-row > .grd-row-col
-
+
 .col-1
-
+
 .col-5
-
+
 .col-2
-
+
 .col-4
-
+
 .col-3
-
+
 .col-3
-
+
 .col-4
-
+
 .col-2
-
+
 .col-5
-
+
 .col-1
diff --git a/site/index.furtive.min.css b/site/index.furtive.min.css new file mode 100644 index 0000000..604d690 --- /dev/null +++ b/site/index.furtive.min.css @@ -0,0 +1 @@ +/*! normalize.css v3.0.1 | MIT License | git.io/normalize */html{font-family:sans-serif;-ms-text-size-adjust:100%;-webkit-text-size-adjust:100%}body{margin:0}footer,section{display:block}a{background:0 0}a:active,a:hover{outline:0}img{border:0}code{font-size:1em}input,textarea{color:inherit;font:inherit;margin:0}input[type=submit]{-webkit-appearance:button;cursor:pointer}button::-moz-focus-inner,input::-moz-focus-inner{border:0;padding:0}input{line-height:normal}textarea{overflow:auto}table{border-collapse:collapse;border-spacing:0}td,th{padding:0}.grd{padding-left:1rem;padding-right:1rem}.grd-row{box-sizing:border-box;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-box-orient:horizontal;-webkit-box-direction:normal;-webkit-flex-direction:row;-ms-flex-direction:row;flex-direction:row;-webkit-flex-wrap:wrap;-ms-flex-wrap:wrap;flex-wrap:wrap;max-width:100%}.grd-row-col-1-6{max-width:16.66667%;-webkit-flex-basis:16.66667%;-ms-flex-preferred-size:16.66667%;flex-basis:16.66667%}.grd-row-col-2-6{max-width:33.33333%;-webkit-flex-basis:33.33333%;-ms-flex-preferred-size:33.33333%;flex-basis:33.33333%}.grd-row-col-3-6{max-width:50%;-webkit-flex-basis:50%;-ms-flex-preferred-size:50%;flex-basis:50%}.grd-row-col-4-6{max-width:66.66667%;-webkit-flex-basis:66.66667%;-ms-flex-preferred-size:66.66667%;flex-basis:66.66667%}.grd-row-col-5-6{max-width:83.33333%;-webkit-flex-basis:83.33333%;-ms-flex-preferred-size:83.33333%;flex-basis:83.33333%}.grd-row-col-6{max-width:100%;-webkit-flex-basis:100%;-ms-flex-preferred-size:100%;flex-basis:100%}.grd-row-col-1-6,.grd-row-col-2-6,.grd-row-col-3-6,.grd-row-col-4-6,.grd-row-col-5-6,.grd-row-col-6{-webkit-box-flex:1;-webkit-flex:1;-ms-flex:1;flex:1;-webkit-box-orient:vertical;-webkit-box-direction:normal;-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column;box-sizing:border-box}*,:after,:before{box-sizing:border-box}.measure{max-width:48rem;margin:0 auto}a{color:#3498db}a:active,a:focus,a:hover{color:#217dbb}.bg--red{background-color:#e74c3c}.bg--orange{background-color:#f39c12}.bg--blue{background-color:#3498db}.bg--green{background-color:#25ba84}.bg--white{background-color:#fff}.bg--light-gray{background-color:rgba(216,216,216,.99)}.bg--mid-gray{background-color:rgba(144,144,144,.99)}.bg--dark-gray{background-color:rgba(72,72,72,.99)}.bg--off-white{background-color:rgba(250,250,250,.99)}.fnt--red{color:#e74c3c}.fnt--orange{color:#f39c12}.fnt--blue{color:#3498db}.fnt--green{color:#25ba84}.fnt--white{color:#fff}.fnt--light-gray{color:rgba(216,216,216,.99)}.fnt--mid-gray{color:rgba(144,144,144,.99)}.fnt--dark-gray{color:rgba(72,72,72,.99)}.fnt--off-white{color:rgba(250,250,250,.99)}.m0{margin:0}.m1{margin:1rem}.mx1{margin-left:1rem;margin-right:1rem}.my1{margin-top:1rem;margin-bottom:1rem}.m2{margin:2rem}.mx2{margin-left:2rem;margin-right:2rem}.my2{margin-top:2rem;margin-bottom:2rem}.p0{padding:0}.p1{padding:1rem}.px1{padding-left:1rem;padding-right:1rem}.py1{padding-top:1rem;padding-bottom:1rem}.p2{padding:2rem}.px2{padding-left:2rem;padding-right:2rem}.py2{padding-top:2rem;padding-bottom:2rem}html{font-size:12px}@media screen and (min-width:32rem) and (max-width:48rem){html{font-size:15px}}@media screen and (min-width:48rem){html{font-size:16px}}body{font-family:HelveticaNeue-Light,"Helvetica Neue Light","Helvetica Neue",Helvetica,Arial,sans-serif;font-weight:400;line-height:1.85;color:#333}p{font-size:1rem;margin-bottom:1.3rem}.h1,.h2,.h3,.h4,h1,h2,h3,h4{margin:1.414rem 0 .5rem;font-weight:inherit;line-height:1.42}.h1,h1{margin-top:0;font-size:3.998rem}.h2,h2{font-size:2.827rem}.h3,h3{font-size:1.999rem}.h4,h4{font-size:1.414rem}.h5,table th{font-size:1.121rem}.h6,h6{font-size:.88rem}.btn--s,.small,small{font-size:.707em}code{font-family:Monaco,"Lucida Console",Courier,monospace}.italic{font-style:italic}.thin{font-weight:100}.bold{font-weight:700}.caps,table th{font-variant:small-caps}.muted{opacity:.7}.txt--center{text-align:center}.txt--right{text-align:right}.txt--left,table th{text-align:left}.oflow-y--scroll{overflow-y:scroll}.w100--s{width:100%;display:block}@media screen and (min-width:32rem){.w100--s{width:auto;display:inline-block}}img,textarea{max-width:100%}.btn,.btn--blue,.btn--gray,.btn--green,.btn--link{border-radius:3px}.brdr--light-gray{border:thin solid rgba(216,216,216,.99)}.brdr--mid-gray{border:thin solid rgba(144,144,144,.99)}.brdr--dark-gray{border:thin solid rgba(72,72,72,.99)}.brdr--off-white{border:thin solid rgba(250,250,250,.99)}.btn,.btn--blue,.btn--gray,.btn--green,.btn--link{padding:.5rem 1rem;border:2px solid #ccc;color:#333;text-decoration:none;text-align:center}.btn:active,.btn:focus,.btn:hover{background-color:rgba(0,0,0,.05);color:#000}.btn--link{border-color:transparent;color:#3498db}.btn--link:hover{background-color:transparent;color:#1d6fa5}.btn--blue{border-color:#2792d9;background-color:#3498db;color:#fff}.btn--blue:active,.btn--blue:focus,.btn--blue:hover{color:#fff;background-color:#217dbb}.btn--green{border-color:#22a977;background-color:#25ba84;color:#fff}.btn--green:active,.btn--green:focus,.btn--green:hover{color:#fff;background-color:#1d8f65}.btn--gray{border-color:rgba(59,59,59,.99);background-color:rgba(72,72,72,.99);color:#fff}.btn--gray:active,.btn--gray:focus,.btn--gray:hover{color:#fff;background-color:rgba(46,46,46,.99)}.btn--s{padding:.5rem}.list--unstyled{list-style-type:none}input,textarea{padding:.5rem;margin-bottom:.5rem;display:block;width:100%;box-shadow:none;border:thin solid rgba(216,216,216,.99)}input[type=submit]{margin-top:.85rem}.media{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-box-align:start;-webkit-align-items:flex-start;-ms-flex-align:start;align-items:flex-start}.media .media-figure{margin-right:1em}.media .media-body{-webkit-box-flex:1;-webkit-flex:1 0 0;-ms-flex:1 0 0;flex:1 0 0}table>thead{border-bottom:thin solid rgba(250,250,250,.99)}table td,table th{padding:.25rem;word-wrap:none;line-height:1} \ No newline at end of file