diff --git a/.npmignore b/.npmignore index 56321f7..47c8b46 100644 --- a/.npmignore +++ b/.npmignore @@ -10,4 +10,4 @@ gulp .babelrc .gitignore gulpfile.babel.js - +unit-tests diff --git a/README.md b/README.md index 09865d9..2483c68 100644 --- a/README.md +++ b/README.md @@ -52,7 +52,7 @@ npm install mq-scss --save ``````````` -Import mq-scss at the top of your main Sass file (note that the exact path will differ depending on your folder structure) +Import mq-scss at the top of your main Sass file (note that the exact path will differ depending on your folder structure). ``````scss @import "../node_modules/mq-scss/mq"; @@ -66,7 +66,7 @@ Import mq-scss at the top of your main Sass file (note that the exact path will ### Min/Max width -In this example we state that we want the background of the element to be red by default but change to blue if the screen is less than or equal to 600px wide +In this example we state that we want the background of the element to be red by default but change to blue if the screen is less than or equal to 600px wide. `````````````scss // SCSS @@ -363,7 +363,7 @@ $MQ-[element]__[property]--[state]: ([range], [breakpoint-1], [breakpoint-2]); Here is the breakdown of what each part means. I tend to use camelCase for each group to keep the grouping clear. -**$MQ** - MQ at the start tells us that it's a media query variable (helps when scanning through the code) +**$MQ** - MQ at the start tells us that it's a media query variable (helps when scanning through the code). **[element]** - The target element name. So for `.car__door` [element] would be `door`. @@ -1138,25 +1138,32 @@ If you wish to contribute to mq-scss, it now comes with a testing environment. T 4. If you have never used gulp before, run `npm install gulp-cli -g` 5. Run `gulp --open` -I plan to eventually create proper automated unit tests. This is better than nothing though. +It also comes with a batch of 46 unit tests that are used to ensure that all of the functionality remains intact. To run the unit tests: + +1. Run `gulp compile-tests` (refreshes the css files it tests against) +2. Run `npm test` ## Change log This change log only covers major changes to the mixin. Due to how npm works, things like edits to the readme file require releasing whole new versions of the module to publish the edits. Those sorts of releases are not listed here. +### v2.1.2 + +- Added automated unit-tests. + ### v2.1.0 - Added the ability to debug mq statements by setting either the local `$debug` setting or the global `$mq-debug` setting to `true`. -- Now supports media type only statements -- Added a proper testing/demo environment to the repository (check out repo > `npm i` > `gulp --open`) +- Now supports media type only statements. +- Added a proper testing/demo environment to the repository (check out repo > `npm i` > `gulp --open`). - Added support for `not` as a short-hand for `not screen` media types. ### v2.0.0 - Added the ability to define custom media types for individual mq statements. -- **BREAKING CHANGE:** By default, no media type is added to the media query (previously it added "screen" as the media type to all media queries) +- **BREAKING CHANGE:** By default, no media type is added to the media query (previously it added "screen" as the media type to all media queries). - If upgrading from v1.x you may want to add `"screen"` to the end of all your MQ statements to retain consistency with v1.x. - - eg. from `@include mq(max, 800px)` to `@include mq(max, 800px, 'screen')` + - eg. from `@include mq(max, 800px)` to `@include mq(max, 800px, 'screen')`. ### v1.3.2 @@ -1168,8 +1175,8 @@ This change log only covers major changes to the mixin. Due to how npm works, th ### v1.3.0 -- Added the `plus` keyword for improved handling of "and" statements -- Changed the breakpoints list example to just a list of variables +- Added the `plus` keyword for improved handling of "and" statements. +- Changed the breakpoints list example to just a list of variables. ### v1.2.0 diff --git a/gulp/helpers/readFile.js b/gulp/helpers/readFile.js new file mode 100644 index 0000000..3e8aadd --- /dev/null +++ b/gulp/helpers/readFile.js @@ -0,0 +1,10 @@ +import fs from 'fs'; + +export default function readFile(fileName){ + return new Promise((resolve, reject) => { + fs.readFile(fileName, 'utf8', (err, contents)=>{ + if (err) throw new Error(err); + resolve(contents); + }) + }) +} \ No newline at end of file diff --git a/gulp/helpers/unitTest.js b/gulp/helpers/unitTest.js new file mode 100644 index 0000000..b3f577c --- /dev/null +++ b/gulp/helpers/unitTest.js @@ -0,0 +1,11 @@ +import readFile from './readFile'; + +export default function unitTest (fileName, dir, expectedResult){ + test(fileName, ()=>{ + return readFile(`${dir}/${fileName}.css`).then(css => { + expect( css ).toBe(expectedResult+'\n'); + }) + }) +} + +//__dirname \ No newline at end of file diff --git a/gulp/tasks/compile-tests.js b/gulp/tasks/compile-tests.js new file mode 100644 index 0000000..e2415dc --- /dev/null +++ b/gulp/tasks/compile-tests.js @@ -0,0 +1,22 @@ + +import notifier from 'node-notifier'; +import { notification_icon_location } from '../config/shared-vars'; + +export default function(gulp, plugins, args, config, taskTarget, browserSync) { + + // Sass compilation + gulp.task('compile-tests', () => { + return gulp.src('unit-tests/*/**/*.scss') + .pipe(plugins.wait(100))//Helps prevent odd file not found error + .pipe(plugins.sass({ + outputStyle: 'compressed', + precision: 10, + includePaths: [ + 'unit-tests', + 'node_modules' + ] + }).on('error', plugins.sass.logError)) + .pipe(gulp.dest('unit-tests')) + }); + +} \ No newline at end of file diff --git a/gulp/tasks/sass.js b/gulp/tasks/sass.js index 062ec21..77e743d 100644 --- a/gulp/tasks/sass.js +++ b/gulp/tasks/sass.js @@ -5,7 +5,7 @@ import autoprefixer from 'autoprefixer'; import px2rem from 'postcss-pxtorem'; import gulpif from 'gulp-if'; import notifier from 'node-notifier'; -import { notification_icon_location } from '../config/shared-vars'; +import { notification_icon_location, plugins } from '../config/shared-vars'; export default function(gulp, plugins, args, config, taskTarget, browserSync) { let dirs = config.directories; @@ -20,7 +20,10 @@ export default function(gulp, plugins, args, config, taskTarget, browserSync) { // Sass compilation gulp.task('sass', () => { - return gulp.src(path.join(dirs.source, dirs.styles, entries.css)) + return gulp.src([ + [dirs.source, dirs.styles, entries.css].join('/'), + 'unit-tests/test-styles.scss', + ]) .pipe(plugins.plumber((error)=>{ console.log(`\n ${plugins.util.colors.red.bold('Sass failed to compile:')} ${plugins.util.colors.yellow(error.message)}\n`); //console.error(error.stack); @@ -28,6 +31,7 @@ export default function(gulp, plugins, args, config, taskTarget, browserSync) { })) .pipe(plugins.wait(100))//Helps prevent odd file not found error .pipe(plugins.sourcemaps.init()) + .pipe(plugins.sassGlob()) .pipe(plugins.sass({ outputStyle: 'expanded', precision: 10, @@ -38,7 +42,7 @@ export default function(gulp, plugins, args, config, taskTarget, browserSync) { ] }).on('error', plugins.sass.logError)) .pipe(plugins.postcss([ - autoprefixer({browsers: ['last 2 version', '> 5%', 'safari 5', 'ios 6', 'android 4', 'ie >= 9']}), + autoprefixer({browsers: ['last 2 version', '> 1%', 'ie >= 11'], grid: true }), px2rem(px2rem_settings) ])) .pipe(plugins.rename(function(path) { diff --git a/gulpfile.babel.js b/gulpfile.babel.js index 93dc6c7..ebc611b 100644 --- a/gulpfile.babel.js +++ b/gulpfile.babel.js @@ -48,6 +48,7 @@ gulp.task('compile', gulp.series( 'pug', 'imagemin', 'sass', + 'compile-tests', 'modernizr', 'browserify', ) @@ -77,6 +78,3 @@ gulp.task('build', gulp.series( // Server tasks with watch gulp.task('serve', gulp.series('default')); - -// Testing -gulp.task('test', gulp.series('eslint')); diff --git a/package-lock.json b/package-lock.json index 797aae5..62b9932 100644 --- a/package-lock.json +++ b/package-lock.json @@ -1,6 +1,6 @@ { "name": "mq-scss", - "version": "2.0.0", + "version": "2.1.0", "lockfileVersion": 1, "requires": true, "dependencies": { @@ -173,6 +173,12 @@ "through2": "2.0.3" } }, + "@types/node": { + "version": "8.5.7", + "resolved": "https://registry.npmjs.org/@types/node/-/node-8.5.7.tgz", + "integrity": "sha512-+1ZfzGIq8Y3EV7hPF7bs3i+Gi2mqYOiEGGRxGYPrn+hTYLMmzg+/5TkMkCHiRtLB38XSNvr/43aQ9+cUq4BbBg==", + "dev": true + }, "JSONStream": { "version": "1.3.1", "resolved": "https://registry.npmjs.org/JSONStream/-/JSONStream-1.3.1.tgz", @@ -183,6 +189,12 @@ "through": "2.3.8" } }, + "abab": { + "version": "1.0.4", + "resolved": "https://registry.npmjs.org/abab/-/abab-1.0.4.tgz", + "integrity": "sha1-X6rZwsB/YN12dw9xzwJbYqY8/U4=", + "dev": true + }, "abbrev": { "version": "1.1.1", "resolved": "https://registry.npmjs.org/abbrev/-/abbrev-1.1.1.tgz", @@ -370,6 +382,15 @@ "integrity": "sha1-rglCYAspkS8NKxTsYMRejzMLYRA=", "dev": true }, + "append-transform": { + "version": "0.4.0", + "resolved": "https://registry.npmjs.org/append-transform/-/append-transform-0.4.0.tgz", + "integrity": "sha1-126/jKlNJ24keja61EpLdKthGZE=", + "dev": true, + "requires": { + "default-require-extensions": "1.0.0" + } + }, "aproba": { "version": "1.2.0", "resolved": "https://registry.npmjs.org/aproba/-/aproba-1.2.0.tgz", @@ -469,6 +490,12 @@ "integrity": "sha1-p5SvDAWrF1KEbudTofIRoFugxE8=", "dev": true }, + "array-equal": { + "version": "1.0.0", + "resolved": "https://registry.npmjs.org/array-equal/-/array-equal-1.0.0.tgz", + "integrity": "sha1-jCpe8kcv2ep0KwTHenUJO6J1fJM=", + "dev": true + }, "array-filter": { "version": "0.0.1", "resolved": "https://registry.npmjs.org/array-filter/-/array-filter-0.0.1.tgz", @@ -611,6 +638,12 @@ "integrity": "sha1-104bh+ev/A24qttwIfP+SBAasjQ=", "dev": true }, + "astral-regex": { + "version": "1.0.0", + "resolved": "https://registry.npmjs.org/astral-regex/-/astral-regex-1.0.0.tgz", + "integrity": "sha512-+Ryf6g3BKoRc7jfp7ad8tM4TtMiaWvbF/1/sQcZPkkS7ag3D5nMBCe2UfOTONtAkaG0tO0ij3C5Lwmf1EiyjHg==", + "dev": true + }, "astw": { "version": "2.2.0", "resolved": "https://registry.npmjs.org/astw/-/astw-2.2.0.tgz", @@ -945,6 +978,16 @@ "babel-template": "6.26.0" } }, + "babel-jest": { + "version": "22.0.4", + "resolved": "https://registry.npmjs.org/babel-jest/-/babel-jest-22.0.4.tgz", + "integrity": "sha512-/Yt61fUpdFjetYlnpj280BPKEsPnK4mqzxDdo8DybPvrPNrLurbAF/WBjn2nnoi1Hc2Ippsf12/aOp8ys/Vl1A==", + "dev": true, + "requires": { + "babel-plugin-istanbul": "4.1.5", + "babel-preset-jest": "22.0.3" + } + }, "babel-messages": { "version": "6.23.0", "resolved": "https://registry.npmjs.org/babel-messages/-/babel-messages-6.23.0.tgz", @@ -969,6 +1012,40 @@ "babel-runtime": "6.26.0" } }, + "babel-plugin-istanbul": { + "version": "4.1.5", + "resolved": "https://registry.npmjs.org/babel-plugin-istanbul/-/babel-plugin-istanbul-4.1.5.tgz", + "integrity": "sha1-Z2DN2Xf0EdPhdbsGTyvDJ9mbK24=", + "dev": true, + "requires": { + "find-up": "2.1.0", + "istanbul-lib-instrument": "1.9.1", + "test-exclude": "4.1.1" + }, + "dependencies": { + "find-up": { + "version": "2.1.0", + "resolved": "https://registry.npmjs.org/find-up/-/find-up-2.1.0.tgz", + "integrity": "sha1-RdG35QbHF93UgndaK3eSCjwMV6c=", + "dev": true, + "requires": { + "locate-path": "2.0.0" + } + } + } + }, + "babel-plugin-jest-hoist": { + "version": "22.0.3", + "resolved": "https://registry.npmjs.org/babel-plugin-jest-hoist/-/babel-plugin-jest-hoist-22.0.3.tgz", + "integrity": "sha512-Z0pOZFs0xDctwF0bPEKrnAzvbbgDi2vDFbQ0EdofnLI2bOa3P1H66gNLb2vMJJaa00VDjfiGhIocsHvBkqtyEQ==", + "dev": true + }, + "babel-plugin-syntax-object-rest-spread": { + "version": "6.13.0", + "resolved": "https://registry.npmjs.org/babel-plugin-syntax-object-rest-spread/-/babel-plugin-syntax-object-rest-spread-6.13.0.tgz", + "integrity": "sha1-/WU28rzhODb/o6VFjEkDpZe7O/U=", + "dev": true + }, "babel-plugin-transform-es2015-arrow-functions": { "version": "6.22.0", "resolved": "https://registry.npmjs.org/babel-plugin-transform-es2015-arrow-functions/-/babel-plugin-transform-es2015-arrow-functions-6.22.0.tgz", @@ -1254,6 +1331,16 @@ "babel-plugin-transform-regenerator": "6.26.0" } }, + "babel-preset-jest": { + "version": "22.0.3", + "resolved": "https://registry.npmjs.org/babel-preset-jest/-/babel-preset-jest-22.0.3.tgz", + "integrity": "sha512-FbMMniSMXFvkKldCf+e4Tuol/v3XMaIpIp8xiT1WFlEW3ZapTKDW9YgVt3hqcpZXsIGFf6eUF3Owxom7yFlI8w==", + "dev": true, + "requires": { + "babel-plugin-jest-hoist": "22.0.3", + "babel-plugin-syntax-object-rest-spread": "6.13.0" + } + }, "babel-register": { "version": "6.26.0", "resolved": "https://registry.npmjs.org/babel-register/-/babel-register-6.26.0.tgz", @@ -1593,6 +1680,12 @@ "umd": "3.0.1" } }, + "browser-process-hrtime": { + "version": "0.1.2", + "resolved": "https://registry.npmjs.org/browser-process-hrtime/-/browser-process-hrtime-0.1.2.tgz", + "integrity": "sha1-Ql1opY00R/AqBKqJQYf86K+Le44=", + "dev": true + }, "browser-resolve": { "version": "1.11.2", "resolved": "https://registry.npmjs.org/browser-resolve/-/browser-resolve-1.11.2.tgz", @@ -1830,6 +1923,15 @@ "integrity": "sha1-DS1NSKcYyMBEdp/cT4lZLci2lYU=", "dev": true }, + "bser": { + "version": "2.0.0", + "resolved": "https://registry.npmjs.org/bser/-/bser-2.0.0.tgz", + "integrity": "sha1-mseNPtXZFYBP2HrLFYvHlxR6Fxk=", + "dev": true, + "requires": { + "node-int64": "0.4.0" + } + }, "buffer": { "version": "5.0.8", "resolved": "https://registry.npmjs.org/buffer/-/buffer-5.0.8.tgz", @@ -2175,6 +2277,12 @@ "readdirp": "2.1.0" } }, + "ci-info": { + "version": "1.1.2", + "resolved": "https://registry.npmjs.org/ci-info/-/ci-info-1.1.2.tgz", + "integrity": "sha512-uTGIPNx/nSpBdsF6xnseRXLLtfr9VLqkz8ZqHXr3Y7b6SftyRxBGjwMtJj1OhNbmlc1wZzLNAlAcvyIiE8a6ZA==", + "dev": true + }, "cipher-base": { "version": "1.0.4", "resolved": "https://registry.npmjs.org/cipher-base/-/cipher-base-1.0.4.tgz", @@ -2588,6 +2696,12 @@ "integrity": "sha1-wguW2MYXdIqvHBYCF2DNJ/y4y3U=", "dev": true }, + "content-type-parser": { + "version": "1.0.2", + "resolved": "https://registry.npmjs.org/content-type-parser/-/content-type-parser-1.0.2.tgz", + "integrity": "sha512-lM4l4CnMEwOLHAHr/P6MEZwZFPJFtAAKgL6pogbXmVZggIqXhdB6RbBtPOTsw2FcXwYhehRGERJmRrjOiIB8pQ==", + "dev": true + }, "convert-source-map": { "version": "1.5.1", "resolved": "https://registry.npmjs.org/convert-source-map/-/convert-source-map-1.5.1.tgz", @@ -2962,6 +3076,21 @@ } } }, + "cssom": { + "version": "0.3.2", + "resolved": "https://registry.npmjs.org/cssom/-/cssom-0.3.2.tgz", + "integrity": "sha1-uANhcMefB6kP8vFuIihAJ6JDhIs=", + "dev": true + }, + "cssstyle": { + "version": "0.2.37", + "resolved": "https://registry.npmjs.org/cssstyle/-/cssstyle-0.2.37.tgz", + "integrity": "sha1-VBCXI0yyUTyDzu06zdwn/yeYfVQ=", + "dev": true, + "requires": { + "cssom": "0.3.2" + } + }, "currently-unhandled": { "version": "0.4.1", "resolved": "https://registry.npmjs.org/currently-unhandled/-/currently-unhandled-0.4.1.tgz", @@ -3598,6 +3727,15 @@ "integrity": "sha1-s2nW+128E+7PUk+RsHD+7cNXzzQ=", "dev": true }, + "default-require-extensions": { + "version": "1.0.0", + "resolved": "https://registry.npmjs.org/default-require-extensions/-/default-require-extensions-1.0.0.tgz", + "integrity": "sha1-836hXT4T/9m0N9M+GnW1+5eHTLg=", + "dev": true, + "requires": { + "strip-bom": "2.0.0" + } + }, "default-resolution": { "version": "2.0.0", "resolved": "https://registry.npmjs.org/default-resolution/-/default-resolution-2.0.0.tgz", @@ -3745,6 +3883,12 @@ "integrity": "sha1-p2o+0YVb56ASu4rBbLgPPADcKPA=", "dev": true }, + "diff": { + "version": "3.4.0", + "resolved": "https://registry.npmjs.org/diff/-/diff-3.4.0.tgz", + "integrity": "sha512-QpVuMTEoJMF7cKzi6bvWhRulU1fZqZnvyVQgNhPaxxuTYwyjn/j1v9falseQ/uXWwPnO56RBfwtg4h/EQXmucA==", + "dev": true + }, "diffie-hellman": { "version": "5.0.2", "resolved": "https://registry.npmjs.org/diffie-hellman/-/diffie-hellman-5.0.2.tgz", @@ -3802,6 +3946,12 @@ "integrity": "sha1-sXrtguirWeUt2cGbF1bg/BhyBMI=", "dev": true }, + "domexception": { + "version": "1.0.0", + "resolved": "https://registry.npmjs.org/domexception/-/domexception-1.0.0.tgz", + "integrity": "sha512-WpwuBlZ2lQRFa4H/4w49deb9rJLot9KmqrKKjMc9qBl7CID+DdC2swoa34ccRl+anL2B6bLp6TjFdIdnzekMBQ==", + "dev": true + }, "domhandler": { "version": "2.4.1", "resolved": "https://registry.npmjs.org/domhandler/-/domhandler-2.4.1.tgz", @@ -4707,6 +4857,15 @@ } } }, + "exec-sh": { + "version": "0.2.1", + "resolved": "https://registry.npmjs.org/exec-sh/-/exec-sh-0.2.1.tgz", + "integrity": "sha512-aLt95pexaugVtQerpmE51+4QfWrNc304uez7jvj6fWnN8GeEHpttB8F36n8N7uVhUMbH/1enbxQ9HImZ4w/9qg==", + "dev": true, + "requires": { + "merge": "1.2.0" + } + }, "execa": { "version": "0.7.0", "resolved": "https://registry.npmjs.org/execa/-/execa-0.7.0.tgz", @@ -4758,6 +4917,20 @@ "os-homedir": "1.0.2" } }, + "expect": { + "version": "22.0.3", + "resolved": "https://registry.npmjs.org/expect/-/expect-22.0.3.tgz", + "integrity": "sha512-QapzeQkcA3jCx4pDnD07I4SPPxScKbey8TD/WwrnzmpHmL5q0dUtXfUt5OIFOjVBCg+C4zn4Y1zK9Rb9SIDL1g==", + "dev": true, + "requires": { + "ansi-styles": "3.2.0", + "jest-diff": "22.0.3", + "jest-get-type": "22.0.3", + "jest-matcher-utils": "22.0.3", + "jest-message-util": "22.0.3", + "jest-regex-util": "22.0.3" + } + }, "exposify": { "version": "0.5.0", "resolved": "https://registry.npmjs.org/exposify/-/exposify-0.5.0.tgz", @@ -4957,6 +5130,15 @@ "integrity": "sha1-PYpcZog6FqMMqGQ+hR8Zuqd5eRc=", "dev": true }, + "fb-watchman": { + "version": "2.0.0", + "resolved": "https://registry.npmjs.org/fb-watchman/-/fb-watchman-2.0.0.tgz", + "integrity": "sha1-VOmr99+i8mzZsWNsWIwa/AXeXVg=", + "dev": true, + "requires": { + "bser": "2.0.0" + } + }, "fd-slicer": { "version": "1.0.1", "resolved": "https://registry.npmjs.org/fd-slicer/-/fd-slicer-1.0.1.tgz", @@ -5020,6 +5202,16 @@ "trim-repeated": "1.0.0" } }, + "fileset": { + "version": "2.0.3", + "resolved": "https://registry.npmjs.org/fileset/-/fileset-2.0.3.tgz", + "integrity": "sha1-jnVIqW08wjJ+5eZ0FocjozO7oqA=", + "dev": true, + "requires": { + "glob": "7.1.2", + "minimatch": "3.0.4" + } + }, "fill-range": { "version": "2.2.3", "resolved": "https://registry.npmjs.org/fill-range/-/fill-range-2.2.3.tgz", @@ -6369,6 +6561,18 @@ "vinyl-sourcemaps-apply": "0.2.1" } }, + "gulp-sass-glob": { + "version": "1.0.8", + "resolved": "https://registry.npmjs.org/gulp-sass-glob/-/gulp-sass-glob-1.0.8.tgz", + "integrity": "sha1-O3N+zryebBBrgldMb6qTFL2Urqo=", + "dev": true, + "requires": { + "glob": "7.1.2", + "minimatch": "3.0.4", + "slash": "1.0.0", + "through2": "2.0.3" + } + }, "gulp-sourcemaps": { "version": "2.6.1", "resolved": "https://registry.npmjs.org/gulp-sourcemaps/-/gulp-sourcemaps-2.6.1.tgz", @@ -6538,6 +6742,113 @@ "glogg": "1.0.0" } }, + "handlebars": { + "version": "4.0.11", + "resolved": "https://registry.npmjs.org/handlebars/-/handlebars-4.0.11.tgz", + "integrity": "sha1-Ywo13+ApS8KB7a5v/F0yn8eYLcw=", + "dev": true, + "requires": { + "async": "1.5.2", + "optimist": "0.6.1", + "source-map": "0.4.4", + "uglify-js": "2.8.29" + }, + "dependencies": { + "cliui": { + "version": "2.1.0", + "resolved": "https://registry.npmjs.org/cliui/-/cliui-2.1.0.tgz", + "integrity": "sha1-S0dXYP+AJkx2LDoXGQMukcf+oNE=", + "dev": true, + "optional": true, + "requires": { + "center-align": "0.1.3", + "right-align": "0.1.3", + "wordwrap": "0.0.2" + }, + "dependencies": { + "wordwrap": { + "version": "0.0.2", + "resolved": "https://registry.npmjs.org/wordwrap/-/wordwrap-0.0.2.tgz", + "integrity": "sha1-t5Zpu0LstAn4PVg8rVLKF+qhZD8=", + "dev": true, + "optional": true + } + } + }, + "minimist": { + "version": "0.0.10", + "resolved": "https://registry.npmjs.org/minimist/-/minimist-0.0.10.tgz", + "integrity": "sha1-3j+YVD2/lggr5IrRoMfNqDYwHc8=", + "dev": true + }, + "optimist": { + "version": "0.6.1", + "resolved": "https://registry.npmjs.org/optimist/-/optimist-0.6.1.tgz", + "integrity": "sha1-2j6nRob6IaGaERwybpDrFaAZZoY=", + "dev": true, + "requires": { + "minimist": "0.0.10", + "wordwrap": "0.0.3" + } + }, + "source-map": { + "version": "0.4.4", + "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.4.4.tgz", + "integrity": "sha1-66T12pwNyZneaAMti092FzZSA2s=", + "dev": true, + "requires": { + "amdefine": "1.0.1" + } + }, + "uglify-js": { + "version": "2.8.29", + "resolved": "https://registry.npmjs.org/uglify-js/-/uglify-js-2.8.29.tgz", + "integrity": "sha1-KcVzMUgFe7Th913zW3qcty5qWd0=", + "dev": true, + "optional": true, + "requires": { + "source-map": "0.5.7", + "uglify-to-browserify": "1.0.2", + "yargs": "3.10.0" + }, + "dependencies": { + "source-map": { + "version": "0.5.7", + "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.5.7.tgz", + "integrity": "sha1-igOdLRAh0i0eoUyA2OpGi6LvP8w=", + "dev": true, + "optional": true + } + } + }, + "window-size": { + "version": "0.1.0", + "resolved": "https://registry.npmjs.org/window-size/-/window-size-0.1.0.tgz", + "integrity": "sha1-VDjNLqk7IC76Ohn+iIeu58lPnJ0=", + "dev": true, + "optional": true + }, + "wordwrap": { + "version": "0.0.3", + "resolved": "https://registry.npmjs.org/wordwrap/-/wordwrap-0.0.3.tgz", + "integrity": "sha1-o9XabNXAvAAI03I0u68b7WMFkQc=", + "dev": true + }, + "yargs": { + "version": "3.10.0", + "resolved": "https://registry.npmjs.org/yargs/-/yargs-3.10.0.tgz", + "integrity": "sha1-9+572FfdfB0tOMDnTvvWgdFDH9E=", + "dev": true, + "optional": true, + "requires": { + "camelcase": "1.2.1", + "cliui": "2.1.0", + "decamelize": "1.2.0", + "window-size": "0.1.0" + } + } + } + }, "har-schema": { "version": "1.0.5", "resolved": "https://registry.npmjs.org/har-schema/-/har-schema-1.0.5.tgz", @@ -6742,6 +7053,15 @@ "integrity": "sha1-ZouTd26q5V696POtRkswekljYl4=", "dev": true }, + "html-encoding-sniffer": { + "version": "1.0.2", + "resolved": "https://registry.npmjs.org/html-encoding-sniffer/-/html-encoding-sniffer-1.0.2.tgz", + "integrity": "sha512-71lZziiDnsuabfdYiUeWdCVyKuqwWi23L8YeIgV9jSSZHCtb6wB1BKWooH7L3tn4/FuZJMVWyNaIDr4RGmaSYw==", + "dev": true, + "requires": { + "whatwg-encoding": "1.0.3" + } + }, "html-minifier": { "version": "3.5.6", "resolved": "https://registry.npmjs.org/html-minifier/-/html-minifier-3.5.6.tgz", @@ -7245,6 +7565,15 @@ "integrity": "sha1-hut1OSgF3cM69xySoO7fdO52BLI=", "dev": true }, + "is-ci": { + "version": "1.1.0", + "resolved": "https://registry.npmjs.org/is-ci/-/is-ci-1.1.0.tgz", + "integrity": "sha512-c7TnwxLePuqIlxHgr7xtxzycJPegNHFuIrBkwbf8hc58//+Op1CqFkyS+xnIMkwn9UsJIwc174BIjkyBmSpjKg==", + "dev": true, + "requires": { + "ci-info": "1.1.2" + } + }, "is-date-object": { "version": "1.0.1", "resolved": "https://registry.npmjs.org/is-date-object/-/is-date-object-1.0.1.tgz", @@ -7684,56 +8013,184 @@ "integrity": "sha1-R+Y/evVa+m+S4VAOaQ64uFKcCZo=", "dev": true }, - "jade": { - "version": "1.11.0", - "resolved": "https://registry.npmjs.org/jade/-/jade-1.11.0.tgz", - "integrity": "sha1-nIDlOMEtP7lcjZu5VZ+gzAQEBf0=", - "dev": true, - "requires": { - "character-parser": "1.2.1", - "clean-css": "3.4.28", - "commander": "2.6.0", - "constantinople": "3.0.2", - "jstransformer": "0.0.2", + "istanbul-api": { + "version": "1.2.1", + "resolved": "https://registry.npmjs.org/istanbul-api/-/istanbul-api-1.2.1.tgz", + "integrity": "sha512-oFCwXvd65amgaPCzqrR+a2XjanS1MvpXN6l/MlMUTv6uiA1NOgGX+I0uyq8Lg3GDxsxPsaP1049krz3hIJ5+KA==", + "dev": true, + "requires": { + "async": "2.6.0", + "fileset": "2.0.3", + "istanbul-lib-coverage": "1.1.1", + "istanbul-lib-hook": "1.1.0", + "istanbul-lib-instrument": "1.9.1", + "istanbul-lib-report": "1.1.2", + "istanbul-lib-source-maps": "1.2.2", + "istanbul-reports": "1.1.3", + "js-yaml": "3.7.0", "mkdirp": "0.5.1", - "transformers": "2.1.0", - "uglify-js": "2.8.29", - "void-elements": "2.0.1", - "with": "4.0.3" + "once": "1.4.0" }, "dependencies": { - "clean-css": { - "version": "3.4.28", - "resolved": "https://registry.npmjs.org/clean-css/-/clean-css-3.4.28.tgz", - "integrity": "sha1-vxlF6C/ICPVWlebd6uwBQA79A/8=", - "dev": true, - "requires": { - "commander": "2.8.1", - "source-map": "0.4.4" - }, - "dependencies": { - "commander": { - "version": "2.8.1", - "resolved": "https://registry.npmjs.org/commander/-/commander-2.8.1.tgz", - "integrity": "sha1-Br42f+v9oMMwqh4qBy09yXYkJdQ=", - "dev": true, - "requires": { - "graceful-readlink": "1.0.1" - } - } - } - }, - "cliui": { - "version": "2.1.0", - "resolved": "https://registry.npmjs.org/cliui/-/cliui-2.1.0.tgz", - "integrity": "sha1-S0dXYP+AJkx2LDoXGQMukcf+oNE=", + "async": { + "version": "2.6.0", + "resolved": "https://registry.npmjs.org/async/-/async-2.6.0.tgz", + "integrity": "sha512-xAfGg1/NTLBBKlHFmnd7PlmUW9KhVQIUuSrYem9xzFUZy13ScvtyGGejaae9iAVRiRq9+Cx7DPFaAAhCpyxyPw==", "dev": true, "requires": { - "center-align": "0.1.3", - "right-align": "0.1.3", - "wordwrap": "0.0.2" + "lodash": "4.17.4" } - }, + } + } + }, + "istanbul-lib-coverage": { + "version": "1.1.1", + "resolved": "https://registry.npmjs.org/istanbul-lib-coverage/-/istanbul-lib-coverage-1.1.1.tgz", + "integrity": "sha512-0+1vDkmzxqJIn5rcoEqapSB4DmPxE31EtI2dF2aCkV5esN9EWHxZ0dwgDClivMXJqE7zaYQxq30hj5L0nlTN5Q==", + "dev": true + }, + "istanbul-lib-hook": { + "version": "1.1.0", + "resolved": "https://registry.npmjs.org/istanbul-lib-hook/-/istanbul-lib-hook-1.1.0.tgz", + "integrity": "sha512-U3qEgwVDUerZ0bt8cfl3dSP3S6opBoOtk3ROO5f2EfBr/SRiD9FQqzwaZBqFORu8W7O0EXpai+k7kxHK13beRg==", + "dev": true, + "requires": { + "append-transform": "0.4.0" + } + }, + "istanbul-lib-instrument": { + "version": "1.9.1", + "resolved": "https://registry.npmjs.org/istanbul-lib-instrument/-/istanbul-lib-instrument-1.9.1.tgz", + "integrity": "sha512-RQmXeQ7sphar7k7O1wTNzVczF9igKpaeGQAG9qR2L+BS4DCJNTI9nytRmIVYevwO0bbq+2CXvJmYDuz0gMrywA==", + "dev": true, + "requires": { + "babel-generator": "6.26.0", + "babel-template": "6.26.0", + "babel-traverse": "6.26.0", + "babel-types": "6.26.0", + "babylon": "6.18.0", + "istanbul-lib-coverage": "1.1.1", + "semver": "5.4.1" + } + }, + "istanbul-lib-report": { + "version": "1.1.2", + "resolved": "https://registry.npmjs.org/istanbul-lib-report/-/istanbul-lib-report-1.1.2.tgz", + "integrity": "sha512-UTv4VGx+HZivJQwAo1wnRwe1KTvFpfi/NYwN7DcsrdzMXwpRT/Yb6r4SBPoHWj4VuQPakR32g4PUUeyKkdDkBA==", + "dev": true, + "requires": { + "istanbul-lib-coverage": "1.1.1", + "mkdirp": "0.5.1", + "path-parse": "1.0.5", + "supports-color": "3.2.3" + }, + "dependencies": { + "has-flag": { + "version": "1.0.0", + "resolved": "https://registry.npmjs.org/has-flag/-/has-flag-1.0.0.tgz", + "integrity": "sha1-nZ55MWXOAXoA8AQYxD+UKnsdEfo=", + "dev": true + }, + "supports-color": { + "version": "3.2.3", + "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-3.2.3.tgz", + "integrity": "sha1-ZawFBLOVQXHYpklGsq48u4pfVPY=", + "dev": true, + "requires": { + "has-flag": "1.0.0" + } + } + } + }, + "istanbul-lib-source-maps": { + "version": "1.2.2", + "resolved": "https://registry.npmjs.org/istanbul-lib-source-maps/-/istanbul-lib-source-maps-1.2.2.tgz", + "integrity": "sha512-8BfdqSfEdtip7/wo1RnrvLpHVEd8zMZEDmOFEnpC6dg0vXflHt9nvoAyQUzig2uMSXfF2OBEYBV3CVjIL9JvaQ==", + "dev": true, + "requires": { + "debug": "3.1.0", + "istanbul-lib-coverage": "1.1.1", + "mkdirp": "0.5.1", + "rimraf": "2.6.2", + "source-map": "0.5.7" + }, + "dependencies": { + "debug": { + "version": "3.1.0", + "resolved": "https://registry.npmjs.org/debug/-/debug-3.1.0.tgz", + "integrity": "sha512-OX8XqP7/1a9cqkxYw2yXss15f26NKWBpDXQd0/uK/KPqdQhxbPa994hnzjcE2VqQpDslf55723cKPUOGSmMY3g==", + "dev": true, + "requires": { + "ms": "2.0.0" + } + }, + "source-map": { + "version": "0.5.7", + "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.5.7.tgz", + "integrity": "sha1-igOdLRAh0i0eoUyA2OpGi6LvP8w=", + "dev": true + } + } + }, + "istanbul-reports": { + "version": "1.1.3", + "resolved": "https://registry.npmjs.org/istanbul-reports/-/istanbul-reports-1.1.3.tgz", + "integrity": "sha512-ZEelkHh8hrZNI5xDaKwPMFwDsUf5wIEI2bXAFGp1e6deR2mnEKBPhLJEgr4ZBt8Gi6Mj38E/C8kcy9XLggVO2Q==", + "dev": true, + "requires": { + "handlebars": "4.0.11" + } + }, + "jade": { + "version": "1.11.0", + "resolved": "https://registry.npmjs.org/jade/-/jade-1.11.0.tgz", + "integrity": "sha1-nIDlOMEtP7lcjZu5VZ+gzAQEBf0=", + "dev": true, + "requires": { + "character-parser": "1.2.1", + "clean-css": "3.4.28", + "commander": "2.6.0", + "constantinople": "3.0.2", + "jstransformer": "0.0.2", + "mkdirp": "0.5.1", + "transformers": "2.1.0", + "uglify-js": "2.8.29", + "void-elements": "2.0.1", + "with": "4.0.3" + }, + "dependencies": { + "clean-css": { + "version": "3.4.28", + "resolved": "https://registry.npmjs.org/clean-css/-/clean-css-3.4.28.tgz", + "integrity": "sha1-vxlF6C/ICPVWlebd6uwBQA79A/8=", + "dev": true, + "requires": { + "commander": "2.8.1", + "source-map": "0.4.4" + }, + "dependencies": { + "commander": { + "version": "2.8.1", + "resolved": "https://registry.npmjs.org/commander/-/commander-2.8.1.tgz", + "integrity": "sha1-Br42f+v9oMMwqh4qBy09yXYkJdQ=", + "dev": true, + "requires": { + "graceful-readlink": "1.0.1" + } + } + } + }, + "cliui": { + "version": "2.1.0", + "resolved": "https://registry.npmjs.org/cliui/-/cliui-2.1.0.tgz", + "integrity": "sha1-S0dXYP+AJkx2LDoXGQMukcf+oNE=", + "dev": true, + "requires": { + "center-align": "0.1.3", + "right-align": "0.1.3", + "wordwrap": "0.0.2" + } + }, "commander": { "version": "2.6.0", "resolved": "https://registry.npmjs.org/commander/-/commander-2.6.0.tgz", @@ -7786,75 +8243,861 @@ "integrity": "sha1-9+572FfdfB0tOMDnTvvWgdFDH9E=", "dev": true, "requires": { - "camelcase": "1.2.1", - "cliui": "2.1.0", - "decamelize": "1.2.0", - "window-size": "0.1.0" + "camelcase": "1.2.1", + "cliui": "2.1.0", + "decamelize": "1.2.0", + "window-size": "0.1.0" + } + } + } + }, + "jest": { + "version": "22.0.4", + "resolved": "https://registry.npmjs.org/jest/-/jest-22.0.4.tgz", + "integrity": "sha512-S0tmgK5psULvt/11QzgAZWGpY5y5TkMRzd3T21Q13JzTx37Vx6F0Nw022c9Kc/IbEy+AHkKkGFVO5QafE8MrDg==", + "dev": true, + "requires": { + "jest-cli": "22.0.4" + }, + "dependencies": { + "ansi-regex": { + "version": "3.0.0", + "resolved": "https://registry.npmjs.org/ansi-regex/-/ansi-regex-3.0.0.tgz", + "integrity": "sha1-7QMXwyIGT3lGbAKWa922Bas32Zg=", + "dev": true + }, + "camelcase": { + "version": "4.1.0", + "resolved": "https://registry.npmjs.org/camelcase/-/camelcase-4.1.0.tgz", + "integrity": "sha1-1UVjW+HjPFQmScaRc+Xeas+uNN0=", + "dev": true + }, + "find-up": { + "version": "2.1.0", + "resolved": "https://registry.npmjs.org/find-up/-/find-up-2.1.0.tgz", + "integrity": "sha1-RdG35QbHF93UgndaK3eSCjwMV6c=", + "dev": true, + "requires": { + "locate-path": "2.0.0" + } + }, + "is-fullwidth-code-point": { + "version": "2.0.0", + "resolved": "https://registry.npmjs.org/is-fullwidth-code-point/-/is-fullwidth-code-point-2.0.0.tgz", + "integrity": "sha1-o7MKXE8ZkYMWeqq5O+764937ZU8=", + "dev": true + }, + "jest-cli": { + "version": "22.0.4", + "resolved": "https://registry.npmjs.org/jest-cli/-/jest-cli-22.0.4.tgz", + "integrity": "sha512-f1lZRM13IwIINzjE3RebXQKtQLiKncpSrbJZ/aTZJXmzEWGdgSayW4ESyhU+xK3uGiJEUSzbHjwPY6nGJ8VbUA==", + "dev": true, + "requires": { + "ansi-escapes": "3.0.0", + "chalk": "2.3.0", + "glob": "7.1.2", + "graceful-fs": "4.1.11", + "is-ci": "1.1.0", + "istanbul-api": "1.2.1", + "istanbul-lib-coverage": "1.1.1", + "istanbul-lib-instrument": "1.9.1", + "istanbul-lib-source-maps": "1.2.2", + "jest-changed-files": "22.0.3", + "jest-config": "22.0.4", + "jest-environment-jsdom": "22.0.4", + "jest-get-type": "22.0.3", + "jest-haste-map": "22.0.3", + "jest-message-util": "22.0.3", + "jest-regex-util": "22.0.3", + "jest-resolve-dependencies": "22.0.3", + "jest-runner": "22.0.4", + "jest-runtime": "22.0.4", + "jest-snapshot": "22.0.3", + "jest-util": "22.0.4", + "jest-worker": "22.0.3", + "micromatch": "2.3.11", + "node-notifier": "5.1.2", + "realpath-native": "1.0.0", + "rimraf": "2.6.2", + "slash": "1.0.0", + "string-length": "2.0.0", + "strip-ansi": "4.0.0", + "which": "1.3.0", + "yargs": "10.0.3" + } + }, + "os-locale": { + "version": "2.1.0", + "resolved": "https://registry.npmjs.org/os-locale/-/os-locale-2.1.0.tgz", + "integrity": "sha512-3sslG3zJbEYcaC4YVAvDorjGxc7tv6KVATnLPZONiljsUncvihe9BQoVCEs0RZ1kmf4Hk9OBqlZfJZWI4GanKA==", + "dev": true, + "requires": { + "execa": "0.7.0", + "lcid": "1.0.0", + "mem": "1.1.0" + } + }, + "string-width": { + "version": "2.1.1", + "resolved": "https://registry.npmjs.org/string-width/-/string-width-2.1.1.tgz", + "integrity": "sha512-nOqH59deCq9SRHlxq1Aw85Jnt4w6KvLKqWVik6oA9ZklXLNIOlqg4F2yrT1MVaTjAqvVwdfeZ7w7aCvJD7ugkw==", + "dev": true, + "requires": { + "is-fullwidth-code-point": "2.0.0", + "strip-ansi": "4.0.0" + } + }, + "strip-ansi": { + "version": "4.0.0", + "resolved": "https://registry.npmjs.org/strip-ansi/-/strip-ansi-4.0.0.tgz", + "integrity": "sha1-qEeQIusaw2iocTibY1JixQXuNo8=", + "dev": true, + "requires": { + "ansi-regex": "3.0.0" + } + }, + "which-module": { + "version": "2.0.0", + "resolved": "https://registry.npmjs.org/which-module/-/which-module-2.0.0.tgz", + "integrity": "sha1-2e8H3Od7mQK4o6j6SzHD4/fm6Ho=", + "dev": true + }, + "yargs": { + "version": "10.0.3", + "resolved": "https://registry.npmjs.org/yargs/-/yargs-10.0.3.tgz", + "integrity": "sha512-DqBpQ8NAUX4GyPP/ijDGHsJya4tYqLQrjPr95HNsr1YwL3+daCfvBwg7+gIC6IdJhR2kATh3hb61vjzMWEtjdw==", + "dev": true, + "requires": { + "cliui": "3.2.0", + "decamelize": "1.2.0", + "find-up": "2.1.0", + "get-caller-file": "1.0.2", + "os-locale": "2.1.0", + "require-directory": "2.1.1", + "require-main-filename": "1.0.1", + "set-blocking": "2.0.0", + "string-width": "2.1.1", + "which-module": "2.0.0", + "y18n": "3.2.1", + "yargs-parser": "8.1.0" + } + }, + "yargs-parser": { + "version": "8.1.0", + "resolved": "https://registry.npmjs.org/yargs-parser/-/yargs-parser-8.1.0.tgz", + "integrity": "sha512-yP+6QqN8BmrgW2ggLtTbdrOyBNSI7zBa4IykmiV5R1wl1JWNxQvWhMfMdmzIYtKU7oP3OOInY/tl2ov3BDjnJQ==", + "dev": true, + "requires": { + "camelcase": "4.1.0" + } + } + } + }, + "jest-changed-files": { + "version": "22.0.3", + "resolved": "https://registry.npmjs.org/jest-changed-files/-/jest-changed-files-22.0.3.tgz", + "integrity": "sha512-CG7eNJNO9x1O/3J4Uhe2QXra1MnC9+KS1f2NeOg+7iQ+8dDCgxCtpusmKfu44TnEyKwkIDhDr6htPfPaI+Fwbw==", + "dev": true, + "requires": { + "throat": "4.1.0" + } + }, + "jest-config": { + "version": "22.0.4", + "resolved": "https://registry.npmjs.org/jest-config/-/jest-config-22.0.4.tgz", + "integrity": "sha512-NcBeixqHjHDZO9+pUj+365LQV2s65d2f0/IrwlUyv0xaJovRNc6eDvoJ/r2UUlHnqjP3Go+R0ECUsXPXjk4SHw==", + "dev": true, + "requires": { + "chalk": "2.3.0", + "glob": "7.1.2", + "jest-environment-jsdom": "22.0.4", + "jest-environment-node": "22.0.4", + "jest-get-type": "22.0.3", + "jest-jasmine2": "22.0.4", + "jest-regex-util": "22.0.3", + "jest-resolve": "22.0.4", + "jest-util": "22.0.4", + "jest-validate": "22.0.3", + "pretty-format": "22.0.3" + } + }, + "jest-diff": { + "version": "22.0.3", + "resolved": "https://registry.npmjs.org/jest-diff/-/jest-diff-22.0.3.tgz", + "integrity": "sha512-Y7xN9Lc/NgFvR14lvjrJXB6x2x1LLe5NnMyzLvilBSSOyjy9uAVnR2Bt1YgzdfRrfaxsx7xFUVcqXLUnPkrJcA==", + "dev": true, + "requires": { + "chalk": "2.3.0", + "diff": "3.4.0", + "jest-get-type": "22.0.3", + "pretty-format": "22.0.3" + } + }, + "jest-docblock": { + "version": "22.0.3", + "resolved": "https://registry.npmjs.org/jest-docblock/-/jest-docblock-22.0.3.tgz", + "integrity": "sha512-LhviP2rqIg2IzS6m97W7T032oMrT699Tr6Njjhhl4FCLj+75BUy9CsSmGgfoVEql1uc+myBkssvcbn7T9xDR+A==", + "dev": true, + "requires": { + "detect-newline": "2.1.0" + } + }, + "jest-environment-jsdom": { + "version": "22.0.4", + "resolved": "https://registry.npmjs.org/jest-environment-jsdom/-/jest-environment-jsdom-22.0.4.tgz", + "integrity": "sha512-vnjefLZlsNsmnjKcaXkx2IxTBNG40vfRVOdMfcfkPkq85JxFB7wzNtjLx+RIfiNpIZd04C1PXbF0aJIenY85Ng==", + "dev": true, + "requires": { + "jest-mock": "22.0.3", + "jest-util": "22.0.4", + "jsdom": "11.5.1" + } + }, + "jest-environment-node": { + "version": "22.0.4", + "resolved": "https://registry.npmjs.org/jest-environment-node/-/jest-environment-node-22.0.4.tgz", + "integrity": "sha512-9vjNKb86UivvKCZCudMNixQgdMnOG7ql6iVYnaiK0CmvZ0WQD+mlM10NvgiWpRv4HstcnRL1pY/GSIHXAD6qXw==", + "dev": true, + "requires": { + "jest-mock": "22.0.3", + "jest-util": "22.0.4" + } + }, + "jest-get-type": { + "version": "22.0.3", + "resolved": "https://registry.npmjs.org/jest-get-type/-/jest-get-type-22.0.3.tgz", + "integrity": "sha512-TaJnc/lnJQ3jwry+NUWkqaJmKrM/Ut3XdK89HfiqdI3DMRLd6Zb4wyKjwuNP37MEQqlNg0YWH4sbBR8D4exjCA==", + "dev": true + }, + "jest-haste-map": { + "version": "22.0.3", + "resolved": "https://registry.npmjs.org/jest-haste-map/-/jest-haste-map-22.0.3.tgz", + "integrity": "sha512-VosIMOFQFu1rTF+MvOWVuv2KVmZ9eTkRgfwW2yUAs6/AhwmIfXRl/tih+fIOYcHzU4Auu1G8Fvl2kkF5g0k6/A==", + "dev": true, + "requires": { + "fb-watchman": "2.0.0", + "graceful-fs": "4.1.11", + "jest-docblock": "22.0.3", + "jest-worker": "22.0.3", + "micromatch": "2.3.11", + "sane": "2.2.0" + } + }, + "jest-jasmine2": { + "version": "22.0.4", + "resolved": "https://registry.npmjs.org/jest-jasmine2/-/jest-jasmine2-22.0.4.tgz", + "integrity": "sha512-pn1XPHUkffHK6oNY1Dfl/+Rg0UuTdlg3aGDnjyK6dZzGEBeiH1uKuSgZEjy3Lj461l3atpzsQyw7ilXPyjFnUw==", + "dev": true, + "requires": { + "callsites": "2.0.0", + "chalk": "2.3.0", + "expect": "22.0.3", + "graceful-fs": "4.1.11", + "jest-diff": "22.0.3", + "jest-matcher-utils": "22.0.3", + "jest-message-util": "22.0.3", + "jest-snapshot": "22.0.3", + "source-map-support": "0.5.0" + }, + "dependencies": { + "callsites": { + "version": "2.0.0", + "resolved": "https://registry.npmjs.org/callsites/-/callsites-2.0.0.tgz", + "integrity": "sha1-BuuE8A7qQT2oav/vrL/7Ngk7PFA=", + "dev": true + }, + "source-map-support": { + "version": "0.5.0", + "resolved": "https://registry.npmjs.org/source-map-support/-/source-map-support-0.5.0.tgz", + "integrity": "sha512-vUoN3I7fHQe0R/SJLKRdKYuEdRGogsviXFkHHo17AWaTGv17VLnxw+CFXvqy+y4ORZ3doWLQcxRYfwKrsd/H7Q==", + "dev": true, + "requires": { + "source-map": "0.6.1" + } + } + } + }, + "jest-leak-detector": { + "version": "22.0.3", + "resolved": "https://registry.npmjs.org/jest-leak-detector/-/jest-leak-detector-22.0.3.tgz", + "integrity": "sha512-xyVdAmcG8M3jWtVeadDUU6MAHLBrjkP4clz2UtTZ1gpe5bRLk27VjQOpzTwK20MkV/6iZQhSuRVuzHS5kD0HpA==", + "dev": true, + "requires": { + "pretty-format": "22.0.3" + } + }, + "jest-matcher-utils": { + "version": "22.0.3", + "resolved": "https://registry.npmjs.org/jest-matcher-utils/-/jest-matcher-utils-22.0.3.tgz", + "integrity": "sha512-FJbKpCR3K7YYE/Pnvy5OrLFgPEswpYWIfVtdwT2NC6pBARbYGX39KF3bTxS9yg2mv0YL2zHe3UbwzFsi9nFpVA==", + "dev": true, + "requires": { + "chalk": "2.3.0", + "jest-get-type": "22.0.3", + "pretty-format": "22.0.3" + } + }, + "jest-message-util": { + "version": "22.0.3", + "resolved": "https://registry.npmjs.org/jest-message-util/-/jest-message-util-22.0.3.tgz", + "integrity": "sha512-AVBdCx7Oj5wBpMOH089lx7Zgwpdz9HbReA82HuVAlIT4kEQRvCy6Sl9yVWDGJwHTgB/OYQGkgmbv/P/K8TkWNw==", + "dev": true, + "requires": { + "@babel/code-frame": "7.0.0-beta.36", + "chalk": "2.3.0", + "micromatch": "2.3.11", + "slash": "1.0.0", + "stack-utils": "1.0.1" + }, + "dependencies": { + "@babel/code-frame": { + "version": "7.0.0-beta.36", + "resolved": "https://registry.npmjs.org/@babel/code-frame/-/code-frame-7.0.0-beta.36.tgz", + "integrity": "sha512-sW77BFwJ48YvQp3Gzz5xtAUiXuYOL2aMJKDwiaY3OcvdqBFurtYfOpSa4QrNyDxmOGRFSYzUpabU2m9QrlWE7w==", + "dev": true, + "requires": { + "chalk": "2.3.0", + "esutils": "2.0.2", + "js-tokens": "3.0.2" + } + } + } + }, + "jest-mock": { + "version": "22.0.3", + "resolved": "https://registry.npmjs.org/jest-mock/-/jest-mock-22.0.3.tgz", + "integrity": "sha512-donODXcDG03EAEavc9xfJ7fBF/LNVjoZYkmj9DLrQ1B9YcT6wh8Xx7IYg25b8V/8F/eXPMAE0KK5q6Fqe6yAeg==", + "dev": true + }, + "jest-regex-util": { + "version": "22.0.3", + "resolved": "https://registry.npmjs.org/jest-regex-util/-/jest-regex-util-22.0.3.tgz", + "integrity": "sha512-mplC9chiAotES3ClzNhy0SJcfHB2DivooKJZW+2hDdvP8LLB+OUI+D6bJd7sncbKUsyFcmblEvpm/zz/hef7HA==", + "dev": true + }, + "jest-resolve": { + "version": "22.0.4", + "resolved": "https://registry.npmjs.org/jest-resolve/-/jest-resolve-22.0.4.tgz", + "integrity": "sha512-yoxHsX4MTT2Ra/dFia9VCunzsA/4jMBENMmLjREIUkCIP1edk/PZUOGVVf680Gw04CtmT5stETylcbmbL7hJBw==", + "dev": true, + "requires": { + "browser-resolve": "1.11.2", + "chalk": "2.3.0" + } + }, + "jest-resolve-dependencies": { + "version": "22.0.3", + "resolved": "https://registry.npmjs.org/jest-resolve-dependencies/-/jest-resolve-dependencies-22.0.3.tgz", + "integrity": "sha512-u9MUNJIa9GJ0YFhvM0+Scr4tyX84nC42d3w18Cly1doY7pTT+9momm+TncpuDlFyB2aNmS8SfdEbiLr1e6tBwg==", + "dev": true, + "requires": { + "jest-regex-util": "22.0.3" + } + }, + "jest-runner": { + "version": "22.0.4", + "resolved": "https://registry.npmjs.org/jest-runner/-/jest-runner-22.0.4.tgz", + "integrity": "sha512-srBkbqmiSB+jzSaG652fmi3kS6rV6wS/4fOG8dxxBg3dCqNQcM2/L3TI3ZK0SwIAcdGJh5Gybs8aDboT8K9Cdw==", + "dev": true, + "requires": { + "jest-config": "22.0.4", + "jest-docblock": "22.0.3", + "jest-haste-map": "22.0.3", + "jest-jasmine2": "22.0.4", + "jest-leak-detector": "22.0.3", + "jest-message-util": "22.0.3", + "jest-runtime": "22.0.4", + "jest-util": "22.0.4", + "jest-worker": "22.0.3", + "throat": "4.1.0" + } + }, + "jest-runtime": { + "version": "22.0.4", + "resolved": "https://registry.npmjs.org/jest-runtime/-/jest-runtime-22.0.4.tgz", + "integrity": "sha512-+7uEwf/4f8k1E/eViyGK6/M5yA4O3f6TdWViuqF9MV7vXwG2OVJu8YEZa5239nEnHJiwinXp4eZXX+HB4pQRPg==", + "dev": true, + "requires": { + "babel-core": "6.26.0", + "babel-jest": "22.0.4", + "babel-plugin-istanbul": "4.1.5", + "chalk": "2.3.0", + "convert-source-map": "1.5.1", + "graceful-fs": "4.1.11", + "jest-config": "22.0.4", + "jest-haste-map": "22.0.3", + "jest-regex-util": "22.0.3", + "jest-resolve": "22.0.4", + "jest-util": "22.0.4", + "json-stable-stringify": "1.0.1", + "micromatch": "2.3.11", + "realpath-native": "1.0.0", + "slash": "1.0.0", + "strip-bom": "3.0.0", + "write-file-atomic": "2.3.0", + "yargs": "10.0.3" + }, + "dependencies": { + "ansi-regex": { + "version": "3.0.0", + "resolved": "https://registry.npmjs.org/ansi-regex/-/ansi-regex-3.0.0.tgz", + "integrity": "sha1-7QMXwyIGT3lGbAKWa922Bas32Zg=", + "dev": true + }, + "camelcase": { + "version": "4.1.0", + "resolved": "https://registry.npmjs.org/camelcase/-/camelcase-4.1.0.tgz", + "integrity": "sha1-1UVjW+HjPFQmScaRc+Xeas+uNN0=", + "dev": true + }, + "find-up": { + "version": "2.1.0", + "resolved": "https://registry.npmjs.org/find-up/-/find-up-2.1.0.tgz", + "integrity": "sha1-RdG35QbHF93UgndaK3eSCjwMV6c=", + "dev": true, + "requires": { + "locate-path": "2.0.0" + } + }, + "is-fullwidth-code-point": { + "version": "2.0.0", + "resolved": "https://registry.npmjs.org/is-fullwidth-code-point/-/is-fullwidth-code-point-2.0.0.tgz", + "integrity": "sha1-o7MKXE8ZkYMWeqq5O+764937ZU8=", + "dev": true + }, + "os-locale": { + "version": "2.1.0", + "resolved": "https://registry.npmjs.org/os-locale/-/os-locale-2.1.0.tgz", + "integrity": "sha512-3sslG3zJbEYcaC4YVAvDorjGxc7tv6KVATnLPZONiljsUncvihe9BQoVCEs0RZ1kmf4Hk9OBqlZfJZWI4GanKA==", + "dev": true, + "requires": { + "execa": "0.7.0", + "lcid": "1.0.0", + "mem": "1.1.0" + } + }, + "string-width": { + "version": "2.1.1", + "resolved": "https://registry.npmjs.org/string-width/-/string-width-2.1.1.tgz", + "integrity": "sha512-nOqH59deCq9SRHlxq1Aw85Jnt4w6KvLKqWVik6oA9ZklXLNIOlqg4F2yrT1MVaTjAqvVwdfeZ7w7aCvJD7ugkw==", + "dev": true, + "requires": { + "is-fullwidth-code-point": "2.0.0", + "strip-ansi": "4.0.0" + } + }, + "strip-ansi": { + "version": "4.0.0", + "resolved": "https://registry.npmjs.org/strip-ansi/-/strip-ansi-4.0.0.tgz", + "integrity": "sha1-qEeQIusaw2iocTibY1JixQXuNo8=", + "dev": true, + "requires": { + "ansi-regex": "3.0.0" + } + }, + "strip-bom": { + "version": "3.0.0", + "resolved": "https://registry.npmjs.org/strip-bom/-/strip-bom-3.0.0.tgz", + "integrity": "sha1-IzTBjpx1n3vdVv3vfprj1YjmjtM=", + "dev": true + }, + "which-module": { + "version": "2.0.0", + "resolved": "https://registry.npmjs.org/which-module/-/which-module-2.0.0.tgz", + "integrity": "sha1-2e8H3Od7mQK4o6j6SzHD4/fm6Ho=", + "dev": true + }, + "yargs": { + "version": "10.0.3", + "resolved": "https://registry.npmjs.org/yargs/-/yargs-10.0.3.tgz", + "integrity": "sha512-DqBpQ8NAUX4GyPP/ijDGHsJya4tYqLQrjPr95HNsr1YwL3+daCfvBwg7+gIC6IdJhR2kATh3hb61vjzMWEtjdw==", + "dev": true, + "requires": { + "cliui": "3.2.0", + "decamelize": "1.2.0", + "find-up": "2.1.0", + "get-caller-file": "1.0.2", + "os-locale": "2.1.0", + "require-directory": "2.1.1", + "require-main-filename": "1.0.1", + "set-blocking": "2.0.0", + "string-width": "2.1.1", + "which-module": "2.0.0", + "y18n": "3.2.1", + "yargs-parser": "8.1.0" + } + }, + "yargs-parser": { + "version": "8.1.0", + "resolved": "https://registry.npmjs.org/yargs-parser/-/yargs-parser-8.1.0.tgz", + "integrity": "sha512-yP+6QqN8BmrgW2ggLtTbdrOyBNSI7zBa4IykmiV5R1wl1JWNxQvWhMfMdmzIYtKU7oP3OOInY/tl2ov3BDjnJQ==", + "dev": true, + "requires": { + "camelcase": "4.1.0" + } + } + } + }, + "jest-snapshot": { + "version": "22.0.3", + "resolved": "https://registry.npmjs.org/jest-snapshot/-/jest-snapshot-22.0.3.tgz", + "integrity": "sha512-e/a/EvMsY5XROWy4QWX6PvYziuJ8ttD6+QcnbogODWtx2LGhvVQOb7pmqGTo0tL/p0vzFetZA9GlZSh/EfMepg==", + "dev": true, + "requires": { + "chalk": "2.3.0", + "jest-diff": "22.0.3", + "jest-matcher-utils": "22.0.3", + "mkdirp": "0.5.1", + "natural-compare": "1.4.0", + "pretty-format": "22.0.3" + } + }, + "jest-util": { + "version": "22.0.4", + "resolved": "https://registry.npmjs.org/jest-util/-/jest-util-22.0.4.tgz", + "integrity": "sha512-gNNPtcCFkVh7daKIl3/06eoQ90QXGXCyDOfyZ3IEyTWmHBdX3GvklcOtyGcdOvrYEubaZTfMcMKmEeo/6sRTog==", + "dev": true, + "requires": { + "callsites": "2.0.0", + "chalk": "2.3.0", + "graceful-fs": "4.1.11", + "is-ci": "1.1.0", + "jest-message-util": "22.0.3", + "jest-validate": "22.0.3", + "mkdirp": "0.5.1" + }, + "dependencies": { + "callsites": { + "version": "2.0.0", + "resolved": "https://registry.npmjs.org/callsites/-/callsites-2.0.0.tgz", + "integrity": "sha1-BuuE8A7qQT2oav/vrL/7Ngk7PFA=", + "dev": true + } + } + }, + "jest-validate": { + "version": "22.0.3", + "resolved": "https://registry.npmjs.org/jest-validate/-/jest-validate-22.0.3.tgz", + "integrity": "sha512-GmlLmPCtrSQ3iB4A1uxcfjawaaQnwESCDcUg5tMxJKeBbmPdcWPAb6EWzvANxULPUV7hfPKLwg4xIPpi7cx1/g==", + "dev": true, + "requires": { + "chalk": "2.3.0", + "jest-get-type": "22.0.3", + "leven": "2.1.0", + "pretty-format": "22.0.3" + } + }, + "jest-worker": { + "version": "22.0.3", + "resolved": "https://registry.npmjs.org/jest-worker/-/jest-worker-22.0.3.tgz", + "integrity": "sha512-fPdCTnogFQiR0CP6whEsIly2RfcHxvalqyLjhui6qa1SnOmHiX7L8k4Umo8CBIp5ndWY0+ej1o7OTE5MlzPabg==", + "dev": true, + "requires": { + "merge-stream": "1.0.1" + } + }, + "jpegtran-bin": { + "version": "3.2.0", + "resolved": "https://registry.npmjs.org/jpegtran-bin/-/jpegtran-bin-3.2.0.tgz", + "integrity": "sha1-9g7PSumZwL2tLp+83ytvCYHnops=", + "dev": true, + "optional": true, + "requires": { + "bin-build": "2.2.0", + "bin-wrapper": "3.0.2", + "logalot": "2.1.0" + } + }, + "jquery": { + "version": "3.2.1", + "resolved": "https://registry.npmjs.org/jquery/-/jquery-3.2.1.tgz", + "integrity": "sha1-XE2d5lKvbNCncBVKYxu6ErAVx4c=", + "dev": true + }, + "js-base64": { + "version": "2.3.2", + "resolved": "https://registry.npmjs.org/js-base64/-/js-base64-2.3.2.tgz", + "integrity": "sha512-Y2/+DnfJJXT1/FCwUebUhLWb3QihxiSC42+ctHLGogmW2jPY6LCapMdFZXRvVP2z6qyKW7s6qncE/9gSqZiArw==", + "dev": true + }, + "js-stringify": { + "version": "1.0.2", + "resolved": "https://registry.npmjs.org/js-stringify/-/js-stringify-1.0.2.tgz", + "integrity": "sha1-Fzb939lyTyijaCrcYjCufk6Weds=", + "dev": true + }, + "js-tokens": { + "version": "3.0.2", + "resolved": "https://registry.npmjs.org/js-tokens/-/js-tokens-3.0.2.tgz", + "integrity": "sha1-mGbfOVECEw449/mWvOtlRDIJwls=", + "dev": true + }, + "js-yaml": { + "version": "3.7.0", + "resolved": "https://registry.npmjs.org/js-yaml/-/js-yaml-3.7.0.tgz", + "integrity": "sha1-XJZ93YN6m/3KXy3oQlOr6KHAO4A=", + "dev": true, + "requires": { + "argparse": "1.0.9", + "esprima": "2.7.3" + }, + "dependencies": { + "esprima": { + "version": "2.7.3", + "resolved": "https://registry.npmjs.org/esprima/-/esprima-2.7.3.tgz", + "integrity": "sha1-luO3DVd59q1JzQMmc9HDEnZ7pYE=", + "dev": true + } + } + }, + "jsbn": { + "version": "0.1.1", + "resolved": "https://registry.npmjs.org/jsbn/-/jsbn-0.1.1.tgz", + "integrity": "sha1-peZUwuWi3rXyAdls77yoDA7y9RM=", + "dev": true, + "optional": true + }, + "jsdom": { + "version": "11.5.1", + "resolved": "https://registry.npmjs.org/jsdom/-/jsdom-11.5.1.tgz", + "integrity": "sha512-89ztIZ03aYK9f1uUrLXLsZndRge/JnZjzjpaN+lrse3coqz+8PR/dX4WLHpbF5fIKTXhDjFODOJw2328lPJ90g==", + "dev": true, + "requires": { + "abab": "1.0.4", + "acorn": "5.3.0", + "acorn-globals": "4.1.0", + "array-equal": "1.0.0", + "browser-process-hrtime": "0.1.2", + "content-type-parser": "1.0.2", + "cssom": "0.3.2", + "cssstyle": "0.2.37", + "domexception": "1.0.0", + "escodegen": "1.9.0", + "html-encoding-sniffer": "1.0.2", + "left-pad": "1.2.0", + "nwmatcher": "1.4.3", + "parse5": "3.0.3", + "pn": "1.1.0", + "request": "2.83.0", + "request-promise-native": "1.0.5", + "sax": "1.2.4", + "symbol-tree": "3.2.2", + "tough-cookie": "2.3.3", + "webidl-conversions": "4.0.2", + "whatwg-encoding": "1.0.3", + "whatwg-url": "6.4.0", + "xml-name-validator": "2.0.1" + }, + "dependencies": { + "acorn": { + "version": "5.3.0", + "resolved": "https://registry.npmjs.org/acorn/-/acorn-5.3.0.tgz", + "integrity": "sha512-Yej+zOJ1Dm/IMZzzj78OntP/r3zHEaKcyNoU2lAaxPtrseM6rF0xwqoz5Q5ysAiED9hTjI2hgtvLXitlCN1/Ug==", + "dev": true + }, + "acorn-globals": { + "version": "4.1.0", + "resolved": "https://registry.npmjs.org/acorn-globals/-/acorn-globals-4.1.0.tgz", + "integrity": "sha512-KjZwU26uG3u6eZcfGbTULzFcsoz6pegNKtHPksZPOUsiKo5bUmiBPa38FuHZ/Eun+XYh/JCCkS9AS3Lu4McQOQ==", + "dev": true, + "requires": { + "acorn": "5.3.0" + } + }, + "ajv": { + "version": "5.5.2", + "resolved": "https://registry.npmjs.org/ajv/-/ajv-5.5.2.tgz", + "integrity": "sha1-c7Xuyj+rZT49P5Qis0GtQiBdyWU=", + "dev": true, + "requires": { + "co": "4.6.0", + "fast-deep-equal": "1.0.0", + "fast-json-stable-stringify": "2.0.0", + "json-schema-traverse": "0.3.1" + } + }, + "assert-plus": { + "version": "1.0.0", + "resolved": "https://registry.npmjs.org/assert-plus/-/assert-plus-1.0.0.tgz", + "integrity": "sha1-8S4PPF13sLHN2RRpQuTpbB5N1SU=", + "dev": true + }, + "aws-sign2": { + "version": "0.7.0", + "resolved": "https://registry.npmjs.org/aws-sign2/-/aws-sign2-0.7.0.tgz", + "integrity": "sha1-tG6JCTSpWR8tL2+G1+ap8bP+dqg=", + "dev": true + }, + "boom": { + "version": "4.3.1", + "resolved": "https://registry.npmjs.org/boom/-/boom-4.3.1.tgz", + "integrity": "sha1-T4owBctKfjiJ90kDD9JbluAdLjE=", + "dev": true, + "requires": { + "hoek": "4.2.0" + } + }, + "cryptiles": { + "version": "3.1.2", + "resolved": "https://registry.npmjs.org/cryptiles/-/cryptiles-3.1.2.tgz", + "integrity": "sha1-qJ+7Ig9c4l7FboxKqKT9e1sNKf4=", + "dev": true, + "requires": { + "boom": "5.2.0" + }, + "dependencies": { + "boom": { + "version": "5.2.0", + "resolved": "https://registry.npmjs.org/boom/-/boom-5.2.0.tgz", + "integrity": "sha512-Z5BTk6ZRe4tXXQlkqftmsAUANpXmuwlsF5Oov8ThoMbQRzdGTA1ngYRW160GexgOgjsFOKJz0LYhoNi+2AMBUw==", + "dev": true, + "requires": { + "hoek": "4.2.0" + } + } + } + }, + "escodegen": { + "version": "1.9.0", + "resolved": "https://registry.npmjs.org/escodegen/-/escodegen-1.9.0.tgz", + "integrity": "sha512-v0MYvNQ32bzwoG2OSFzWAkuahDQHK92JBN0pTAALJ4RIxEZe766QJPDR8Hqy7XNUy5K3fnVL76OqYAdc4TZEIw==", + "dev": true, + "requires": { + "esprima": "3.1.3", + "estraverse": "4.2.0", + "esutils": "2.0.2", + "optionator": "0.8.2", + "source-map": "0.5.7" + } + }, + "esprima": { + "version": "3.1.3", + "resolved": "https://registry.npmjs.org/esprima/-/esprima-3.1.3.tgz", + "integrity": "sha1-/cpRzuYTOJXjyI1TXOSdv/YqRjM=", + "dev": true + }, + "estraverse": { + "version": "4.2.0", + "resolved": "https://registry.npmjs.org/estraverse/-/estraverse-4.2.0.tgz", + "integrity": "sha1-De4/7TH81GlhjOc0IJn8GvoL2xM=", + "dev": true + }, + "form-data": { + "version": "2.3.1", + "resolved": "https://registry.npmjs.org/form-data/-/form-data-2.3.1.tgz", + "integrity": "sha1-b7lPvXGIUwbXPRXMSX/kzE7NRL8=", + "dev": true, + "requires": { + "asynckit": "0.4.0", + "combined-stream": "1.0.5", + "mime-types": "2.1.17" + } + }, + "har-schema": { + "version": "2.0.0", + "resolved": "https://registry.npmjs.org/har-schema/-/har-schema-2.0.0.tgz", + "integrity": "sha1-qUwiJOvKwEeCoNkDVSHyRzW37JI=", + "dev": true + }, + "har-validator": { + "version": "5.0.3", + "resolved": "https://registry.npmjs.org/har-validator/-/har-validator-5.0.3.tgz", + "integrity": "sha1-ukAsJmGU8VlW7xXg/PJCmT9qff0=", + "dev": true, + "requires": { + "ajv": "5.5.2", + "har-schema": "2.0.0" + } + }, + "hawk": { + "version": "6.0.2", + "resolved": "https://registry.npmjs.org/hawk/-/hawk-6.0.2.tgz", + "integrity": "sha512-miowhl2+U7Qle4vdLqDdPt9m09K6yZhkLDTWGoUiUzrQCn+mHHSmfJgAyGaLRZbPmTqfFFjRV1QWCW0VWUJBbQ==", + "dev": true, + "requires": { + "boom": "4.3.1", + "cryptiles": "3.1.2", + "hoek": "4.2.0", + "sntp": "2.1.0" + } + }, + "hoek": { + "version": "4.2.0", + "resolved": "https://registry.npmjs.org/hoek/-/hoek-4.2.0.tgz", + "integrity": "sha512-v0XCLxICi9nPfYrS9RL8HbYnXi9obYAeLbSP00BmnZwCK9+Ih9WOjoZ8YoHCoav2csqn4FOz4Orldsy2dmDwmQ==", + "dev": true + }, + "http-signature": { + "version": "1.2.0", + "resolved": "https://registry.npmjs.org/http-signature/-/http-signature-1.2.0.tgz", + "integrity": "sha1-muzZJRFHcvPZW2WmCruPfBj7rOE=", + "dev": true, + "requires": { + "assert-plus": "1.0.0", + "jsprim": "1.4.1", + "sshpk": "1.13.1" + } + }, + "performance-now": { + "version": "2.1.0", + "resolved": "https://registry.npmjs.org/performance-now/-/performance-now-2.1.0.tgz", + "integrity": "sha1-Ywn04OX6kT7BxpMHrjZLSzd8nns=", + "dev": true + }, + "qs": { + "version": "6.5.1", + "resolved": "https://registry.npmjs.org/qs/-/qs-6.5.1.tgz", + "integrity": "sha512-eRzhrN1WSINYCDCbrz796z37LOe3m5tmW7RQf6oBntukAG1nmovJvhnwHHRMAfeoItc1m2Hk02WER2aQ/iqs+A==", + "dev": true + }, + "request": { + "version": "2.83.0", + "resolved": "https://registry.npmjs.org/request/-/request-2.83.0.tgz", + "integrity": "sha512-lR3gD69osqm6EYLk9wB/G1W/laGWjzH90t1vEa2xuxHD5KUrSzp9pUSfTm+YC5Nxt2T8nMPEvKlhbQayU7bgFw==", + "dev": true, + "requires": { + "aws-sign2": "0.7.0", + "aws4": "1.6.0", + "caseless": "0.12.0", + "combined-stream": "1.0.5", + "extend": "3.0.1", + "forever-agent": "0.6.1", + "form-data": "2.3.1", + "har-validator": "5.0.3", + "hawk": "6.0.2", + "http-signature": "1.2.0", + "is-typedarray": "1.0.0", + "isstream": "0.1.2", + "json-stringify-safe": "5.0.1", + "mime-types": "2.1.17", + "oauth-sign": "0.8.2", + "performance-now": "2.1.0", + "qs": "6.5.1", + "safe-buffer": "5.1.1", + "stringstream": "0.0.5", + "tough-cookie": "2.3.3", + "tunnel-agent": "0.6.0", + "uuid": "3.1.0" + } + }, + "sntp": { + "version": "2.1.0", + "resolved": "https://registry.npmjs.org/sntp/-/sntp-2.1.0.tgz", + "integrity": "sha512-FL1b58BDrqS3A11lJ0zEdnJ3UOKqVxawAkF3k7F0CVN7VQ34aZrV+G8BZ1WC9ZL7NyrwsW0oviwsWDgRuVYtJg==", + "dev": true, + "requires": { + "hoek": "4.2.0" } + }, + "source-map": { + "version": "0.5.7", + "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.5.7.tgz", + "integrity": "sha1-igOdLRAh0i0eoUyA2OpGi6LvP8w=", + "dev": true, + "optional": true } } }, - "jpegtran-bin": { - "version": "3.2.0", - "resolved": "https://registry.npmjs.org/jpegtran-bin/-/jpegtran-bin-3.2.0.tgz", - "integrity": "sha1-9g7PSumZwL2tLp+83ytvCYHnops=", - "dev": true, - "optional": true, - "requires": { - "bin-build": "2.2.0", - "bin-wrapper": "3.0.2", - "logalot": "2.1.0" - } - }, - "jquery": { - "version": "3.2.1", - "resolved": "https://registry.npmjs.org/jquery/-/jquery-3.2.1.tgz", - "integrity": "sha1-XE2d5lKvbNCncBVKYxu6ErAVx4c=", - "dev": true - }, - "js-base64": { - "version": "2.3.2", - "resolved": "https://registry.npmjs.org/js-base64/-/js-base64-2.3.2.tgz", - "integrity": "sha512-Y2/+DnfJJXT1/FCwUebUhLWb3QihxiSC42+ctHLGogmW2jPY6LCapMdFZXRvVP2z6qyKW7s6qncE/9gSqZiArw==", - "dev": true - }, - "js-stringify": { - "version": "1.0.2", - "resolved": "https://registry.npmjs.org/js-stringify/-/js-stringify-1.0.2.tgz", - "integrity": "sha1-Fzb939lyTyijaCrcYjCufk6Weds=", - "dev": true - }, - "js-tokens": { - "version": "3.0.2", - "resolved": "https://registry.npmjs.org/js-tokens/-/js-tokens-3.0.2.tgz", - "integrity": "sha1-mGbfOVECEw449/mWvOtlRDIJwls=", - "dev": true - }, - "js-yaml": { - "version": "3.7.0", - "resolved": "https://registry.npmjs.org/js-yaml/-/js-yaml-3.7.0.tgz", - "integrity": "sha1-XJZ93YN6m/3KXy3oQlOr6KHAO4A=", - "dev": true, - "requires": { - "argparse": "1.0.9", - "esprima": "2.7.3" - }, - "dependencies": { - "esprima": { - "version": "2.7.3", - "resolved": "https://registry.npmjs.org/esprima/-/esprima-2.7.3.tgz", - "integrity": "sha1-luO3DVd59q1JzQMmc9HDEnZ7pYE=", - "dev": true - } - } - }, - "jsbn": { - "version": "0.1.1", - "resolved": "https://registry.npmjs.org/jsbn/-/jsbn-0.1.1.tgz", - "integrity": "sha1-peZUwuWi3rXyAdls77yoDA7y9RM=", - "dev": true, - "optional": true - }, "jsesc": { "version": "1.3.0", "resolved": "https://registry.npmjs.org/jsesc/-/jsesc-1.3.0.tgz", @@ -8046,6 +9289,18 @@ "invert-kv": "1.0.0" } }, + "left-pad": { + "version": "1.2.0", + "resolved": "https://registry.npmjs.org/left-pad/-/left-pad-1.2.0.tgz", + "integrity": "sha1-0wpzxrggHY99jnlWupYWCHpo4O4=", + "dev": true + }, + "leven": { + "version": "2.1.0", + "resolved": "https://registry.npmjs.org/leven/-/leven-2.1.0.tgz", + "integrity": "sha1-wuep93IJTe6dNCAq6KzORoeHVYA=", + "dev": true + }, "levn": { "version": "0.3.0", "resolved": "https://registry.npmjs.org/levn/-/levn-0.3.0.tgz", @@ -8138,6 +9393,24 @@ } } }, + "locate-path": { + "version": "2.0.0", + "resolved": "https://registry.npmjs.org/locate-path/-/locate-path-2.0.0.tgz", + "integrity": "sha1-K1aLJl7slExtnA3pw9u7ygNUzY4=", + "dev": true, + "requires": { + "p-locate": "2.0.0", + "path-exists": "3.0.0" + }, + "dependencies": { + "path-exists": { + "version": "3.0.0", + "resolved": "https://registry.npmjs.org/path-exists/-/path-exists-3.0.0.tgz", + "integrity": "sha1-zg6+ql94yxiSXqfYENe1mwEP1RU=", + "dev": true + } + } + }, "lodash": { "version": "4.17.4", "resolved": "https://registry.npmjs.org/lodash/-/lodash-4.17.4.tgz", @@ -8665,6 +9938,15 @@ "kind-of": "3.2.2" } }, + "makeerror": { + "version": "1.0.11", + "resolved": "https://registry.npmjs.org/makeerror/-/makeerror-1.0.11.tgz", + "integrity": "sha1-4BpckQnyr3lmDk6LlYd5AYT1qWw=", + "dev": true, + "requires": { + "tmpl": "1.0.4" + } + }, "map-cache": { "version": "0.2.2", "resolved": "https://registry.npmjs.org/map-cache/-/map-cache-0.2.2.tgz", @@ -8790,6 +10072,15 @@ "integrity": "sha1-pp2dp2hHtNWDTBRl6iXAZTofv2Y=", "dev": true }, + "mem": { + "version": "1.1.0", + "resolved": "https://registry.npmjs.org/mem/-/mem-1.1.0.tgz", + "integrity": "sha1-Xt1StIXKHZAP5kiVUFOZoN+kX3Y=", + "dev": true, + "requires": { + "mimic-fn": "1.1.0" + } + }, "memoizee": { "version": "0.4.11", "resolved": "https://registry.npmjs.org/memoizee/-/memoizee-0.4.11.tgz", @@ -8824,6 +10115,12 @@ "trim-newlines": "1.0.0" } }, + "merge": { + "version": "1.2.0", + "resolved": "https://registry.npmjs.org/merge/-/merge-1.2.0.tgz", + "integrity": "sha1-dTHjnUlJwoGma4xabgJl6LBYlNo=", + "dev": true + }, "merge-stream": { "version": "1.0.1", "resolved": "https://registry.npmjs.org/merge-stream/-/merge-stream-1.0.1.tgz", @@ -9170,6 +10467,12 @@ } } }, + "node-int64": { + "version": "0.4.0", + "resolved": "https://registry.npmjs.org/node-int64/-/node-int64-0.4.0.tgz", + "integrity": "sha1-h6kGXNs1XTGC2PlM4RGIuCXGijs=", + "dev": true + }, "node-notifier": { "version": "5.1.2", "resolved": "https://registry.npmjs.org/node-notifier/-/node-notifier-5.1.2.tgz", @@ -9465,6 +10768,12 @@ "integrity": "sha1-CXtgK1NCKlIsGvuHkDGDNpQaAR0=", "dev": true }, + "nwmatcher": { + "version": "1.4.3", + "resolved": "https://registry.npmjs.org/nwmatcher/-/nwmatcher-1.4.3.tgz", + "integrity": "sha512-IKdSTiDWCarf2JTS5e9e2+5tPZGdkRJ79XjYV0pzK8Q9BpsFyBq1RGKxzs7Q8UBushGw7m6TzVKz6fcY99iSWw==", + "dev": true + }, "oauth-sign": { "version": "0.8.2", "resolved": "https://registry.npmjs.org/oauth-sign/-/oauth-sign-0.8.2.tgz", @@ -9768,6 +11077,24 @@ "integrity": "sha1-P7z7FbiZpEEjs0ttzBi3JDNqLK4=", "dev": true }, + "p-limit": { + "version": "1.2.0", + "resolved": "https://registry.npmjs.org/p-limit/-/p-limit-1.2.0.tgz", + "integrity": "sha512-Y/OtIaXtUPr4/YpMv1pCL5L5ed0rumAaAeBSj12F+bSlMdys7i8oQF/GUJmfpTS/QoaRrS/k6pma29haJpsMng==", + "dev": true, + "requires": { + "p-try": "1.0.0" + } + }, + "p-locate": { + "version": "2.0.0", + "resolved": "https://registry.npmjs.org/p-locate/-/p-locate-2.0.0.tgz", + "integrity": "sha1-IKAQOyIqcMj9OcwuWAaA893l7EM=", + "dev": true, + "requires": { + "p-limit": "1.2.0" + } + }, "p-map": { "version": "1.2.0", "resolved": "https://registry.npmjs.org/p-map/-/p-map-1.2.0.tgz", @@ -9780,6 +11107,12 @@ "integrity": "sha1-SxoROZoRUgpneQ7loMHViB1r7+k=", "dev": true }, + "p-try": { + "version": "1.0.0", + "resolved": "https://registry.npmjs.org/p-try/-/p-try-1.0.0.tgz", + "integrity": "sha1-y8ec26+P1CKOE/Yh8rGiN8GyB7M=", + "dev": true + }, "pako": { "version": "1.0.6", "resolved": "https://registry.npmjs.org/pako/-/pako-1.0.6.tgz", @@ -9867,6 +11200,15 @@ "integrity": "sha1-bVuTSkVpk7I9N/QKOC1vFmao5cY=", "dev": true }, + "parse5": { + "version": "3.0.3", + "resolved": "https://registry.npmjs.org/parse5/-/parse5-3.0.3.tgz", + "integrity": "sha512-rgO9Zg5LLLkfJF9E6CCmXlSE4UVceloys8JrFqCcHloC3usd/kJCyPDwH2SOlzix2j3xaP9sUX3e8+kvkuleAA==", + "dev": true, + "requires": { + "@types/node": "8.5.7" + } + }, "parsejson": { "version": "0.0.3", "resolved": "https://registry.npmjs.org/parsejson/-/parsejson-0.0.3.tgz", @@ -10122,6 +11464,12 @@ "integrity": "sha512-ARhBOdzS3e41FbkW/XWrTEtukqqLoK5+Z/4UeDaLuSW+39JPeFgs4gCGqsrJHVZX0fUrx//4OF0K1CUGwlIFow==", "dev": true }, + "pn": { + "version": "1.1.0", + "resolved": "https://registry.npmjs.org/pn/-/pn-1.1.0.tgz", + "integrity": "sha512-2qHaIQr2VLRFoxe2nASzsV6ef4yOOH+Fi9FBOVH6cqeSgUnoyySPZkxzLuzd+RYOQTRpROA0ztTMqxROKSb/nA==", + "dev": true + }, "pngquant-bin": { "version": "3.1.1", "resolved": "https://registry.npmjs.org/pngquant-bin/-/pngquant-bin-3.1.1.tgz", @@ -12126,6 +13474,24 @@ "integrity": "sha1-sr+C5zUNZcbDOqlaqlpPYyf2HNk=", "dev": true }, + "pretty-format": { + "version": "22.0.3", + "resolved": "https://registry.npmjs.org/pretty-format/-/pretty-format-22.0.3.tgz", + "integrity": "sha512-qXbDFJ2/Kk3HFIaLdOblbsCKQ09kZu4MKbXB+m/EaqD7PZ/wXe2XcRREmQleMh4wmerxlma6eJTh3nxCXYUmmA==", + "dev": true, + "requires": { + "ansi-regex": "3.0.0", + "ansi-styles": "3.2.0" + }, + "dependencies": { + "ansi-regex": { + "version": "3.0.0", + "resolved": "https://registry.npmjs.org/ansi-regex/-/ansi-regex-3.0.0.tgz", + "integrity": "sha1-7QMXwyIGT3lGbAKWa922Bas32Zg=", + "dev": true + } + } + }, "pretty-hrtime": { "version": "1.0.3", "resolved": "https://registry.npmjs.org/pretty-hrtime/-/pretty-hrtime-1.0.3.tgz", @@ -12672,6 +14038,15 @@ "set-immediate-shim": "1.0.1" } }, + "realpath-native": { + "version": "1.0.0", + "resolved": "https://registry.npmjs.org/realpath-native/-/realpath-native-1.0.0.tgz", + "integrity": "sha512-XJtlRJ9jf0E1H1SLeJyQ9PGzQD7S65h1pRXEcAeK48doKOnKxcgPeNohJvD5u/2sI9J1oke6E8bZHS/fmW1UiQ==", + "dev": true, + "requires": { + "util.promisify": "1.0.0" + } + }, "rechoir": { "version": "0.6.2", "resolved": "https://registry.npmjs.org/rechoir/-/rechoir-0.6.2.tgz", @@ -12941,6 +14316,26 @@ } } }, + "request-promise-core": { + "version": "1.1.1", + "resolved": "https://registry.npmjs.org/request-promise-core/-/request-promise-core-1.1.1.tgz", + "integrity": "sha1-Pu4AssWqgyOc+wTFcA2jb4HNCLY=", + "dev": true, + "requires": { + "lodash": "4.17.4" + } + }, + "request-promise-native": { + "version": "1.0.5", + "resolved": "https://registry.npmjs.org/request-promise-native/-/request-promise-native-1.0.5.tgz", + "integrity": "sha1-UoF3D2jgyXGeUWP9P6tIIhX0/aU=", + "dev": true, + "requires": { + "request-promise-core": "1.1.1", + "stealthy-require": "1.1.1", + "tough-cookie": "2.3.3" + } + }, "require-coercible-to-string-x": { "version": "1.0.0", "resolved": "https://registry.npmjs.org/require-coercible-to-string-x/-/require-coercible-to-string-x-1.0.0.tgz", @@ -13127,6 +14522,21 @@ "integrity": "sha512-kKvNJn6Mm93gAczWVJg7wH+wGYWNrDHdWvpUmHyEsgCtIwwo3bqPtV4tR5tuPaUhTOo/kvhVwd8XwwOllGYkbg==", "dev": true }, + "sane": { + "version": "2.2.0", + "resolved": "https://registry.npmjs.org/sane/-/sane-2.2.0.tgz", + "integrity": "sha512-OSJxhHO0CgPUw3lUm3GhfREAfza45smvEI9ozuFrxKG10GHVo0ryW9FK5VYlLvxj0SV7HVKHW0voYJIRu27GWg==", + "dev": true, + "requires": { + "anymatch": "1.3.2", + "exec-sh": "0.2.1", + "fb-watchman": "2.0.0", + "minimatch": "3.0.4", + "minimist": "1.2.0", + "walker": "1.0.7", + "watch": "0.18.0" + } + }, "sass-graph": { "version": "2.2.4", "resolved": "https://registry.npmjs.org/sass-graph/-/sass-graph-2.2.4.tgz", @@ -13811,6 +15221,12 @@ "integrity": "sha1-qPbq7KkGdMMz58Q5U/J1tFFRBpU=", "dev": true }, + "stack-utils": { + "version": "1.0.1", + "resolved": "https://registry.npmjs.org/stack-utils/-/stack-utils-1.0.1.tgz", + "integrity": "sha1-1PM6tU6OOHeLDKXP07OvsS22hiA=", + "dev": true + }, "stat-mode": { "version": "0.2.2", "resolved": "https://registry.npmjs.org/stat-mode/-/stat-mode-0.2.2.tgz", @@ -13832,6 +15248,12 @@ "readable-stream": "2.3.3" } }, + "stealthy-require": { + "version": "1.1.1", + "resolved": "https://registry.npmjs.org/stealthy-require/-/stealthy-require-1.1.1.tgz", + "integrity": "sha1-NbCYdbT/SfJqd35QmzCQoyJr8ks=", + "dev": true + }, "stream-browserify": { "version": "2.0.1", "resolved": "https://registry.npmjs.org/stream-browserify/-/stream-browserify-2.0.1.tgz", @@ -13903,6 +15325,33 @@ "integrity": "sha1-J5siXfHVgrH1TmWt3UNS4Y+qBxM=", "dev": true }, + "string-length": { + "version": "2.0.0", + "resolved": "https://registry.npmjs.org/string-length/-/string-length-2.0.0.tgz", + "integrity": "sha1-1A27aGo6zpYMHP/KVivyxF+DY+0=", + "dev": true, + "requires": { + "astral-regex": "1.0.0", + "strip-ansi": "4.0.0" + }, + "dependencies": { + "ansi-regex": { + "version": "3.0.0", + "resolved": "https://registry.npmjs.org/ansi-regex/-/ansi-regex-3.0.0.tgz", + "integrity": "sha1-7QMXwyIGT3lGbAKWa922Bas32Zg=", + "dev": true + }, + "strip-ansi": { + "version": "4.0.0", + "resolved": "https://registry.npmjs.org/strip-ansi/-/strip-ansi-4.0.0.tgz", + "integrity": "sha1-qEeQIusaw2iocTibY1JixQXuNo8=", + "dev": true, + "requires": { + "ansi-regex": "3.0.0" + } + } + } + }, "string-width": { "version": "1.0.2", "resolved": "https://registry.npmjs.org/string-width/-/string-width-1.0.2.tgz", @@ -14148,6 +15597,12 @@ "whet.extend": "0.9.9" } }, + "symbol-tree": { + "version": "3.2.2", + "resolved": "https://registry.npmjs.org/symbol-tree/-/symbol-tree-3.2.2.tgz", + "integrity": "sha1-rifbOPZgp64uHDt9G8KQgZuFGeY=", + "dev": true + }, "syntax-error": { "version": "1.3.0", "resolved": "https://registry.npmjs.org/syntax-error/-/syntax-error-1.3.0.tgz", @@ -14284,6 +15739,19 @@ "through2": "2.0.3" } }, + "test-exclude": { + "version": "4.1.1", + "resolved": "https://registry.npmjs.org/test-exclude/-/test-exclude-4.1.1.tgz", + "integrity": "sha512-35+Asrsk3XHJDBgf/VRFexPgh3UyETv8IAn/LRTiZjVy6rjPVqdEk8dJcJYBzl1w0XCJM48lvTy8SfEsCWS4nA==", + "dev": true, + "requires": { + "arrify": "1.0.1", + "micromatch": "2.3.11", + "object-assign": "4.1.1", + "read-pkg-up": "1.0.1", + "require-main-filename": "1.0.1" + } + }, "text-table": { "version": "0.2.0", "resolved": "https://registry.npmjs.org/text-table/-/text-table-0.2.0.tgz", @@ -14327,6 +15795,12 @@ } } }, + "throat": { + "version": "4.1.0", + "resolved": "https://registry.npmjs.org/throat/-/throat-4.1.0.tgz", + "integrity": "sha1-iQN8vJLFarGJJua6TLsgDhVnKmo=", + "dev": true + }, "through": { "version": "2.3.8", "resolved": "https://registry.npmjs.org/through/-/through-2.3.8.tgz", @@ -14411,6 +15885,12 @@ "os-tmpdir": "1.0.2" } }, + "tmpl": { + "version": "1.0.4", + "resolved": "https://registry.npmjs.org/tmpl/-/tmpl-1.0.4.tgz", + "integrity": "sha1-I2QN17QtAEM5ERQIIOXPRA5SHdE=", + "dev": true + }, "to-absolute-glob": { "version": "0.1.1", "resolved": "https://registry.npmjs.org/to-absolute-glob/-/to-absolute-glob-0.1.1.tgz", @@ -14562,6 +16042,23 @@ "punycode": "1.4.1" } }, + "tr46": { + "version": "1.0.1", + "resolved": "https://registry.npmjs.org/tr46/-/tr46-1.0.1.tgz", + "integrity": "sha1-qLE/1r/SSJUZZ0zN5VujaTtwbQk=", + "dev": true, + "requires": { + "punycode": "2.1.0" + }, + "dependencies": { + "punycode": { + "version": "2.1.0", + "resolved": "https://registry.npmjs.org/punycode/-/punycode-2.1.0.tgz", + "integrity": "sha1-X4Y+3Im5bbCQdLrXlHvwkFbKTn0=", + "dev": true + } + } + }, "transformers": { "version": "2.1.0", "resolved": "https://registry.npmjs.org/transformers/-/transformers-2.1.0.tgz", @@ -15232,6 +16729,15 @@ "integrity": "sha1-wGavtYK7HLQSjWDqkjkulNXp2+w=", "dev": true }, + "walker": { + "version": "1.0.7", + "resolved": "https://registry.npmjs.org/walker/-/walker-1.0.7.tgz", + "integrity": "sha1-L3+bj9ENZ3JisYqITijRlhjgKPs=", + "dev": true, + "requires": { + "makeerror": "1.0.11" + } + }, "ware": { "version": "1.3.0", "resolved": "https://registry.npmjs.org/ware/-/ware-1.3.0.tgz", @@ -15241,6 +16747,16 @@ "wrap-fn": "0.1.5" } }, + "watch": { + "version": "0.18.0", + "resolved": "https://registry.npmjs.org/watch/-/watch-0.18.0.tgz", + "integrity": "sha1-KAlUdsbffJDJYxOJkMClQj60uYY=", + "dev": true, + "requires": { + "exec-sh": "0.2.1", + "minimist": "1.2.0" + } + }, "watchify": { "version": "3.9.0", "resolved": "https://registry.npmjs.org/watchify/-/watchify-3.9.0.tgz", @@ -15256,6 +16772,12 @@ "xtend": "4.0.1" } }, + "webidl-conversions": { + "version": "4.0.2", + "resolved": "https://registry.npmjs.org/webidl-conversions/-/webidl-conversions-4.0.2.tgz", + "integrity": "sha512-YQ+BmxuTgd6UXZW3+ICGfyqRyHXVlD5GtQr5+qjiNW7bF0cqrzX500HVXPBOvgXb5YnzDd+h0zqyv61KUD7+Sg==", + "dev": true + }, "weinre": { "version": "2.0.0-pre-I0Z7U9OV", "resolved": "https://registry.npmjs.org/weinre/-/weinre-2.0.0-pre-I0Z7U9OV.tgz", @@ -15267,6 +16789,26 @@ "underscore": "1.7.0" } }, + "whatwg-encoding": { + "version": "1.0.3", + "resolved": "https://registry.npmjs.org/whatwg-encoding/-/whatwg-encoding-1.0.3.tgz", + "integrity": "sha512-jLBwwKUhi8WtBfsMQlL4bUUcT8sMkAtQinscJAe/M4KHCkHuUJAF6vuB0tueNIw4c8ziO6AkRmgY+jL3a0iiPw==", + "dev": true, + "requires": { + "iconv-lite": "0.4.19" + } + }, + "whatwg-url": { + "version": "6.4.0", + "resolved": "https://registry.npmjs.org/whatwg-url/-/whatwg-url-6.4.0.tgz", + "integrity": "sha512-Z0CVh/YE217Foyb488eo+iBv+r7eAQ0wSTyApi9n06jhcA3z6Nidg/EGvl0UFkg7kMdKxfBzzr+o9JF+cevgMg==", + "dev": true, + "requires": { + "lodash.sortby": "4.7.0", + "tr46": "1.0.1", + "webidl-conversions": "4.0.2" + } + }, "whet.extend": { "version": "0.9.9", "resolved": "https://registry.npmjs.org/whet.extend/-/whet.extend-0.9.9.tgz", @@ -15397,6 +16939,17 @@ "mkdirp": "0.5.1" } }, + "write-file-atomic": { + "version": "2.3.0", + "resolved": "https://registry.npmjs.org/write-file-atomic/-/write-file-atomic-2.3.0.tgz", + "integrity": "sha512-xuPeK4OdjWqtfi59ylvVL0Yn35SF3zgcAcv7rBPFHVaEapaDr4GdGgm3j7ckTwH9wHL7fGmgfAnb0+THrHb8tA==", + "dev": true, + "requires": { + "graceful-fs": "4.1.11", + "imurmurhash": "0.1.4", + "signal-exit": "3.0.2" + } + }, "ws": { "version": "1.1.1", "resolved": "https://registry.npmjs.org/ws/-/ws-1.1.1.tgz", @@ -15419,6 +16972,12 @@ "integrity": "sha1-ZGV4SKIP/F31g6Qq2KJ3tFErvE0=", "dev": true }, + "xml-name-validator": { + "version": "2.0.1", + "resolved": "https://registry.npmjs.org/xml-name-validator/-/xml-name-validator-2.0.1.tgz", + "integrity": "sha1-TYuPHszTQZqjYgYb7O9RXh5VljU=", + "dev": true + }, "xmlhttprequest-ssl": { "version": "1.5.3", "resolved": "https://registry.npmjs.org/xmlhttprequest-ssl/-/xmlhttprequest-ssl-1.5.3.tgz", diff --git a/package.json b/package.json index 3d9cff0..2306d0c 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "mq-scss", - "version": "2.1.1", + "version": "2.1.2", "description": "An extremely powerful but easy to use Sass media query mixin that allows you to create almost any media query you can imagine.", "main": "_mq.scss", "repository": { @@ -22,6 +22,9 @@ "bugs": { "url": "https://github.com/Dan503/mq-scss/issues" }, + "scripts": { + "test": "jest" + }, "homepage": "https://github.com/Dan503/mq-scss#readme", "devDependencies": { "autoprefixer": "^7.1.6", @@ -59,6 +62,7 @@ "gulp-pug": "^3.3.0", "gulp-rename": "^1.2.2", "gulp-sass": "^3.1.0", + "gulp-sass-glob": "^1.0.8", "gulp-sourcemaps": "^2.6.1", "gulp-svg-symbols": "^2.0.2", "gulp-uglify": "^3.0.0", @@ -66,6 +70,7 @@ "gulp-wait": "0.0.2", "imagemin-pngquant": "^5.0.1", "imagemin-svgo": "^6.0.0", + "jest": "^22.0.4", "jquery": "^3.2.1", "jstransformer-marked": "^1.0.2", "minimist": "^1.2.0", diff --git a/src/_layouts/base.pug b/src/_layouts/base.pug index d2a9647..67f1af0 100644 --- a/src/_layouts/base.pug +++ b/src/_layouts/base.pug @@ -25,6 +25,7 @@ head block stylesheets link(rel='stylesheet', href= 'assets/styles/main.css') + link(rel='stylesheet', href= 'assets/styles/test-styles.css') //- Google Analytics script. diff --git a/src/_modules/breakpoints/breakpoints.pug b/src/_modules/breakpoints/breakpoints.pug new file mode 100644 index 0000000..0a6b861 --- /dev/null +++ b/src/_modules/breakpoints/breakpoints.pug @@ -0,0 +1,9 @@ + +mixin breakpoints + .breakpoints&attributes(attributes) + h2 Breakpoints + .breakpoints__size.-minimum + .breakpoints__size.-small + .breakpoints__size.-medium + .breakpoints__size.-large + .breakpoints__size.-page diff --git a/src/_modules/breakpoints/breakpoints.scss b/src/_modules/breakpoints/breakpoints.scss new file mode 100644 index 0000000..3c6b401 --- /dev/null +++ b/src/_modules/breakpoints/breakpoints.scss @@ -0,0 +1,20 @@ + +.breakpoints { + padding: 20px; + border: 2px solid #000; + + &__size { + @each $name, $value in $breakpoints { + &.-#{$name} { + &::before { + content: 'BP-#{$name}: '; + } + &::after { + content: '#{$value}'; + font-weight: bold; + font-size: 1.2em; + } + } + } + } +} diff --git a/src/_modules/tests/tests.pug b/src/_modules/tests/tests.pug index e8937ef..97208f9 100644 --- a/src/_modules/tests/tests.pug +++ b/src/_modules/tests/tests.pug @@ -1,10 +1,61 @@ -.breakpoints - h2 Breakpoints - .breakpoints__size.-minimum - .breakpoints__size.-small - .breakpoints__size.-medium - .breakpoints__size.-large - .breakpoints__size.-page + +//-width +include ../../../unit-tests/width/max/max +include ../../../unit-tests/width/maxWidth/maxWidth +include ../../../unit-tests/width/maxVar/maxVar +include ../../../unit-tests/width/min/min +include ../../../unit-tests/width/minWidth/minWidth +include ../../../unit-tests/width/minVar/minVar +include ../../../unit-tests/width/inside/inside +include ../../../unit-tests/width/insideWidth/insideWidth +include ../../../unit-tests/width/insideVar/insideVar +include ../../../unit-tests/width/outside/outside +include ../../../unit-tests/width/outsideWidth/outsideWidth +include ../../../unit-tests/width/outsideVar/outsideVar + +//-height +include ../../../unit-tests/height/maxHeight/maxHeight +include ../../../unit-tests/height/maxHeightVar/maxHeightVar +include ../../../unit-tests/height/minHeight/minHeight +include ../../../unit-tests/height/minHeightVar/minHeightVar +include ../../../unit-tests/height/insideHeight/insideHeight +include ../../../unit-tests/height/insideHeightVar/insideHeightVar +include ../../../unit-tests/height/outsideHeight/outsideHeight +include ../../../unit-tests/height/outsideHeightVar/outsideHeightVar + +//-ratio +include ../../../unit-tests/ratio/ratio/ratio +include ../../../unit-tests/ratio/ratioVar/ratioVar +include ../../../unit-tests/ratio/minRatio/minRatio +include ../../../unit-tests/ratio/minRatioVar/minRatioVar +include ../../../unit-tests/ratio/maxRatio/maxRatio +include ../../../unit-tests/ratio/maxRatioVar/maxRatioVar +include ../../../unit-tests/ratio/insideRatio/insideRatio +include ../../../unit-tests/ratio/insideRatioVar/insideRatioVar +include ../../../unit-tests/ratio/outsideRatio/outsideRatio +include ../../../unit-tests/ratio/outsideRatioVar/outsideRatioVar +include ../../../unit-tests/ratio/exactRatioWorkAround1/exactRatioWorkAround1 +include ../../../unit-tests/ratio/exactRatioWorkAround2/exactRatioWorkAround2 +include ../../../unit-tests/ratio/exactRatioWorkAround3/exactRatioWorkAround3 + +//-Media statements +include ../../../unit-tests/media/simpleMedia/simpleMedia +include ../../../unit-tests/media/notMedia/notMedia +include ../../../unit-tests/media/onlyMedia/onlyMedia + +//- Plus statements +include ../../../unit-tests/plus/simplePlus/simplePlus +include ../../../unit-tests/plus/inlinePlus/inlinePlus +include ../../../unit-tests/plus/mediaOnlyPlus/mediaOnlyPlus +include ../../../unit-tests/plus/complexPlus/complexPlus +include ../../../unit-tests/plus/ignoredMediaType/ignoredMediaType +include ../../../unit-tests/plus/multiPlus/multiPlus + +//- Or statements +include ../../../unit-tests/or/simpleOr/simpleOr +include ../../../unit-tests/or/complexOr/complexOr +include ../../../unit-tests/or/multiOr/multiOr +include ../../../unit-tests/or/orPlusCombo/orPlusCombo h2#tests Tests @@ -41,592 +92,82 @@ ol h3#width Width .tests - //-max - +demo({ - html: ` -.test.-max -`, - scss: ` -@include mq(max, $BP-medium) { - background: $green; -}`, - }) - - //-maxWidth - +demo({ - html: ` -.test.-maxWidth -`, - scss: ` -@include mq(max-width, $BP-medium) { - background: $green; -}`, - }) - - //-maxVar - +demo({ - html: ` -.test.-maxVar -`, - scss: ` -$MQ-maxVar: (max, $BP-medium); -@include mq($MQ-maxVar) { - background: $green; -}`, - }) - - //-min - +demo({ - html: ` -.test.-min -`, - scss: ` -@include mq(min, $BP-medium) { - background: $green; -}`, - }) - - //-minWidth - +demo({ - html: ` -.test.-minWidth -`, - scss: ` -@include mq(min-width, $BP-medium) { - background: $green; -}`, - }) - - //-minVar - +demo({ - html: ` -.test.-minVar -`, - scss: ` -$MQ-minVar: (min, $BP-medium); -@include mq($MQ-minVar) { - background: $green; -}`, - }) - - //-inside - +demo({ - html: ` -.test.-inside -`, - scss: ` -@include mq(inside, $BP-medium, $BP-small) { - background: $green; -}`, - }) - - //-insideWidth - +demo({ - html: ` -.test.-insideWidth -`, - scss: ` -@include mq(inside-width, $BP-small, $BP-medium) { - background: $green; -}`, - }) - - //-insideVar - +demo({ - html: ` -.test.-insideVar -`, - scss: ` -$MQ-insideVar: (inside, $BP-medium, $BP-small); -@include mq($MQ-insideVar) { - background: $green; -}`, - }) - - //-outside - +demo({ - html: ` -.test.-outside -`, - scss: ` -@include mq(outside, $BP-medium, $BP-small) { - background: $green; -}`, - }) - - //-outsideWidth - +demo({ - html: ` -.test.-outsideWidth -`, - scss: ` -@include mq(outside-width, $BP-small, $BP-medium) { - background: $green; -}`, - }) - - //-outsideVar - +demo({ - html: ` -.test.-outsideVar -`, - scss: ` -$MQ-outsideVar: (outside, $BP-medium, $BP-small); -@include mq($MQ-outsideVar) { - background: $green; -}`, - }) + +max + +maxWidth + +maxVar + +min + +minWidth + +minVar + +inside + +insideWidth + +insideVar + +outside + +outsideWidth + +outsideVar //- ====== //- HEIGHT //- ====== h3#height Height - //-maxHeight - +demo({ - html: ` -.test.-maxHeight -`, - scss: ` -@include mq(max-height, $BP-medium) { - background: $green; -}`, - }) - - //-maxHeightVar - +demo({ - html: ` -.test.-maxHeightVar -`, - scss: ` -$MQ-maxHeightVar: (max-height, $BP-medium); -@include mq($MQ-maxHeightVar) { - background: $green; -}`, - }) - - //-minHeight - +demo({ - html: ` -.test.-minHeight -`, - scss: ` -@include mq(min-height, $BP-medium) { - background: $green; -}`, - }) - - //-minHeightVar - +demo({ - html: ` -.test.-minHeightVar -`, - scss: ` -$MQ-minHeightVar: (min-height, $BP-medium); -@include mq($MQ-minHeightVar) { - background: $green; -}`, - }) - - //-insideHeight - +demo({ - html: ` -.test.-insideHeight -`, - scss: ` -@include mq(inside-height, $BP-small, $BP-medium) { - background: $green; -}`, - }) - - //-insideHeightVar - +demo({ - html: ` -.test.-insideHeightVar -`, - scss: ` -$MQ-insideHeightVar: (inside-height, $BP-small, $BP-medium); -@include mq($MQ-insideHeightVar) { - background: $green; -}`, - }) - - //-outsideHeight - +demo({ - html: ` -.test.-outsideHeight -`, - scss: ` -@include mq(outside-height, $BP-small, $BP-medium) { - background: $green; -}`, - }) - - //-outsideHeightVar - +demo({ - html: ` -.test.-outsideHeightVar -`, - scss: ` -$MQ-outsideHeightVar: (outside-height, $BP-small, $BP-medium); -@include mq($MQ-outsideHeightVar) { - background: $green; -}`, - }) - + +maxHeight + +maxHeightVar + +minHeight + +minHeightVar + +insideHeight + +insideHeightVar + +outsideHeight + +outsideHeightVar //- ===== //- RATIO //- ===== h3#ratio Ratio - //-ratio - +demo({ - html: ` -.test.-ratio -`, - scss: ` -@include mq(ratio, "2 / 1") { - background: $green; -}`, - }) - - //-ratioVar - +demo({ - html: ` -.test.-ratioVar -`, - scss: ` -$MQ-ratioVar: (ratio, "2 / 1"); -@include mq($MQ-ratioVar) { - background: $green; -}`, - }) - - //-minRatio - +demo({ - html: ` -.test.-minRatio -`, - scss: ` -@include mq(min-ratio, "2 / 1") { - background: $green; -}`, - }) - - //-minRatioVar - +demo({ - html: ` -.test.-minRatioVar -`, - scss: ` -$MQ-minRatioVar: (min-ratio, "2 / 1"); -@include mq($MQ-minRatioVar) { - background: $green; -}`, - }) - - //-maxRatio - +demo({ - html: ` -.test.-maxRatio -`, - scss: ` -@include mq(max-ratio, "2 / 1") { - background: $green; -}`, - }) - - //-maxRatioVar - +demo({ - html: ` -.test.-maxRatioVar -`, - scss: ` -$MQ-maxRatioVar: (max-ratio, "2 / 1"); -@include mq($MQ-maxRatioVar) { - background: $green; -}`, - }) - - //-insideRatio - +demo({ - html: ` -.test.-insideRatio -`, - scss: ` -@include mq(inside-ratio, "2 / 1", "1 / 1") { - background: $green; -}`, - }) - - //-insideRatioVar - +demo({ - html: ` -.test.-insideRatioVar -`, - scss: ` -$MQ-insideRatioVar: (inside-ratio, "2 / 1", "1 / 1"); -@include mq($MQ-insideRatioVar) { - background: $green; -}`, - }) - - //-outsideRatio - +demo({ - html: ` -.test.-outsideRatio -`, - scss: ` -@include mq(outside-ratio, "2 / 1", "1 / 1") { - background: $green; -}`, - }) - - //-outsideRatioVar - +demo({ - html: ` -.test.-outsideRatioVar -`, - scss: ` -$MQ-outsideRatioVar: (outside-ratio, "2 / 1", "1 / 1"); -@include mq($MQ-outsideRatioVar) { - background: $green; -}`, - }) + +ratio + +ratioVar + +minRatio + +minRatioVar + +maxRatio + +maxRatioVar + +insideRatio + +insideRatioVar + +outsideRatio + +outsideRatioVar p A Note on these next three examples. If you set your screen size to exactly 800px width by 400px height, you will see that every single ratio so far returns true. The following 2 examples show a work around for this 1px sour spot issue. FYI, using this technique will make the media query incompatible with Sass media query nesting. #[code not] produces unexpected results when nesting media queries in Sass. - //-exactRatioWorkAround1 - +demo({ - html: ` -.test.-exactRatioWorkAround1 -`, - scss: ` -//equivalent to (min-ratio, '2 / 1') but without the 1px sour spot -$MQ-exactRatioWorkAround1: (max-ratio, '2 / 1', 'not'); -@include mq($MQ-exactRatioWorkAround1) { - background: $green; -}`, - }) - - //-exactRatioWorkAround2 - +demo({ - html: ` -.test.-exactRatioWorkAround2 -`, - scss: ` -//Exactly the same as above but formatted differently -$MQ-exactRatioWorkAround2: 'not' plus (max-ratio, '2 / 1'); -@include mq($MQ-exactRatioWorkAround2) { - background: $green; -}`, - }) - - //-exactRatioWorkAround3 - +demo({ - html: ` -.test.-exactRatioWorkAround3 -`, - scss: ` -//The same again this time inline -@include mq(max-ratio, '2 / 1', 'not') { - background: $green; -} -`, - }) - + +exactRatioWorkAround1 + +exactRatioWorkAround2 + +exactRatioWorkAround3 //- ===== //- MEDIA //- ===== h3#media Media statements - //-simpleMedia - +demo({ - html: ` -.test.-simpleMedia -`, - scss: ` -@include mq(min, $BP-medium, 'screen') { - background: $green; -}`, - }) - - //-notMedia - +demo({ - html: ` -.test.-notMedia -`, - scss: ` -@include mq(min, $BP-medium, 'not') { - background: $green; -}`, - }) - - //-onlyMedia - +demo({ - html: ` -.test.-onlyMedia -`, - scss: ` -@include mq('screen') { - background: $green; -}`, - }) - + +simpleMedia + +notMedia + +onlyMedia //- ===== //- PLUS //- ===== h3#plus #[code plus] statements - //-simplePlus - +demo({ - html: ` -.test.-simplePlus -`, - scss: ` -$MQ-simplePlus: (min-width, $BP-medium) plus (min-height, 600px); -@include mq($MQ-simplePlus) { - background: $green; -}`, - }) - - //-inlinePlus - +demo({ - html: ` -.test.-inlinePlus -`, - scss: ` -//inline plus statement -@include mq((min-width, $BP-medium) plus (min-height, 600px)) { - background: $green; -}`, - }) - - //-mediaOnlyPlus - +demo({ - html: ` -.test.-mediaOnlyPlus -`, - scss: ` -@include mq('screen' plus (min, $BP-medium)) { - background: $green; -}`, - }) - - //-complexPlus - +demo({ - html: ` -.test.-complexPlus -`, - scss: ` -//note that 'print' appplies to the full plus statement -$MQ-complexPlus: (inside-width, $BP-small, $BP-medium, 'print') plus (inside-ratio, '2/1', '1/1'); -@include mq($MQ-complexPlus) { - background: $green; -}`, - }) - - //-ignoredMediaType - +demo({ - html: ` -.test.-ignoredMediaType -`, - scss: ` -//The media type in the second plus statement is ignored -//Only media types in the first definition are honoured in a plus statement -$MQ-ignoredMediaType: (inside-width, $BP-small, $BP-medium) plus (inside-ratio, '2/1', '1/1', 'print'); -@include mq($MQ-ignoredMediaType) { - background: $green; -}`, - }) - - //-multiPlus - +demo({ - html: ` -.test.-multiPlus -`, - scss: ` -$MQ-multiPlus: ( - ('screen') plus - (min-width, $BP-medium) plus - (min-height, 400px) plus - (inside, $BP-small, $BP-large) plus - (inside-ratio, '2/1', '1/1') -); - -@include mq($MQ-multiPlus) { - background: $green; -}`, - }) - + +simplePlus + +inlinePlus + +mediaOnlyPlus + +complexPlus + +ignoredMediaType + +multiPlus //- ===== //- OR //- ===== h3#or #[code or] statements - //-simpleOr - +demo({ - html: ` -.test.-simpleOr -`, - scss: ` -$MQ-simpleOr: ( - (min-width, $BP-medium), - (min-height, 800px) -); -@include mq($MQ-simpleOr) { - background: $green; -}`, - }) - - //-complexOr - +demo({ - html: ` -.test.-complexOr -`, - scss: ` -$MQ-complexOr: ( - (inside, $BP-small, $BP-medium, 'screen'), - (outside-ratio, '2/1', '1/1') -); -@include mq($MQ-complexOr) { - background: $green; -}`, - }) - - //-multiOr - +demo({ - html: ` -.test.-multiOr -`, - scss: ` -$MQ-multiOr: ( - (min-width, $BP-medium, 'screen'), - (min-height, 800px), - (inside, $BP-small, $BP-large), - (inside-ratio, '2/1', '1/1'), - ('print') -); -@include mq($MQ-multiOr) { - background: $green; -}`, - }) - - //-orPlusCombo - +demo({ - html: ` -.test.-orPlusCombo -`, - scss: ` -$MQ-orPlusCombo: ( - (min-width, $BP-medium, 'screen') plus (min-height, 800px), - 'screen' plus (inside, $BP-small, $BP-large) plus (inside-ratio, '2/1', '1/1') -); -@include mq($MQ-orPlusCombo) { - background: $green; -}`, - }) + +simpleOr + +complexOr + +multiOr + +orPlusCombo diff --git a/src/_modules/tests/tests.scss b/src/_modules/tests/tests.scss index 1784258..1fea19b 100644 --- a/src/_modules/tests/tests.scss +++ b/src/_modules/tests/tests.scss @@ -1,461 +1,5 @@ -$red: #6D0808; -$green: #004700; - .tests { display: grid; grid-template-columns: minmax(0,1fr); grid-gap: 20px; } - -@mixin isActive { - background: $green; - &::after { content: ' = true'; } -} - -.test { - padding: 30px; - border: 2px solid #000; - background: $red; - display: flex; - align-items: center; - justify-content: center; - margin-bottom: 20px; - - h3 { - margin-bottom: 0; - } - - &::before, &::after { - color: #fff; - white-space: pre; - } - - &::before { - font-size: 20px; - //Use "\A" to create new lines - } - - &::after { - content: ' = false'; - } - - // ===== - // WIDTH - // ===== - - &.-max { - &::before { content: 'mq(max, #{$BP-medium})'; } - @include mq(max, $BP-medium) { - @include isActive; - } - } - &.-maxWidth { - &::before { content: 'mq(max-width, #{$BP-medium})'; } - @include mq(max-width, $BP-medium) { - @include isActive; - } - } - - &.-maxVar { - $MQ-maxVar: (max, $BP-medium); - &::before { content: 'mq($MQ-maxVar)'; } - @include mq($MQ-maxVar) { - @include isActive; - } - } - - &.-min { - &::before { content: 'mq(min, #{$BP-medium})'; } - @include mq(min, $BP-medium) { - @include isActive; - } - } - - &.-minWidth { - &::before { content: 'mq(min-width, #{$BP-medium})'; } - @include mq(min-width, $BP-medium) { - @include isActive; - } - } - - &.-minVar { - $MQ-minVar: (min, $BP-medium); - &::before { content: 'mq($MQ-minVar)'; } - @include mq($MQ-minVar) { - @include isActive; - } - } - - &.-inside { - &::before { content: 'mq(inside, #{$BP-medium}, #{$BP-small})'; } - @include mq(inside, $BP-medium, $BP-small) { - @include isActive; - } - } - - &.-insideWidth { - &::before { content: 'mq(inside-width, #{$BP-small}, #{$BP-medium})'; } - @include mq(inside-width, $BP-small, $BP-medium) { - @include isActive; - } - } - - &.-insideVar { - $MQ-insideVar: (inside, $BP-medium, $BP-small); - &::before { content: 'mq($MQ-insideVar)'; } - @include mq($MQ-insideVar) { - @include isActive; - } - } - - &.-outside { - &::before { content: 'mq(outside, #{$BP-medium}, #{$BP-small})'; } - @include mq(outside, $BP-medium, $BP-small) { - @include isActive; - } - } - - &.-outsideWidth { - &::before { content: 'mq(outside-width, #{$BP-small}, #{$BP-medium})'; } - @include mq(outside-width, $BP-small, $BP-medium) { - @include isActive; - } - } - - &.-outsideVar { - $MQ-outsideVar: (outside, $BP-medium, $BP-small); - &::before { content: 'mq($MQ-outsideVar)'; } - @include mq($MQ-outsideVar) { - @include isActive; - } - } - - // ====== - // HEIGHT - // ====== - - &.-maxHeight { - &::before { content: 'mq(max-height, #{$BP-medium})'; } - @include mq(max-height, $BP-medium) { - @include isActive; - } - } - - &.-maxHeightVar { - $MQ-maxHeightVar: (max-height, $BP-medium); - &::before { content: 'mq($MQ-maxHeightVar)'; } - @include mq($MQ-maxHeightVar) { - @include isActive; - } - } - - &.-minHeight { - &::before { content: 'mq(min-height, #{$BP-medium})'; } - @include mq(min-height, $BP-medium) { - @include isActive; - } - } - - &.-minHeightVar { - $MQ-minHeightVar: (min-height, $BP-medium); - &::before { content: 'mq($MQ-minHeightVar)'; } - @include mq($MQ-minHeightVar) { - @include isActive; - } - } - - &.-insideHeight { - &::before { content: 'mq(inside-height, #{$BP-small}, #{$BP-medium})'; } - @include mq(inside-height, $BP-small, $BP-medium) { - @include isActive; - } - } - - &.-insideHeightVar { - $MQ-insideHeightVar: (inside-height, $BP-small, $BP-medium); - &::before { content: 'mq($MQ-insideHeightVar)'; } - @include mq($MQ-insideHeightVar) { - @include isActive; - } - } - - &.-outsideHeight { - &::before { content: 'mq(outside-height, #{$BP-small}, #{$BP-medium})'; } - @include mq(outside-height, $BP-small, $BP-medium) { - @include isActive; - } - } - - &.-outsideHeightVar { - $MQ-outsideHeightVar: (outside-height, $BP-small, $BP-medium); - &::before { content: 'mq($MQ-outsideHeightVar)'; } - @include mq($MQ-outsideHeightVar) { - @include isActive; - } - } - - // ====== - // RATIO - // ====== - - &.-ratio { - &::before { content: 'mq(ratio, "2 / 1")'; } - @include mq(ratio, "2 / 1") { - @include isActive; - } - } - - &.-ratioVar { - $MQ-ratioVar: (ratio, "2 / 1"); - &::before { content: 'mq($MQ-ratioVar)'; } - @include mq($MQ-ratioVar) { - @include isActive; - } - } - - &.-minRatio { - &::before { content: 'mq(min-ratio, "2 / 1")'; } - @include mq(min-ratio, "2 / 1") { - @include isActive; - } - } - - &.-minRatioVar { - $MQ-minRatioVar: (min-ratio, "2 / 1"); - &::before { content: 'mq($MQ-minRatioVar)'; } - @include mq($MQ-minRatioVar) { - @include isActive; - } - } - - &.-maxRatio { - &::before { content: 'mq(max-ratio, "2 / 1")'; } - @include mq(max-ratio, "2 / 1") { - @include isActive; - } - } - - &.-maxRatioVar { - $MQ-maxRatioVar: (max-ratio, "2 / 1"); - &::before { content: 'mq($MQ-minRatioVar)'; } - @include mq($MQ-maxRatioVar) { - @include isActive; - } - } - - &.-insideRatio { - &::before { content: 'mq(inside-ratio, "2 / 1", "1 / 1")'; } - @include mq(inside-ratio, "2 / 1", "1 / 1") { - @include isActive; - } - } - - &.-insideRatioVar { - $MQ-insideRatioVar: (inside-ratio, "2 / 1", "1 / 1"); - &::before { content: 'mq($MQ-insideRatioVar)'; } - @include mq($MQ-insideRatioVar) { - @include isActive; - } - } - - &.-outsideRatio { - &::before { content: 'mq(outside-ratio, "1 / 1", "2 / 1")'; } - @include mq(outside-ratio, "1 / 1", "2 / 1") { - @include isActive; - } - } - - &.-outsideRatioVar { - $MQ-outsideRatioVar: (outside-ratio, "2 / 1", "1 / 1"); - &::before { content: 'mq($MQ-outsideRatioVar)'; } - @include mq($MQ-outsideRatioVar) { - @include isActive; - } - } - - &.-exactRatioWorkAround1 { - //equivalent to (min-ratio, '2 / 1') but without the 1px sour spot - $MQ-exactRatioWorkAround1: (max-ratio, '2 / 1', 'not'); - &::before { content: 'mq($MQ-exactRatioWorkAround1)'; } - @include mq($MQ-exactRatioWorkAround1) { - @include isActive; - } - } - - &.-exactRatioWorkAround2 { - //Exactly the same as above but formatted differently - $MQ-exactRatioWorkAround2: 'not' plus (max-ratio, '2 / 1'); - &::before { content: 'mq($MQ-exactRatioWorkAround2)'; } - @include mq($MQ-exactRatioWorkAround2) { - @include isActive; - } - } - - &.-exactRatioWorkAround3 { - //The same again this time inline - &::before { content: "mq(max-ratio, '2 / 1', 'not')"; } - @include mq(max-ratio, '2 / 1', 'not') { - @include isActive; - } - } - - // ====== - // MEDIA - // ====== - - &.-simpleMedia { - &::before { content: "mq(min, #{$BP-medium}, 'screen')"; } - @include mq(min, $BP-medium, 'screen') { - @include isActive; - } - } - - &.-notMedia { - &::before { content: "mq(min, #{$BP-medium}, 'not')"; } - @include mq(min, $BP-medium, 'not') { - @include isActive; - } - } - - &.-onlyMedia { - &::before { content: "mq('screen')"; } - @include mq('screen') { - @include isActive; - } - } - - - //- ===== - //- PLUS - //- ===== - - &.-simplePlus { - $MQ-simplePlus: (min-width, $BP-medium) plus (min-height, 600px); - &::before { content: "mq($MQ-simplePlus)"; } - @include mq($MQ-simplePlus) { - @include isActive; - } - } - - &.-inlinePlus { - $MQ-simplePlus: (min-width, $BP-medium) plus (min-height, 600px); - &::before { content: "mq((min-width, #{$BP-medium}) plus (min-height, 600px))"; } - @include mq((min-width, $BP-medium) plus (min-height, 600px)) { - @include isActive; - } - } - - &.-mediaOnlyPlus { - &::before { content: "mq('screen' plus (min, #{$BP-medium}))"; } - @include mq('screen' plus (min, $BP-medium)) { - @include isActive; - } - } - - &.-complexPlus { - $MQ-complexPlus: (inside-width, $BP-small, $BP-medium, 'print') plus (inside-ratio, '2/1', '1/1'); - &::before { content: "mq($MQ-complexPlus)"; } - @include mq($MQ-complexPlus) { - @include isActive; - } - } - - &.-ignoredMediaType { - $MQ-ignoredMediaType: (inside-width, $BP-small, $BP-medium) plus (inside-ratio, '2/1', '1/1', 'print'); - &::before { content: "mq($MQ-ignoredMediaType)"; } - @include mq($MQ-ignoredMediaType) { - @include isActive; - } - } - - &.-multiPlus { - $MQ-multiPlus: ( - ('screen') plus - (min-width, $BP-medium) plus - (min-height, 400px) plus - (inside, $BP-small, $BP-large) plus - (inside-ratio, '2/1', '1/1') - ); - &::before { content: "mq($MQ-multiPlus)"; } - - @include mq($MQ-multiPlus) { - @include isActive; - } - } - - //- ===== - //- OR - //- ===== - - &.-simpleOr { - $MQ-simpleOr: ( - (min-width, $BP-medium), - (min-height, 800px) - ); - &::before { content: "mq($MQ-simpleOr)"; } - @include mq($MQ-simpleOr) { - } - } - - &.-complexOr { - &::before { content: "mq($MQ-complexOr)"; } - $MQ-complexOr: ( - (inside, $BP-small, $BP-medium, 'screen'), - (outside-ratio, '2/1', '1/1') - ); - @include mq($MQ-complexOr) { - @include isActive; - } - } - - &.-multiOr { - &::before { content: "mq($MQ-multiOr)"; } - $MQ-multiOr: ( - (min-width, $BP-medium, 'screen'), - (min-height, 800px), - (inside, $BP-small, $BP-large), - (inside-ratio, '2/1', '1/1'), - ('print') - ); - @include mq($MQ-multiOr) { - @include isActive; - } - } - - &.-orPlusCombo { - &::before { content: "mq($MQ-orPlusCombo)"; } - $MQ-orPlusCombo: ( - (min-width, $BP-medium, 'screen') plus (min-height, 800px), - 'screen' plus (inside, $BP-small, $BP-large) plus (inside-ratio, '2/1', '1/1') - ); - @include mq($MQ-orPlusCombo) { - @include isActive; - } - } - -} - -@include mq('not' plus (max-ratio, '2 / 1')) { - body { color: #000; } -} - - -.breakpoints { - padding: 20px; - border: 2px solid #000; - - &__size { - @each $name, $value in $breakpoints { - &.-#{$name} { - &::before { - content: 'BP-#{$name}: '; - } - &::after { - content: '#{$value}'; - font-weight: bold; - font-size: 1.2em; - } - } - } - } -} \ No newline at end of file diff --git a/src/_styles/00-config-files/03-BPs-MQs/00-bp-break-points-base.scss b/src/_styles/00-config-files/03-BPs-MQs/00-bp-break-points-base.scss index 080dcda..c310a8d 100644 --- a/src/_styles/00-config-files/03-BPs-MQs/00-bp-break-points-base.scss +++ b/src/_styles/00-config-files/03-BPs-MQs/00-bp-break-points-base.scss @@ -22,9 +22,3 @@ $breakpoints: ( large: $BP-large, page: $BP-page, ) - -:root { - @each $name, $value in $breakpoints { - --BP-#{$name}: $value; - } -} \ No newline at end of file diff --git a/src/_styles/main.scss b/src/_styles/main.scss index 050dac1..cf4740a 100644 --- a/src/_styles/main.scss +++ b/src/_styles/main.scss @@ -19,10 +19,32 @@ @import '04-base-styles/TK-toolkit'; //module imports -@import '../_modules/pageContainer/pageContainer'; -@import '../_modules/demo/demo'; -@import '../_modules/tabs/tabs'; -@import '../_modules/bodyContent/bodyContent'; -@import '../_modules/btn/btn'; -@import '../_modules/header/header'; -@import '../_modules/tests/tests'; +@import '../_modules/**/*.scss'; + + +// SCSS + +$MQ-element__color--main: (inside, 1024px, 600px); +$MQ-element__color--alt: (outside, 1024px, 600px); + +.module { + &__element { + @include mq($MQ-element__color--main){ + background: red; + } + + @include mq($MQ-element__color--alt){ + background: blue; + } + + &--green { + @include mq($MQ-element__color--main){ + background: green; + } + + @include mq($MQ-element__color--alt){ + background: grey; + } + } + } +} \ No newline at end of file diff --git a/src/index.pug b/src/index.pug index 0a0c1d3..4db860c 100644 --- a/src/index.pug +++ b/src/index.pug @@ -2,6 +2,7 @@ extends _layouts/base block append includes include /_modules/demo/demo + include /_modules/breakpoints/breakpoints block content :marked @@ -9,4 +10,6 @@ block content This site is best viewed on desktop. Resizing the browser window will cause different media queries to activate at different screen sizes. + +breakpoints + include /_modules/tests/tests diff --git a/unit-tests/height/insideHeight/insideHeight.css b/unit-tests/height/insideHeight/insideHeight.css new file mode 100644 index 0000000..200b00d --- /dev/null +++ b/unit-tests/height/insideHeight/insideHeight.css @@ -0,0 +1 @@ +@media (max-height: 800px) and (min-height: 601px){.unitTest{color:#000}} diff --git a/unit-tests/height/insideHeight/insideHeight.pug b/unit-tests/height/insideHeight/insideHeight.pug new file mode 100644 index 0000000..a7a2e2a --- /dev/null +++ b/unit-tests/height/insideHeight/insideHeight.pug @@ -0,0 +1,11 @@ +mixin insideHeight + //-insideHeight + +demo({ + html: ` +.test.-insideHeight +`, + scss: ` +@include mq(inside-height, $BP-small, $BP-medium) { + background: $green; +}`, + }) diff --git a/unit-tests/height/insideHeight/insideHeight.scss b/unit-tests/height/insideHeight/insideHeight.scss new file mode 100644 index 0000000..6c4ed92 --- /dev/null +++ b/unit-tests/height/insideHeight/insideHeight.scss @@ -0,0 +1,20 @@ +@import '../../test-dependencies.scss'; + +@mixin insideHeight { + @include mq(inside-height, $BP-small, $BP-medium) { + @content; + } +} + +@if ($test-only) { + .unitTest { + @include insideHeight { color: #000; } + } +} @else { + .test.-insideHeight { + &::before { content: 'mq(inside-height, #{$BP-small}, #{$BP-medium})'; } + @include insideHeight { + @include isActive; + } + } +} diff --git a/unit-tests/height/insideHeight/test.js b/unit-tests/height/insideHeight/test.js new file mode 100644 index 0000000..9be2b87 --- /dev/null +++ b/unit-tests/height/insideHeight/test.js @@ -0,0 +1,3 @@ +import unitTest from '../../../gulp/helpers/unitTest'; + +unitTest('insideHeight', __dirname, '@media (max-height: 800px) and (min-height: 601px){.unitTest{color:#000}}') diff --git a/unit-tests/height/insideHeightVar/insideHeightVar.css b/unit-tests/height/insideHeightVar/insideHeightVar.css new file mode 100644 index 0000000..200b00d --- /dev/null +++ b/unit-tests/height/insideHeightVar/insideHeightVar.css @@ -0,0 +1 @@ +@media (max-height: 800px) and (min-height: 601px){.unitTest{color:#000}} diff --git a/unit-tests/height/insideHeightVar/insideHeightVar.pug b/unit-tests/height/insideHeightVar/insideHeightVar.pug new file mode 100644 index 0000000..f86b374 --- /dev/null +++ b/unit-tests/height/insideHeightVar/insideHeightVar.pug @@ -0,0 +1,12 @@ +mixin insideHeightVar + //-insideHeightVar + +demo({ + html: ` +.test.-insideHeightVar +`, + scss: ` +$MQ-insideHeightVar: (inside-height, $BP-small, $BP-medium); +@include mq($MQ-insideHeightVar) { + background: $green; +}`, + }) diff --git a/unit-tests/height/insideHeightVar/insideHeightVar.scss b/unit-tests/height/insideHeightVar/insideHeightVar.scss new file mode 100644 index 0000000..94020eb --- /dev/null +++ b/unit-tests/height/insideHeightVar/insideHeightVar.scss @@ -0,0 +1,21 @@ +@import '../../test-dependencies.scss'; + +@mixin insideHeightVar { + $MQ-insideHeightVar: (inside-height, $BP-small, $BP-medium); + @include mq($MQ-insideHeightVar) { + @content; + } +} + +@if ($test-only) { + .unitTest { + @include insideHeightVar { color: #000; } + } +} @else { + .test.-insideHeightVar { + &::before { content: 'mq($MQ-insideHeightVar)'; } + @include insideHeightVar { + @include isActive; + } + } +} diff --git a/unit-tests/height/insideHeightVar/test.js b/unit-tests/height/insideHeightVar/test.js new file mode 100644 index 0000000..949f9a1 --- /dev/null +++ b/unit-tests/height/insideHeightVar/test.js @@ -0,0 +1,3 @@ +import unitTest from '../../../gulp/helpers/unitTest'; + +unitTest('insideHeightVar', __dirname, '@media (max-height: 800px) and (min-height: 601px){.unitTest{color:#000}}') diff --git a/unit-tests/height/maxHeight/maxHeight.css b/unit-tests/height/maxHeight/maxHeight.css new file mode 100644 index 0000000..85225b8 --- /dev/null +++ b/unit-tests/height/maxHeight/maxHeight.css @@ -0,0 +1 @@ +@media (max-height: 800px){.unitTest{color:#000}} diff --git a/unit-tests/height/maxHeight/maxHeight.pug b/unit-tests/height/maxHeight/maxHeight.pug new file mode 100644 index 0000000..c5b6ad6 --- /dev/null +++ b/unit-tests/height/maxHeight/maxHeight.pug @@ -0,0 +1,11 @@ +mixin maxHeight + //-maxHeight + +demo({ + html: ` +.test.-maxHeight +`, + scss: ` +@include mq(max-height, $BP-medium) { + background: $green; +}`, + }) diff --git a/unit-tests/height/maxHeight/maxHeight.scss b/unit-tests/height/maxHeight/maxHeight.scss new file mode 100644 index 0000000..a253354 --- /dev/null +++ b/unit-tests/height/maxHeight/maxHeight.scss @@ -0,0 +1,20 @@ +@import '../../test-dependencies.scss'; + +@mixin maxHeight { + @include mq(max-height, $BP-medium) { + @content; + } +} + +@if ($test-only) { + .unitTest { + @include maxHeight { color: #000; } + } +} @else { + .test.-maxHeight { + &::before { content: 'mq(max-height, #{$BP-medium})'; } + @include maxHeight { + @include isActive; + } + } +} diff --git a/unit-tests/height/maxHeight/test.js b/unit-tests/height/maxHeight/test.js new file mode 100644 index 0000000..de90e77 --- /dev/null +++ b/unit-tests/height/maxHeight/test.js @@ -0,0 +1,3 @@ +import unitTest from '../../../gulp/helpers/unitTest'; + +unitTest('maxHeight', __dirname, '@media (max-height: 800px){.unitTest{color:#000}}') diff --git a/unit-tests/height/maxHeightVar/maxHeightVar.css b/unit-tests/height/maxHeightVar/maxHeightVar.css new file mode 100644 index 0000000..85225b8 --- /dev/null +++ b/unit-tests/height/maxHeightVar/maxHeightVar.css @@ -0,0 +1 @@ +@media (max-height: 800px){.unitTest{color:#000}} diff --git a/unit-tests/height/maxHeightVar/maxHeightVar.pug b/unit-tests/height/maxHeightVar/maxHeightVar.pug new file mode 100644 index 0000000..1c48bbd --- /dev/null +++ b/unit-tests/height/maxHeightVar/maxHeightVar.pug @@ -0,0 +1,13 @@ + +mixin maxHeightVar + //-maxHeightVar + +demo({ + html: ` +.test.-maxHeightVar +`, + scss: ` +$MQ-maxHeightVar: (max-height, $BP-medium); +@include mq($MQ-maxHeightVar) { + background: $green; +}`, + }) diff --git a/unit-tests/height/maxHeightVar/maxHeightVar.scss b/unit-tests/height/maxHeightVar/maxHeightVar.scss new file mode 100644 index 0000000..c03ba83 --- /dev/null +++ b/unit-tests/height/maxHeightVar/maxHeightVar.scss @@ -0,0 +1,21 @@ +@import '../../test-dependencies.scss'; + +@mixin maxHeightVar { + $MQ-maxHeightVar: (max-height, $BP-medium); + @include mq($MQ-maxHeightVar) { + @content; + } +} + +@if ($test-only) { + .unitTest { + @include maxHeightVar { color: #000; } + } +} @else { + .test.-maxHeightVar { + &::before { content: 'mq($MQ-maxHeightVar)'; } + @include maxHeightVar { + @include isActive; + } + } +} diff --git a/unit-tests/height/maxHeightVar/test.js b/unit-tests/height/maxHeightVar/test.js new file mode 100644 index 0000000..baae6f9 --- /dev/null +++ b/unit-tests/height/maxHeightVar/test.js @@ -0,0 +1,5 @@ +//maxHeightVar + +import unitTest from '../../../gulp/helpers/unitTest'; + +unitTest('maxHeightVar', __dirname, '@media (max-height: 800px){.unitTest{color:#000}}') diff --git a/unit-tests/height/minHeight/minHeight.css b/unit-tests/height/minHeight/minHeight.css new file mode 100644 index 0000000..99cf461 --- /dev/null +++ b/unit-tests/height/minHeight/minHeight.css @@ -0,0 +1 @@ +@media (min-height: 801px){.unitTest{color:#000}} diff --git a/unit-tests/height/minHeight/minHeight.pug b/unit-tests/height/minHeight/minHeight.pug new file mode 100644 index 0000000..89cd5ae --- /dev/null +++ b/unit-tests/height/minHeight/minHeight.pug @@ -0,0 +1,11 @@ +mixin minHeight + //-minHeight + +demo({ + html: ` +.test.-minHeight +`, + scss: ` +@include mq(min-height, $BP-medium) { + background: $green; +}`, + }) diff --git a/unit-tests/height/minHeight/minHeight.scss b/unit-tests/height/minHeight/minHeight.scss new file mode 100644 index 0000000..ea84010 --- /dev/null +++ b/unit-tests/height/minHeight/minHeight.scss @@ -0,0 +1,20 @@ +@import '../../test-dependencies.scss'; + +@mixin minHeight { + @include mq(min-height, $BP-medium) { + @content; + } +} + +@if ($test-only) { + .unitTest { + @include minHeight { color: #000; } + } +} @else { + .test.-minHeight { + &::before { content: 'mq(min-height, #{$BP-medium})'; } + @include minHeight { + @include isActive; + } + } +} diff --git a/unit-tests/height/minHeight/test.js b/unit-tests/height/minHeight/test.js new file mode 100644 index 0000000..6cb07b1 --- /dev/null +++ b/unit-tests/height/minHeight/test.js @@ -0,0 +1,3 @@ +import unitTest from '../../../gulp/helpers/unitTest'; + +unitTest('minHeight', __dirname, '@media (min-height: 801px){.unitTest{color:#000}}') diff --git a/unit-tests/height/minHeightVar/minHeightVar.css b/unit-tests/height/minHeightVar/minHeightVar.css new file mode 100644 index 0000000..99cf461 --- /dev/null +++ b/unit-tests/height/minHeightVar/minHeightVar.css @@ -0,0 +1 @@ +@media (min-height: 801px){.unitTest{color:#000}} diff --git a/unit-tests/height/minHeightVar/minHeightVar.pug b/unit-tests/height/minHeightVar/minHeightVar.pug new file mode 100644 index 0000000..13ed0ba --- /dev/null +++ b/unit-tests/height/minHeightVar/minHeightVar.pug @@ -0,0 +1,12 @@ +mixin minHeightVar + //-minHeightVar + +demo({ + html: ` +.test.-minHeightVar +`, + scss: ` +$MQ-minHeightVar: (min-height, $BP-medium); +@include mq($MQ-minHeightVar) { + background: $green; +}`, + }) diff --git a/unit-tests/height/minHeightVar/minHeightVar.scss b/unit-tests/height/minHeightVar/minHeightVar.scss new file mode 100644 index 0000000..473d9df --- /dev/null +++ b/unit-tests/height/minHeightVar/minHeightVar.scss @@ -0,0 +1,21 @@ +@import '../../test-dependencies.scss'; + +@mixin minHeightVar { + $MQ-minHeightVar: (min-height, $BP-medium); + @include mq($MQ-minHeightVar) { + @content; + } +} + +@if ($test-only) { + .unitTest { + @include minHeightVar { color: #000; } + } +} @else { + .test.-minHeightVar { + &::before { content: 'mq($MQ-minHeightVar)'; } + @include minHeightVar { + @include isActive; + } + } +} diff --git a/unit-tests/height/minHeightVar/test.js b/unit-tests/height/minHeightVar/test.js new file mode 100644 index 0000000..d2c8a50 --- /dev/null +++ b/unit-tests/height/minHeightVar/test.js @@ -0,0 +1,3 @@ +import unitTest from '../../../gulp/helpers/unitTest'; + +unitTest('minHeightVar', __dirname, '@media (min-height: 801px){.unitTest{color:#000}}') diff --git a/unit-tests/height/outsideHeight/outsideHeight.css b/unit-tests/height/outsideHeight/outsideHeight.css new file mode 100644 index 0000000..a116b3c --- /dev/null +++ b/unit-tests/height/outsideHeight/outsideHeight.css @@ -0,0 +1 @@ +@media (max-height: 600px), (min-height: 801px){.unitTest{color:#000}} diff --git a/unit-tests/height/outsideHeight/outsideHeight.pug b/unit-tests/height/outsideHeight/outsideHeight.pug new file mode 100644 index 0000000..ccd3b91 --- /dev/null +++ b/unit-tests/height/outsideHeight/outsideHeight.pug @@ -0,0 +1,11 @@ +mixin outsideHeight + //-outsideHeight + +demo({ + html: ` +.test.-outsideHeight +`, + scss: ` +@include mq(outside-height, $BP-small, $BP-medium) { + background: $green; +}`, + }) diff --git a/unit-tests/height/outsideHeight/outsideHeight.scss b/unit-tests/height/outsideHeight/outsideHeight.scss new file mode 100644 index 0000000..8e52c8b --- /dev/null +++ b/unit-tests/height/outsideHeight/outsideHeight.scss @@ -0,0 +1,20 @@ +@import '../../test-dependencies.scss'; + +@mixin outsideHeight { + @include mq(outside-height, $BP-small, $BP-medium) { + @content; + } +} + +@if ($test-only) { + .unitTest { + @include outsideHeight { color: #000; } + } +} @else { + .test.-outsideHeight { + &::before { content: 'mq(outside-height, #{$BP-small}, #{$BP-medium})'; } + @include outsideHeight { + @include isActive; + } + } +} diff --git a/unit-tests/height/outsideHeight/test.js b/unit-tests/height/outsideHeight/test.js new file mode 100644 index 0000000..d94ff44 --- /dev/null +++ b/unit-tests/height/outsideHeight/test.js @@ -0,0 +1,3 @@ +import unitTest from '../../../gulp/helpers/unitTest'; + +unitTest('outsideHeight', __dirname, '@media (max-height: 600px), (min-height: 801px){.unitTest{color:#000}}') diff --git a/unit-tests/height/outsideHeightVar/outsideHeightVar.css b/unit-tests/height/outsideHeightVar/outsideHeightVar.css new file mode 100644 index 0000000..a116b3c --- /dev/null +++ b/unit-tests/height/outsideHeightVar/outsideHeightVar.css @@ -0,0 +1 @@ +@media (max-height: 600px), (min-height: 801px){.unitTest{color:#000}} diff --git a/unit-tests/height/outsideHeightVar/outsideHeightVar.pug b/unit-tests/height/outsideHeightVar/outsideHeightVar.pug new file mode 100644 index 0000000..c01d97b --- /dev/null +++ b/unit-tests/height/outsideHeightVar/outsideHeightVar.pug @@ -0,0 +1,12 @@ +mixin outsideHeightVar + //-outsideHeightVar + +demo({ + html: ` +.test.-outsideHeightVar +`, + scss: ` +$MQ-outsideHeightVar: (outside-height, $BP-small, $BP-medium); +@include mq($MQ-outsideHeightVar) { + background: $green; +}`, + }) diff --git a/unit-tests/height/outsideHeightVar/outsideHeightVar.scss b/unit-tests/height/outsideHeightVar/outsideHeightVar.scss new file mode 100644 index 0000000..ec4b43e --- /dev/null +++ b/unit-tests/height/outsideHeightVar/outsideHeightVar.scss @@ -0,0 +1,21 @@ +@import '../../test-dependencies.scss'; + +@mixin outsideHeightVar { + $MQ-outsideHeightVar: (outside-height, $BP-small, $BP-medium); + @include mq($MQ-outsideHeightVar) { + @content; + } +} + +@if ($test-only) { + .unitTest { + @include outsideHeightVar { color: #000; } + } +} @else { + .test.-outsideHeightVar { + &::before { content: 'mq($MQ-outsideHeightVar)'; } + @include outsideHeightVar { + @include isActive; + } + } +} diff --git a/unit-tests/height/outsideHeightVar/test.js b/unit-tests/height/outsideHeightVar/test.js new file mode 100644 index 0000000..0544196 --- /dev/null +++ b/unit-tests/height/outsideHeightVar/test.js @@ -0,0 +1,3 @@ +import unitTest from '../../../gulp/helpers/unitTest'; + +unitTest('outsideHeightVar', __dirname, '@media (max-height: 600px), (min-height: 801px){.unitTest{color:#000}}') diff --git a/unit-tests/media/notMedia/notMedia.css b/unit-tests/media/notMedia/notMedia.css new file mode 100644 index 0000000..497b895 --- /dev/null +++ b/unit-tests/media/notMedia/notMedia.css @@ -0,0 +1 @@ +@media not screen and (min-width: 801px){.unitTest{color:#000}} diff --git a/unit-tests/media/notMedia/notMedia.pug b/unit-tests/media/notMedia/notMedia.pug new file mode 100644 index 0000000..66a52f7 --- /dev/null +++ b/unit-tests/media/notMedia/notMedia.pug @@ -0,0 +1,11 @@ +mixin notMedia + //-notMedia + +demo({ + html: ` +.test.-notMedia +`, + scss: ` +@include mq(min, $BP-medium, 'not') { + background: $green; +}`, + }) diff --git a/unit-tests/media/notMedia/notMedia.scss b/unit-tests/media/notMedia/notMedia.scss new file mode 100644 index 0000000..d2d8801 --- /dev/null +++ b/unit-tests/media/notMedia/notMedia.scss @@ -0,0 +1,20 @@ +@import '../../test-dependencies.scss'; + +@mixin notMedia { + @include mq(min, $BP-medium, 'not') { + @content; + } +} + +@if ($test-only) { + .unitTest { + @include notMedia { color: #000; } + } +} @else { + .test.-notMedia { + &::before { content: "mq(min, #{$BP-medium}, 'not')"; } + @include notMedia { + @include isActive; + } + } +} diff --git a/unit-tests/media/notMedia/test.js b/unit-tests/media/notMedia/test.js new file mode 100644 index 0000000..82e8792 --- /dev/null +++ b/unit-tests/media/notMedia/test.js @@ -0,0 +1,3 @@ +import unitTest from '../../../gulp/helpers/unitTest'; + +unitTest('notMedia', __dirname, '@media not screen and (min-width: 801px){.unitTest{color:#000}}') diff --git a/unit-tests/media/onlyMedia/onlyMedia.css b/unit-tests/media/onlyMedia/onlyMedia.css new file mode 100644 index 0000000..280c9eb --- /dev/null +++ b/unit-tests/media/onlyMedia/onlyMedia.css @@ -0,0 +1 @@ +@media screen{.unitTest{color:#000}} diff --git a/unit-tests/media/onlyMedia/onlyMedia.pug b/unit-tests/media/onlyMedia/onlyMedia.pug new file mode 100644 index 0000000..8d6675a --- /dev/null +++ b/unit-tests/media/onlyMedia/onlyMedia.pug @@ -0,0 +1,11 @@ +mixin onlyMedia + //-onlyMedia + +demo({ + html: ` +.test.-onlyMedia +`, + scss: ` +@include mq('screen') { + background: $green; +}`, + }) diff --git a/unit-tests/media/onlyMedia/onlyMedia.scss b/unit-tests/media/onlyMedia/onlyMedia.scss new file mode 100644 index 0000000..03d31ae --- /dev/null +++ b/unit-tests/media/onlyMedia/onlyMedia.scss @@ -0,0 +1,20 @@ +@import '../../test-dependencies.scss'; + +@mixin onlyMedia { + @include mq('screen') { + @content; + } +} + +@if ($test-only) { + .unitTest { + @include onlyMedia { color: #000; } + } +} @else { + .test.-onlyMedia { + &::before { content: "mq('screen')"; } + @include onlyMedia { + @include isActive; + } + } +} diff --git a/unit-tests/media/onlyMedia/test.js b/unit-tests/media/onlyMedia/test.js new file mode 100644 index 0000000..8b49fb4 --- /dev/null +++ b/unit-tests/media/onlyMedia/test.js @@ -0,0 +1,3 @@ +import unitTest from '../../../gulp/helpers/unitTest'; + +unitTest('onlyMedia', __dirname, '@media screen{.unitTest{color:#000}}') diff --git a/unit-tests/media/simpleMedia/simpleMedia.css b/unit-tests/media/simpleMedia/simpleMedia.css new file mode 100644 index 0000000..51c49ff --- /dev/null +++ b/unit-tests/media/simpleMedia/simpleMedia.css @@ -0,0 +1 @@ +@media screen and (min-width: 801px){.unitTest{color:#000}} diff --git a/unit-tests/media/simpleMedia/simpleMedia.pug b/unit-tests/media/simpleMedia/simpleMedia.pug new file mode 100644 index 0000000..158ad7c --- /dev/null +++ b/unit-tests/media/simpleMedia/simpleMedia.pug @@ -0,0 +1,11 @@ +mixin simpleMedia + //-simpleMedia + +demo({ + html: ` +.test.-simpleMedia +`, + scss: ` +@include mq(min, $BP-medium, 'screen') { + background: $green; +}`, + }) diff --git a/unit-tests/media/simpleMedia/simpleMedia.scss b/unit-tests/media/simpleMedia/simpleMedia.scss new file mode 100644 index 0000000..165881c --- /dev/null +++ b/unit-tests/media/simpleMedia/simpleMedia.scss @@ -0,0 +1,20 @@ +@import '../../test-dependencies.scss'; + +@mixin simpleMedia { + @include mq(min, $BP-medium, 'screen') { + @content; + } +} + +@if ($test-only) { + .unitTest { + @include simpleMedia { color: #000; } + } +} @else { + .test.-simpleMedia { + &::before { content: "mq(min, #{$BP-medium}, 'screen')"; } + @include simpleMedia { + @include isActive; + } + } +} diff --git a/unit-tests/media/simpleMedia/test.js b/unit-tests/media/simpleMedia/test.js new file mode 100644 index 0000000..c24b72b --- /dev/null +++ b/unit-tests/media/simpleMedia/test.js @@ -0,0 +1,3 @@ +import unitTest from '../../../gulp/helpers/unitTest'; + +unitTest('simpleMedia', __dirname, '@media screen and (min-width: 801px){.unitTest{color:#000}}') diff --git a/unit-tests/or/complexOr/complexOr.css b/unit-tests/or/complexOr/complexOr.css new file mode 100644 index 0000000..79013dc --- /dev/null +++ b/unit-tests/or/complexOr/complexOr.css @@ -0,0 +1 @@ +@media screen and (max-width: 800px) and (min-width: 601px), (max-aspect-ratio: 1 / 1), (min-aspect-ratio: 2 / 1){.unitTest{color:#000}} diff --git a/unit-tests/or/complexOr/complexOr.pug b/unit-tests/or/complexOr/complexOr.pug new file mode 100644 index 0000000..2a3d4ac --- /dev/null +++ b/unit-tests/or/complexOr/complexOr.pug @@ -0,0 +1,15 @@ +mixin complexOr + //-complexOr + +demo({ + html: ` +.test.-complexOr +`, + scss: ` +$MQ-complexOr: ( + (inside, $BP-small, $BP-medium, 'screen'), + (outside-ratio, '2/1', '1/1') +); +@include mq($MQ-complexOr) { + background: $green; +}`, + }) diff --git a/unit-tests/or/complexOr/complexOr.scss b/unit-tests/or/complexOr/complexOr.scss new file mode 100644 index 0000000..97a0e9c --- /dev/null +++ b/unit-tests/or/complexOr/complexOr.scss @@ -0,0 +1,24 @@ +@import '../../test-dependencies.scss'; + +@mixin complexOr { + $MQ-complexOr: ( + (inside, $BP-small, $BP-medium, 'screen'), + (outside-ratio, '2/1', '1/1') + ); + @include mq($MQ-complexOr) { + @content; + } +} + +@if ($test-only) { + .unitTest { + @include complexOr { color: #000; } + } +} @else { + .test.-complexOr { + &::before { content: 'mq($MQ-complexOr)'; } + @include complexOr { + @include isActive; + } + } +} diff --git a/unit-tests/or/complexOr/test.js b/unit-tests/or/complexOr/test.js new file mode 100644 index 0000000..25ffe55 --- /dev/null +++ b/unit-tests/or/complexOr/test.js @@ -0,0 +1,3 @@ +import unitTest from '../../../gulp/helpers/unitTest'; + +unitTest('complexOr', __dirname, '@media screen and (max-width: 800px) and (min-width: 601px), (max-aspect-ratio: 1 / 1), (min-aspect-ratio: 2 / 1){.unitTest{color:#000}}') diff --git a/unit-tests/or/multiOr/multiOr.css b/unit-tests/or/multiOr/multiOr.css new file mode 100644 index 0000000..eaa994e --- /dev/null +++ b/unit-tests/or/multiOr/multiOr.css @@ -0,0 +1 @@ +@media screen and (min-width: 801px), (min-height: 801px), (max-width: 1000px) and (min-width: 601px), (max-aspect-ratio: 2 / 1) and (min-aspect-ratio: 1 / 1), print{.unitTest{color:#000}} diff --git a/unit-tests/or/multiOr/multiOr.pug b/unit-tests/or/multiOr/multiOr.pug new file mode 100644 index 0000000..210f50b --- /dev/null +++ b/unit-tests/or/multiOr/multiOr.pug @@ -0,0 +1,18 @@ +mixin multiOr + //-multiOr + +demo({ + html: ` +.test.-multiOr +`, + scss: ` +$MQ-multiOr: ( + (min-width, $BP-medium, 'screen'), + (min-height, 800px), + (inside, $BP-small, $BP-large), + (inside-ratio, '2/1', '1/1'), + ('print') +); +@include mq($MQ-multiOr) { + background: $green; +}`, + }) diff --git a/unit-tests/or/multiOr/multiOr.scss b/unit-tests/or/multiOr/multiOr.scss new file mode 100644 index 0000000..ec8ddb5 --- /dev/null +++ b/unit-tests/or/multiOr/multiOr.scss @@ -0,0 +1,27 @@ +@import '../../test-dependencies.scss'; + +@mixin multiOr { + $MQ-multiOr: ( + (min-width, $BP-medium, 'screen'), + (min-height, 800px), + (inside, $BP-small, $BP-large), + (inside-ratio, '2/1', '1/1'), + ('print') + ); + @include mq($MQ-multiOr) { + @content; + } +} + +@if ($test-only) { + .unitTest { + @include multiOr { color: #000; } + } +} @else { + .test.-multiOr { + &::before { content: 'mq($MQ-multiOr)'; } + @include multiOr { + @include isActive; + } + } +} diff --git a/unit-tests/or/multiOr/test.js b/unit-tests/or/multiOr/test.js new file mode 100644 index 0000000..9737f64 --- /dev/null +++ b/unit-tests/or/multiOr/test.js @@ -0,0 +1,3 @@ +import unitTest from '../../../gulp/helpers/unitTest'; + +unitTest('multiOr', __dirname, '@media screen and (min-width: 801px), (min-height: 801px), (max-width: 1000px) and (min-width: 601px), (max-aspect-ratio: 2 / 1) and (min-aspect-ratio: 1 / 1), print{.unitTest{color:#000}}') diff --git a/unit-tests/or/orPlusCombo/orPlusCombo.css b/unit-tests/or/orPlusCombo/orPlusCombo.css new file mode 100644 index 0000000..d596038 --- /dev/null +++ b/unit-tests/or/orPlusCombo/orPlusCombo.css @@ -0,0 +1 @@ +@media screen and (min-width: 801px) and (min-height: 801px), screen and (max-width: 1000px) and (min-width: 601px) and (max-aspect-ratio: 2 / 1) and (min-aspect-ratio: 1 / 1){.unitTest{color:#000}} diff --git a/unit-tests/or/orPlusCombo/orPlusCombo.pug b/unit-tests/or/orPlusCombo/orPlusCombo.pug new file mode 100644 index 0000000..ddb3370 --- /dev/null +++ b/unit-tests/or/orPlusCombo/orPlusCombo.pug @@ -0,0 +1,15 @@ +mixin orPlusCombo + //-orPlusCombo + +demo({ + html: ` +.test.-orPlusCombo +`, + scss: ` +$MQ-orPlusCombo: ( + (min-width, $BP-medium, 'screen') plus (min-height, 800px), + 'screen' plus (inside, $BP-small, $BP-large) plus (inside-ratio, '2/1', '1/1') +); +@include mq($MQ-orPlusCombo) { + background: $green; +}`, + }) diff --git a/unit-tests/or/orPlusCombo/orPlusCombo.scss b/unit-tests/or/orPlusCombo/orPlusCombo.scss new file mode 100644 index 0000000..e3f999a --- /dev/null +++ b/unit-tests/or/orPlusCombo/orPlusCombo.scss @@ -0,0 +1,24 @@ +@import '../../test-dependencies.scss'; + +@mixin orPlusCombo { + $MQ-orPlusCombo: ( + (min-width, $BP-medium, 'screen') plus (min-height, 800px), + 'screen' plus (inside, $BP-small, $BP-large) plus (inside-ratio, '2/1', '1/1') + ); + @include mq($MQ-orPlusCombo) { + @content; + } +} + +@if ($test-only) { + .unitTest { + @include orPlusCombo { color: #000; } + } +} @else { + .test.-orPlusCombo { + &::before { content: 'mq($MQ-orPlusCombo)'; } + @include orPlusCombo { + @include isActive; + } + } +} diff --git a/unit-tests/or/orPlusCombo/test.js b/unit-tests/or/orPlusCombo/test.js new file mode 100644 index 0000000..acb6002 --- /dev/null +++ b/unit-tests/or/orPlusCombo/test.js @@ -0,0 +1,3 @@ +import unitTest from '../../../gulp/helpers/unitTest'; + +unitTest('orPlusCombo', __dirname, '@media screen and (min-width: 801px) and (min-height: 801px), screen and (max-width: 1000px) and (min-width: 601px) and (max-aspect-ratio: 2 / 1) and (min-aspect-ratio: 1 / 1){.unitTest{color:#000}}') diff --git a/unit-tests/or/simpleOr/simpleOr.css b/unit-tests/or/simpleOr/simpleOr.css new file mode 100644 index 0000000..bec7330 --- /dev/null +++ b/unit-tests/or/simpleOr/simpleOr.css @@ -0,0 +1 @@ +@media (min-width: 801px), (min-height: 801px){.unitTest{color:#000}} diff --git a/unit-tests/or/simpleOr/simpleOr.pug b/unit-tests/or/simpleOr/simpleOr.pug new file mode 100644 index 0000000..2ce9dc3 --- /dev/null +++ b/unit-tests/or/simpleOr/simpleOr.pug @@ -0,0 +1,15 @@ +mixin simpleOr + //-simpleOr + +demo({ + html: ` +.test.-simpleOr +`, + scss: ` +$MQ-simpleOr: ( + (min-width, $BP-medium), + (min-height, 800px) +); +@include mq($MQ-simpleOr) { + background: $green; +}`, + }) diff --git a/unit-tests/or/simpleOr/simpleOr.scss b/unit-tests/or/simpleOr/simpleOr.scss new file mode 100644 index 0000000..8ee8720 --- /dev/null +++ b/unit-tests/or/simpleOr/simpleOr.scss @@ -0,0 +1,24 @@ +@import '../../test-dependencies.scss'; + +@mixin simpleOr { + $MQ-simpleOr: ( + (min-width, $BP-medium), + (min-height, 800px) + ); + @include mq($MQ-simpleOr) { + @content; + } +} + +@if ($test-only) { + .unitTest { + @include simpleOr { color: #000; } + } +} @else { + .test.-simpleOr { + &::before { content: 'mq($MQ-simpleOr)'; } + @include simpleOr { + @include isActive; + } + } +} diff --git a/unit-tests/or/simpleOr/test.js b/unit-tests/or/simpleOr/test.js new file mode 100644 index 0000000..07b3d6a --- /dev/null +++ b/unit-tests/or/simpleOr/test.js @@ -0,0 +1,3 @@ +import unitTest from '../../../gulp/helpers/unitTest'; + +unitTest('simpleOr', __dirname, '@media (min-width: 801px), (min-height: 801px){.unitTest{color:#000}}') diff --git a/unit-tests/plus/complexPlus/complexPlus.css b/unit-tests/plus/complexPlus/complexPlus.css new file mode 100644 index 0000000..cb0c9a2 --- /dev/null +++ b/unit-tests/plus/complexPlus/complexPlus.css @@ -0,0 +1 @@ +@media print and (max-width: 800px) and (min-width: 601px) and (max-aspect-ratio: 2 / 1) and (min-aspect-ratio: 1 / 1){.unitTest{color:#000}} diff --git a/unit-tests/plus/complexPlus/complexPlus.pug b/unit-tests/plus/complexPlus/complexPlus.pug new file mode 100644 index 0000000..3db7865 --- /dev/null +++ b/unit-tests/plus/complexPlus/complexPlus.pug @@ -0,0 +1,13 @@ +mixin complexPlus + //-complexPlus + +demo({ + html: ` +.test.-complexPlus +`, + scss: ` +//note that 'print' appplies to the full plus statement +$MQ-complexPlus: (inside-width, $BP-small, $BP-medium, 'print') plus (inside-ratio, '2/1', '1/1'); +@include mq($MQ-complexPlus) { + background: $green; +}`, + }) diff --git a/unit-tests/plus/complexPlus/complexPlus.scss b/unit-tests/plus/complexPlus/complexPlus.scss new file mode 100644 index 0000000..600b41c --- /dev/null +++ b/unit-tests/plus/complexPlus/complexPlus.scss @@ -0,0 +1,21 @@ +@import '../../test-dependencies.scss'; + +@mixin complexPlus { + $MQ-complexPlus: (inside-width, $BP-small, $BP-medium, 'print') plus (inside-ratio, '2/1', '1/1'); + @include mq($MQ-complexPlus) { + @content; + } +} + +@if ($test-only) { + .unitTest { + @include complexPlus { color: #000; } + } +} @else { + .test.-complexPlus { + &::before { content: 'mq($MQ-complexPlus)'; } + @include complexPlus { + @include isActive; + } + } +} diff --git a/unit-tests/plus/complexPlus/test.js b/unit-tests/plus/complexPlus/test.js new file mode 100644 index 0000000..ab8d21a --- /dev/null +++ b/unit-tests/plus/complexPlus/test.js @@ -0,0 +1,3 @@ +import unitTest from '../../../gulp/helpers/unitTest'; + +unitTest('complexPlus', __dirname, '@media print and (max-width: 800px) and (min-width: 601px) and (max-aspect-ratio: 2 / 1) and (min-aspect-ratio: 1 / 1){.unitTest{color:#000}}') diff --git a/unit-tests/plus/ignoredMediaType/ignoreMediaType.css b/unit-tests/plus/ignoredMediaType/ignoreMediaType.css new file mode 100644 index 0000000..128ebd5 --- /dev/null +++ b/unit-tests/plus/ignoredMediaType/ignoreMediaType.css @@ -0,0 +1 @@ +@media (max-width: 800px) and (min-width: 601px) and (max-aspect-ratio: 2 / 1) and (min-aspect-ratio: 1 / 1){.unitTest{color:#000}} diff --git a/unit-tests/plus/ignoredMediaType/ignoreMediaType.scss b/unit-tests/plus/ignoredMediaType/ignoreMediaType.scss new file mode 100644 index 0000000..bbe885e --- /dev/null +++ b/unit-tests/plus/ignoredMediaType/ignoreMediaType.scss @@ -0,0 +1,21 @@ +@import '../../test-dependencies.scss'; + +@mixin ignoredMediaType { + $MQ-ignoredMediaType: (inside-width, $BP-small, $BP-medium) plus (inside-ratio, '2/1', '1/1', 'print'); + @include mq($MQ-ignoredMediaType) { + @content; + } +} + +@if ($test-only) { + .unitTest { + @include ignoredMediaType { color: #000; } + } +} @else { + .test.-ignoredMediaType { + &::before { content: 'mq($MQ-ignoredMediaType)'; } + @include ignoredMediaType { + @include isActive; + } + } +} diff --git a/unit-tests/plus/ignoredMediaType/ignoredMediaType.pug b/unit-tests/plus/ignoredMediaType/ignoredMediaType.pug new file mode 100644 index 0000000..32f7134 --- /dev/null +++ b/unit-tests/plus/ignoredMediaType/ignoredMediaType.pug @@ -0,0 +1,14 @@ +mixin ignoredMediaType + //-ignoredMediaType + +demo({ + html: ` +.test.-ignoredMediaType +`, + scss: ` +//The media type in the second plus statement is ignored +//Only media types in the first definition are honoured in a plus statement +$MQ-ignoredMediaType: (inside-width, $BP-small, $BP-medium) plus (inside-ratio, '2/1', '1/1', 'print'); +@include mq($MQ-ignoredMediaType) { + background: $green; +}`, + }) diff --git a/unit-tests/plus/ignoredMediaType/test.js b/unit-tests/plus/ignoredMediaType/test.js new file mode 100644 index 0000000..1d61809 --- /dev/null +++ b/unit-tests/plus/ignoredMediaType/test.js @@ -0,0 +1,3 @@ +import unitTest from '../../../gulp/helpers/unitTest'; + +unitTest('ignoreMediaType', __dirname, '@media (max-width: 800px) and (min-width: 601px) and (max-aspect-ratio: 2 / 1) and (min-aspect-ratio: 1 / 1){.unitTest{color:#000}}') diff --git a/unit-tests/plus/inlinePlus/inlinePlus.css b/unit-tests/plus/inlinePlus/inlinePlus.css new file mode 100644 index 0000000..716b58d --- /dev/null +++ b/unit-tests/plus/inlinePlus/inlinePlus.css @@ -0,0 +1 @@ +@media (min-width: 801px) and (min-height: 601px){.unitTest{color:#000}} diff --git a/unit-tests/plus/inlinePlus/inlinePlus.pug b/unit-tests/plus/inlinePlus/inlinePlus.pug new file mode 100644 index 0000000..1bba9e4 --- /dev/null +++ b/unit-tests/plus/inlinePlus/inlinePlus.pug @@ -0,0 +1,12 @@ +mixin inlinePlus + //-inlinePlus + +demo({ + html: ` +.test.-inlinePlus +`, + scss: ` +//inline plus statement +@include mq((min-width, $BP-medium) plus (min-height, 600px)) { + background: $green; +}`, + }) diff --git a/unit-tests/plus/inlinePlus/inlinePlus.scss b/unit-tests/plus/inlinePlus/inlinePlus.scss new file mode 100644 index 0000000..bc9e552 --- /dev/null +++ b/unit-tests/plus/inlinePlus/inlinePlus.scss @@ -0,0 +1,21 @@ +@import '../../test-dependencies.scss'; + +@mixin inlinePlus { + $MQ-simplePlus: (min-width, $BP-medium) plus (min-height, 600px); + @include mq((min-width, $BP-medium) plus (min-height, 600px)) { + @content; + } +} + +@if ($test-only) { + .unitTest { + @include inlinePlus { color: #000; } + } +} @else { + .test.-inlinePlus { + &::before { content: "mq((min-width, #{$BP-medium}) plus (min-height, 600px))"; } + @include inlinePlus { + @include isActive; + } + } +} diff --git a/unit-tests/plus/inlinePlus/test.js b/unit-tests/plus/inlinePlus/test.js new file mode 100644 index 0000000..38a2aec --- /dev/null +++ b/unit-tests/plus/inlinePlus/test.js @@ -0,0 +1,3 @@ +import unitTest from '../../../gulp/helpers/unitTest'; + +unitTest('inlinePlus', __dirname, '@media (min-width: 801px) and (min-height: 601px){.unitTest{color:#000}}') diff --git a/unit-tests/plus/mediaOnlyPlus/mediaOnlyPlus.css b/unit-tests/plus/mediaOnlyPlus/mediaOnlyPlus.css new file mode 100644 index 0000000..51c49ff --- /dev/null +++ b/unit-tests/plus/mediaOnlyPlus/mediaOnlyPlus.css @@ -0,0 +1 @@ +@media screen and (min-width: 801px){.unitTest{color:#000}} diff --git a/unit-tests/plus/mediaOnlyPlus/mediaOnlyPlus.pug b/unit-tests/plus/mediaOnlyPlus/mediaOnlyPlus.pug new file mode 100644 index 0000000..9ca6945 --- /dev/null +++ b/unit-tests/plus/mediaOnlyPlus/mediaOnlyPlus.pug @@ -0,0 +1,11 @@ +mixin mediaOnlyPlus + //-mediaOnlyPlus + +demo({ + html: ` +.test.-mediaOnlyPlus +`, + scss: ` +@include mq('screen' plus (min, $BP-medium)) { + background: $green; +}`, + }) diff --git a/unit-tests/plus/mediaOnlyPlus/mediaOnlyPlus.scss b/unit-tests/plus/mediaOnlyPlus/mediaOnlyPlus.scss new file mode 100644 index 0000000..d865e6f --- /dev/null +++ b/unit-tests/plus/mediaOnlyPlus/mediaOnlyPlus.scss @@ -0,0 +1,20 @@ +@import '../../test-dependencies.scss'; + +@mixin mediaOnlyPlus { + @include mq('screen' plus (min, $BP-medium)) { + @content; + } +} + +@if ($test-only) { + .unitTest { + @include mediaOnlyPlus { color: #000; } + } +} @else { + .test.-mediaOnlyPlus { + &::before { content: "mq('screen' plus (min, #{$BP-medium}))"; } + @include mediaOnlyPlus { + @include isActive; + } + } +} diff --git a/unit-tests/plus/mediaOnlyPlus/test.js b/unit-tests/plus/mediaOnlyPlus/test.js new file mode 100644 index 0000000..5c8c5f3 --- /dev/null +++ b/unit-tests/plus/mediaOnlyPlus/test.js @@ -0,0 +1,3 @@ +import unitTest from '../../../gulp/helpers/unitTest'; + +unitTest('mediaOnlyPlus', __dirname, '@media screen and (min-width: 801px){.unitTest{color:#000}}') diff --git a/unit-tests/plus/multiPlus/multiPlus.css b/unit-tests/plus/multiPlus/multiPlus.css new file mode 100644 index 0000000..65d5c5b --- /dev/null +++ b/unit-tests/plus/multiPlus/multiPlus.css @@ -0,0 +1 @@ +@media screen and (min-width: 801px) and (min-height: 401px) and (max-width: 1000px) and (min-width: 601px) and (max-aspect-ratio: 2 / 1) and (min-aspect-ratio: 1 / 1){.unitTest{color:#000}} diff --git a/unit-tests/plus/multiPlus/multiPlus.pug b/unit-tests/plus/multiPlus/multiPlus.pug new file mode 100644 index 0000000..84d4ce3 --- /dev/null +++ b/unit-tests/plus/multiPlus/multiPlus.pug @@ -0,0 +1,19 @@ +mixin multiPlus + //-multiPlus + +demo({ + html: ` +.test.-multiPlus +`, + scss: ` +$MQ-multiPlus: ( + ('screen') plus + (min-width, $BP-medium) plus + (min-height, 400px) plus + (inside, $BP-small, $BP-large) plus + (inside-ratio, '2/1', '1/1') +); + +@include mq($MQ-multiPlus) { + background: $green; +}`, + }) diff --git a/unit-tests/plus/multiPlus/multiPlus.scss b/unit-tests/plus/multiPlus/multiPlus.scss new file mode 100644 index 0000000..fb0b384 --- /dev/null +++ b/unit-tests/plus/multiPlus/multiPlus.scss @@ -0,0 +1,27 @@ +@import '../../test-dependencies.scss'; + +@mixin multiPlus { + $MQ-multiPlus: ( + ('screen') plus + (min-width, $BP-medium) plus + (min-height, 400px) plus + (inside, $BP-small, $BP-large) plus + (inside-ratio, '2/1', '1/1') + ); + @include mq($MQ-multiPlus) { + @content; + } +} + +@if ($test-only) { + .unitTest { + @include multiPlus { color: #000; } + } +} @else { + .test.-multiPlus { + &::before { content: 'mq($MQ-multiPlus)'; } + @include multiPlus { + @include isActive; + } + } +} diff --git a/unit-tests/plus/multiPlus/test.js b/unit-tests/plus/multiPlus/test.js new file mode 100644 index 0000000..2351448 --- /dev/null +++ b/unit-tests/plus/multiPlus/test.js @@ -0,0 +1,3 @@ +import unitTest from '../../../gulp/helpers/unitTest'; + +unitTest('multiPlus', __dirname, '@media screen and (min-width: 801px) and (min-height: 401px) and (max-width: 1000px) and (min-width: 601px) and (max-aspect-ratio: 2 / 1) and (min-aspect-ratio: 1 / 1){.unitTest{color:#000}}') diff --git a/unit-tests/plus/simplePlus/simplePlus.css b/unit-tests/plus/simplePlus/simplePlus.css new file mode 100644 index 0000000..716b58d --- /dev/null +++ b/unit-tests/plus/simplePlus/simplePlus.css @@ -0,0 +1 @@ +@media (min-width: 801px) and (min-height: 601px){.unitTest{color:#000}} diff --git a/unit-tests/plus/simplePlus/simplePlus.pug b/unit-tests/plus/simplePlus/simplePlus.pug new file mode 100644 index 0000000..ad64fb4 --- /dev/null +++ b/unit-tests/plus/simplePlus/simplePlus.pug @@ -0,0 +1,12 @@ +mixin simplePlus + //-simplePlus + +demo({ + html: ` +.test.-simplePlus +`, + scss: ` +$MQ-simplePlus: (min-width, $BP-medium) plus (min-height, 600px); +@include mq($MQ-simplePlus) { + background: $green; +}`, + }) diff --git a/unit-tests/plus/simplePlus/simplePlus.scss b/unit-tests/plus/simplePlus/simplePlus.scss new file mode 100644 index 0000000..37bdcbe --- /dev/null +++ b/unit-tests/plus/simplePlus/simplePlus.scss @@ -0,0 +1,21 @@ +@import '../../test-dependencies.scss'; + +@mixin simplePlus { + $MQ-simplePlus: (min-width, $BP-medium) plus (min-height, 600px); + @include mq($MQ-simplePlus) { + @content; + } +} + +@if ($test-only) { + .unitTest { + @include simplePlus { color: #000; } + } +} @else { + .test.-simplePlus { + &::before { content: 'mq($MQ-simplePlus)'; } + @include simplePlus { + @include isActive; + } + } +} diff --git a/unit-tests/plus/simplePlus/test.js b/unit-tests/plus/simplePlus/test.js new file mode 100644 index 0000000..58637d4 --- /dev/null +++ b/unit-tests/plus/simplePlus/test.js @@ -0,0 +1,3 @@ +import unitTest from '../../../gulp/helpers/unitTest'; + +unitTest('simplePlus', __dirname, '@media (min-width: 801px) and (min-height: 601px){.unitTest{color:#000}}') diff --git a/unit-tests/ratio/exactRatioWorkAround1/exactRatioWorkAround1.css b/unit-tests/ratio/exactRatioWorkAround1/exactRatioWorkAround1.css new file mode 100644 index 0000000..8791d7f --- /dev/null +++ b/unit-tests/ratio/exactRatioWorkAround1/exactRatioWorkAround1.css @@ -0,0 +1 @@ +@media not screen and (max-aspect-ratio: 2 / 1){.unitTest{color:#000}} diff --git a/unit-tests/ratio/exactRatioWorkAround1/exactRatioWorkAround1.pug b/unit-tests/ratio/exactRatioWorkAround1/exactRatioWorkAround1.pug new file mode 100644 index 0000000..3761bd1 --- /dev/null +++ b/unit-tests/ratio/exactRatioWorkAround1/exactRatioWorkAround1.pug @@ -0,0 +1,13 @@ +mixin exactRatioWorkAround1 + //-exactRatioWorkAround1 + +demo({ + html: ` +.test.-exactRatioWorkAround1 +`, + scss: ` +//equivalent to (min-ratio, '2 / 1') but without the 1px sour spot +$MQ-exactRatioWorkAround1: (max-ratio, '2 / 1', 'not'); +@include mq($MQ-exactRatioWorkAround1) { + background: $green; +}`, + }) diff --git a/unit-tests/ratio/exactRatioWorkAround1/exactRatioWorkAround1.scss b/unit-tests/ratio/exactRatioWorkAround1/exactRatioWorkAround1.scss new file mode 100644 index 0000000..131aa9d --- /dev/null +++ b/unit-tests/ratio/exactRatioWorkAround1/exactRatioWorkAround1.scss @@ -0,0 +1,21 @@ +@import '../../test-dependencies.scss'; + +@mixin exactRatioWorkAround1 { + $MQ-exactRatioWorkAround1: (max-ratio, '2 / 1', 'not'); + @include mq($MQ-exactRatioWorkAround1) { + @content; + } +} + +@if ($test-only) { + .unitTest { + @include exactRatioWorkAround1 { color: #000; } + } +} @else { + .test.-exactRatioWorkAround1 { + &::before { content: 'mq($MQ-exactRatioWorkAround1)'; } + @include exactRatioWorkAround1 { + @include isActive; + } + } +} diff --git a/unit-tests/ratio/exactRatioWorkAround1/test.js b/unit-tests/ratio/exactRatioWorkAround1/test.js new file mode 100644 index 0000000..1c85f71 --- /dev/null +++ b/unit-tests/ratio/exactRatioWorkAround1/test.js @@ -0,0 +1,3 @@ +import unitTest from '../../../gulp/helpers/unitTest'; + +unitTest('exactRatioWorkAround1', __dirname, '@media not screen and (max-aspect-ratio: 2 / 1){.unitTest{color:#000}}') diff --git a/unit-tests/ratio/exactRatioWorkAround2/exactRatioWorkAround2.css b/unit-tests/ratio/exactRatioWorkAround2/exactRatioWorkAround2.css new file mode 100644 index 0000000..8791d7f --- /dev/null +++ b/unit-tests/ratio/exactRatioWorkAround2/exactRatioWorkAround2.css @@ -0,0 +1 @@ +@media not screen and (max-aspect-ratio: 2 / 1){.unitTest{color:#000}} diff --git a/unit-tests/ratio/exactRatioWorkAround2/exactRatioWorkAround2.pug b/unit-tests/ratio/exactRatioWorkAround2/exactRatioWorkAround2.pug new file mode 100644 index 0000000..26a45a1 --- /dev/null +++ b/unit-tests/ratio/exactRatioWorkAround2/exactRatioWorkAround2.pug @@ -0,0 +1,13 @@ +mixin exactRatioWorkAround2 + //-exactRatioWorkAround2 + +demo({ + html: ` +.test.-exactRatioWorkAround2 +`, + scss: ` +//Exactly the same as above but formatted differently +$MQ-exactRatioWorkAround2: 'not' plus (max-ratio, '2 / 1'); +@include mq($MQ-exactRatioWorkAround2) { + background: $green; +}`, + }) diff --git a/unit-tests/ratio/exactRatioWorkAround2/exactRatioWorkAround2.scss b/unit-tests/ratio/exactRatioWorkAround2/exactRatioWorkAround2.scss new file mode 100644 index 0000000..5945778 --- /dev/null +++ b/unit-tests/ratio/exactRatioWorkAround2/exactRatioWorkAround2.scss @@ -0,0 +1,21 @@ +@import '../../test-dependencies.scss'; + +@mixin exactRatioWorkAround2 { + $MQ-exactRatioWorkAround2: 'not' plus (max-ratio, '2 / 1'); + @include mq($MQ-exactRatioWorkAround2) { + @content; + } +} + +@if ($test-only) { + .unitTest { + @include exactRatioWorkAround2 { color: #000; } + } +} @else { + .test.-exactRatioWorkAround2 { + &::before { content: 'mq($MQ-exactRatioWorkAround2)'; } + @include exactRatioWorkAround2 { + @include isActive; + } + } +} diff --git a/unit-tests/ratio/exactRatioWorkAround2/test.js b/unit-tests/ratio/exactRatioWorkAround2/test.js new file mode 100644 index 0000000..b1c6b90 --- /dev/null +++ b/unit-tests/ratio/exactRatioWorkAround2/test.js @@ -0,0 +1,3 @@ +import unitTest from '../../../gulp/helpers/unitTest'; + +unitTest('exactRatioWorkAround2', __dirname, '@media not screen and (max-aspect-ratio: 2 / 1){.unitTest{color:#000}}') diff --git a/unit-tests/ratio/exactRatioWorkAround3/exactRatioWorkAround3.css b/unit-tests/ratio/exactRatioWorkAround3/exactRatioWorkAround3.css new file mode 100644 index 0000000..8791d7f --- /dev/null +++ b/unit-tests/ratio/exactRatioWorkAround3/exactRatioWorkAround3.css @@ -0,0 +1 @@ +@media not screen and (max-aspect-ratio: 2 / 1){.unitTest{color:#000}} diff --git a/unit-tests/ratio/exactRatioWorkAround3/exactRatioWorkAround3.pug b/unit-tests/ratio/exactRatioWorkAround3/exactRatioWorkAround3.pug new file mode 100644 index 0000000..688ca1f --- /dev/null +++ b/unit-tests/ratio/exactRatioWorkAround3/exactRatioWorkAround3.pug @@ -0,0 +1,13 @@ +mixin exactRatioWorkAround3 + //-exactRatioWorkAround3 + +demo({ + html: ` +.test.-exactRatioWorkAround3 +`, + scss: ` +//The same again this time inline +@include mq(max-ratio, '2 / 1', 'not') { + background: $green; +} +`, + }) diff --git a/unit-tests/ratio/exactRatioWorkAround3/exactRatioWorkAround3.scss b/unit-tests/ratio/exactRatioWorkAround3/exactRatioWorkAround3.scss new file mode 100644 index 0000000..37cc257 --- /dev/null +++ b/unit-tests/ratio/exactRatioWorkAround3/exactRatioWorkAround3.scss @@ -0,0 +1,20 @@ +@import '../../test-dependencies.scss'; + +@mixin exactRatioWorkAround3 { + @include mq(max-ratio, '2 / 1', 'not') { + @content; + } +} + +@if ($test-only) { + .unitTest { + @include exactRatioWorkAround3 { color: #000; } + } +} @else { + .test.-exactRatioWorkAround3 { + &::before { content: "mq(max-ratio, '2 / 1', 'not')"; } + @include exactRatioWorkAround3 { + @include isActive; + } + } +} diff --git a/unit-tests/ratio/exactRatioWorkAround3/test.js b/unit-tests/ratio/exactRatioWorkAround3/test.js new file mode 100644 index 0000000..24ce272 --- /dev/null +++ b/unit-tests/ratio/exactRatioWorkAround3/test.js @@ -0,0 +1,3 @@ +import unitTest from '../../../gulp/helpers/unitTest'; + +unitTest('exactRatioWorkAround3', __dirname, '@media not screen and (max-aspect-ratio: 2 / 1){.unitTest{color:#000}}') diff --git a/unit-tests/ratio/insideRatio/insideRatio.css b/unit-tests/ratio/insideRatio/insideRatio.css new file mode 100644 index 0000000..295bc58 --- /dev/null +++ b/unit-tests/ratio/insideRatio/insideRatio.css @@ -0,0 +1 @@ +@media (max-aspect-ratio: 2 / 1) and (min-aspect-ratio: 1 / 1){.unitTest{color:#000}} diff --git a/unit-tests/ratio/insideRatio/insideRatio.pug b/unit-tests/ratio/insideRatio/insideRatio.pug new file mode 100644 index 0000000..7c3579d --- /dev/null +++ b/unit-tests/ratio/insideRatio/insideRatio.pug @@ -0,0 +1,11 @@ +mixin insideRatio + //-insideRatio + +demo({ + html: ` +.test.-insideRatio +`, + scss: ` +@include mq(inside-ratio, "2 / 1", "1 / 1") { + background: $green; +}`, + }) diff --git a/unit-tests/ratio/insideRatio/insideRatio.scss b/unit-tests/ratio/insideRatio/insideRatio.scss new file mode 100644 index 0000000..5109c8d --- /dev/null +++ b/unit-tests/ratio/insideRatio/insideRatio.scss @@ -0,0 +1,20 @@ +@import '../../test-dependencies.scss'; + +@mixin insideRatio { + @include mq(inside-ratio, "2 / 1", "1 / 1") { + @content; + } +} + +@if ($test-only) { + .unitTest { + @include insideRatio { color: #000; } + } +} @else { + .test.-insideRatio { + &::before { content: 'mq(inside-ratio, "2 / 1", "1 / 1")'; } + @include insideRatio { + @include isActive; + } + } +} diff --git a/unit-tests/ratio/insideRatio/test.js b/unit-tests/ratio/insideRatio/test.js new file mode 100644 index 0000000..e020d18 --- /dev/null +++ b/unit-tests/ratio/insideRatio/test.js @@ -0,0 +1,3 @@ +import unitTest from '../../../gulp/helpers/unitTest'; + +unitTest('insideRatio', __dirname, '@media (max-aspect-ratio: 2 / 1) and (min-aspect-ratio: 1 / 1){.unitTest{color:#000}}') diff --git a/unit-tests/ratio/insideRatioVar/insideRatioVar.css b/unit-tests/ratio/insideRatioVar/insideRatioVar.css new file mode 100644 index 0000000..295bc58 --- /dev/null +++ b/unit-tests/ratio/insideRatioVar/insideRatioVar.css @@ -0,0 +1 @@ +@media (max-aspect-ratio: 2 / 1) and (min-aspect-ratio: 1 / 1){.unitTest{color:#000}} diff --git a/unit-tests/ratio/insideRatioVar/insideRatioVar.pug b/unit-tests/ratio/insideRatioVar/insideRatioVar.pug new file mode 100644 index 0000000..75d8e00 --- /dev/null +++ b/unit-tests/ratio/insideRatioVar/insideRatioVar.pug @@ -0,0 +1,12 @@ +mixin insideRatioVar + //-insideRatioVar + +demo({ + html: ` +.test.-insideRatioVar +`, + scss: ` +$MQ-insideRatioVar: (inside-ratio, "2 / 1", "1 / 1"); +@include mq($MQ-insideRatioVar) { + background: $green; +}`, + }) diff --git a/unit-tests/ratio/insideRatioVar/insideRatioVar.scss b/unit-tests/ratio/insideRatioVar/insideRatioVar.scss new file mode 100644 index 0000000..a4d7ea4 --- /dev/null +++ b/unit-tests/ratio/insideRatioVar/insideRatioVar.scss @@ -0,0 +1,21 @@ +@import '../../test-dependencies.scss'; + +@mixin insideRatioVar { + $MQ-insideRatioVar: (inside-ratio, "2 / 1", "1 / 1"); + @include mq($MQ-insideRatioVar) { + @content; + } +} + +@if ($test-only) { + .unitTest { + @include insideRatioVar { color: #000; } + } +} @else { + .test.-insideRatioVar { + &::before { content: 'mq($MQ-insideRatioVar)'; } + @include insideRatioVar { + @include isActive; + } + } +} diff --git a/unit-tests/ratio/insideRatioVar/test.js b/unit-tests/ratio/insideRatioVar/test.js new file mode 100644 index 0000000..aa85ba1 --- /dev/null +++ b/unit-tests/ratio/insideRatioVar/test.js @@ -0,0 +1,3 @@ +import unitTest from '../../../gulp/helpers/unitTest'; + +unitTest('insideRatioVar', __dirname, '@media (max-aspect-ratio: 2 / 1) and (min-aspect-ratio: 1 / 1){.unitTest{color:#000}}') diff --git a/unit-tests/ratio/maxRatio/maxRatio.css b/unit-tests/ratio/maxRatio/maxRatio.css new file mode 100644 index 0000000..afcdde4 --- /dev/null +++ b/unit-tests/ratio/maxRatio/maxRatio.css @@ -0,0 +1 @@ +@media (max-aspect-ratio: 2 / 1){.unitTest{color:#000}} diff --git a/unit-tests/ratio/maxRatio/maxRatio.pug b/unit-tests/ratio/maxRatio/maxRatio.pug new file mode 100644 index 0000000..d53430a --- /dev/null +++ b/unit-tests/ratio/maxRatio/maxRatio.pug @@ -0,0 +1,11 @@ +mixin maxRatio + //-maxRatio + +demo({ + html: ` +.test.-maxRatio +`, + scss: ` +@include mq(max-ratio, "2 / 1") { + background: $green; +}`, + }) diff --git a/unit-tests/ratio/maxRatio/maxRatio.scss b/unit-tests/ratio/maxRatio/maxRatio.scss new file mode 100644 index 0000000..459c21e --- /dev/null +++ b/unit-tests/ratio/maxRatio/maxRatio.scss @@ -0,0 +1,20 @@ +@import '../../test-dependencies.scss'; + +@mixin maxRatio { + @include mq(max-ratio, "2 / 1") { + @content; + } +} + +@if ($test-only) { + .unitTest { + @include maxRatio { color: #000; } + } +} @else { + .test.-maxRatio { + &::before { content: 'mq(max-ratio, "2 / 1")'; } + @include maxRatio { + @include isActive; + } + } +} diff --git a/unit-tests/ratio/maxRatio/test.js b/unit-tests/ratio/maxRatio/test.js new file mode 100644 index 0000000..82748ca --- /dev/null +++ b/unit-tests/ratio/maxRatio/test.js @@ -0,0 +1,3 @@ +import unitTest from '../../../gulp/helpers/unitTest'; + +unitTest('maxRatio', __dirname, '@media (max-aspect-ratio: 2 / 1){.unitTest{color:#000}}') diff --git a/unit-tests/ratio/maxRatioVar/maxRatioVar.css b/unit-tests/ratio/maxRatioVar/maxRatioVar.css new file mode 100644 index 0000000..afcdde4 --- /dev/null +++ b/unit-tests/ratio/maxRatioVar/maxRatioVar.css @@ -0,0 +1 @@ +@media (max-aspect-ratio: 2 / 1){.unitTest{color:#000}} diff --git a/unit-tests/ratio/maxRatioVar/maxRatioVar.pug b/unit-tests/ratio/maxRatioVar/maxRatioVar.pug new file mode 100644 index 0000000..9d3963f --- /dev/null +++ b/unit-tests/ratio/maxRatioVar/maxRatioVar.pug @@ -0,0 +1,12 @@ +mixin maxRatioVar + //-maxRatioVar + +demo({ + html: ` +.test.-maxRatioVar +`, + scss: ` +$MQ-maxRatioVar: (max-ratio, "2 / 1"); +@include mq($MQ-maxRatioVar) { + background: $green; +}`, + }) diff --git a/unit-tests/ratio/maxRatioVar/maxRatioVar.scss b/unit-tests/ratio/maxRatioVar/maxRatioVar.scss new file mode 100644 index 0000000..d02fd11 --- /dev/null +++ b/unit-tests/ratio/maxRatioVar/maxRatioVar.scss @@ -0,0 +1,21 @@ +@import '../../test-dependencies.scss'; + +@mixin maxRatioVar { + $MQ-maxRatioVar: (max-ratio, "2 / 1"); + @include mq($MQ-maxRatioVar) { + @content; + } +} + +@if ($test-only) { + .unitTest { + @include maxRatioVar { color: #000; } + } +} @else { + .test.-maxRatioVar { + &::before { content: 'mq($MQ-maxRatioVar)'; } + @include maxRatioVar { + @include isActive; + } + } +} diff --git a/unit-tests/ratio/maxRatioVar/test.js b/unit-tests/ratio/maxRatioVar/test.js new file mode 100644 index 0000000..b0684d8 --- /dev/null +++ b/unit-tests/ratio/maxRatioVar/test.js @@ -0,0 +1,3 @@ +import unitTest from '../../../gulp/helpers/unitTest'; + +unitTest('maxRatioVar', __dirname, '@media (max-aspect-ratio: 2 / 1){.unitTest{color:#000}}') diff --git a/unit-tests/ratio/minRatio/minRatio.css b/unit-tests/ratio/minRatio/minRatio.css new file mode 100644 index 0000000..c099382 --- /dev/null +++ b/unit-tests/ratio/minRatio/minRatio.css @@ -0,0 +1 @@ +@media (min-aspect-ratio: 2 / 1){.unitTest{color:#000}} diff --git a/unit-tests/ratio/minRatio/minRatio.pug b/unit-tests/ratio/minRatio/minRatio.pug new file mode 100644 index 0000000..e98191d --- /dev/null +++ b/unit-tests/ratio/minRatio/minRatio.pug @@ -0,0 +1,11 @@ +mixin minRatio + //-minRatio + +demo({ + html: ` +.test.-minRatio +`, + scss: ` +@include mq(min-ratio, "2 / 1") { + background: $green; +}`, + }) diff --git a/unit-tests/ratio/minRatio/minRatio.scss b/unit-tests/ratio/minRatio/minRatio.scss new file mode 100644 index 0000000..f5686f5 --- /dev/null +++ b/unit-tests/ratio/minRatio/minRatio.scss @@ -0,0 +1,20 @@ +@import '../../test-dependencies.scss'; + +@mixin minRatio { + @include mq(min-ratio, "2 / 1") { + @content; + } +} + +@if ($test-only) { + .unitTest { + @include minRatio { color: #000; } + } +} @else { + .test.-minRatio { + &::before { content: 'mq(min-ratio, "2 / 1")'; } + @include minRatio { + @include isActive; + } + } +} diff --git a/unit-tests/ratio/minRatio/test.js b/unit-tests/ratio/minRatio/test.js new file mode 100644 index 0000000..9ce69cd --- /dev/null +++ b/unit-tests/ratio/minRatio/test.js @@ -0,0 +1,3 @@ +import unitTest from '../../../gulp/helpers/unitTest'; + +unitTest('minRatio', __dirname, '@media (min-aspect-ratio: 2 / 1){.unitTest{color:#000}}') diff --git a/unit-tests/ratio/minRatioVar/minRatioVar.css b/unit-tests/ratio/minRatioVar/minRatioVar.css new file mode 100644 index 0000000..c099382 --- /dev/null +++ b/unit-tests/ratio/minRatioVar/minRatioVar.css @@ -0,0 +1 @@ +@media (min-aspect-ratio: 2 / 1){.unitTest{color:#000}} diff --git a/unit-tests/ratio/minRatioVar/minRatioVar.pug b/unit-tests/ratio/minRatioVar/minRatioVar.pug new file mode 100644 index 0000000..738b214 --- /dev/null +++ b/unit-tests/ratio/minRatioVar/minRatioVar.pug @@ -0,0 +1,12 @@ +mixin minRatioVar + //-minRatioVar + +demo({ + html: ` +.test.-minRatioVar +`, + scss: ` +$MQ-minRatioVar: (min-ratio, "2 / 1"); +@include mq($MQ-minRatioVar) { + background: $green; +}`, + }) diff --git a/unit-tests/ratio/minRatioVar/minRatioVar.scss b/unit-tests/ratio/minRatioVar/minRatioVar.scss new file mode 100644 index 0000000..2e9008c --- /dev/null +++ b/unit-tests/ratio/minRatioVar/minRatioVar.scss @@ -0,0 +1,21 @@ +@import '../../test-dependencies.scss'; + +@mixin minRatioVar { + $MQ-minRatioVar: (min-ratio, "2 / 1"); + @include mq($MQ-minRatioVar) { + @content; + } +} + +@if ($test-only) { + .unitTest { + @include minRatioVar { color: #000; } + } +} @else { + .test.-minRatioVar { + &::before { content: 'mq($MQ-minRatioVar)'; } + @include minRatioVar { + @include isActive; + } + } +} diff --git a/unit-tests/ratio/minRatioVar/test.js b/unit-tests/ratio/minRatioVar/test.js new file mode 100644 index 0000000..844d60d --- /dev/null +++ b/unit-tests/ratio/minRatioVar/test.js @@ -0,0 +1,3 @@ +import unitTest from '../../../gulp/helpers/unitTest'; + +unitTest('minRatioVar', __dirname, '@media (min-aspect-ratio: 2 / 1){.unitTest{color:#000}}') diff --git a/unit-tests/ratio/outsideRatio/outsideRatio.css b/unit-tests/ratio/outsideRatio/outsideRatio.css new file mode 100644 index 0000000..586548f --- /dev/null +++ b/unit-tests/ratio/outsideRatio/outsideRatio.css @@ -0,0 +1 @@ +@media (max-aspect-ratio: 1 / 1), (min-aspect-ratio: 2 / 1){.unitTest{color:#000}} diff --git a/unit-tests/ratio/outsideRatio/outsideRatio.pug b/unit-tests/ratio/outsideRatio/outsideRatio.pug new file mode 100644 index 0000000..ad50324 --- /dev/null +++ b/unit-tests/ratio/outsideRatio/outsideRatio.pug @@ -0,0 +1,11 @@ +mixin outsideRatio + //-outsideRatio + +demo({ + html: ` +.test.-outsideRatio +`, + scss: ` +@include mq(outside-ratio, "2 / 1", "1 / 1") { + background: $green; +}`, + }) diff --git a/unit-tests/ratio/outsideRatio/outsideRatio.scss b/unit-tests/ratio/outsideRatio/outsideRatio.scss new file mode 100644 index 0000000..595728e --- /dev/null +++ b/unit-tests/ratio/outsideRatio/outsideRatio.scss @@ -0,0 +1,20 @@ +@import '../../test-dependencies.scss'; + +@mixin outsideRatio { + @include mq(outside-ratio, "1 / 1", "2 / 1") { + @content; + } +} + +@if ($test-only) { + .unitTest { + @include outsideRatio { color: #000; } + } +} @else { + .test.-outsideRatio { + &::before { content: 'mq(outside-ratio, "1 / 1", "2 / 1")'; } + @include outsideRatio { + @include isActive; + } + } +} diff --git a/unit-tests/ratio/outsideRatio/test.js b/unit-tests/ratio/outsideRatio/test.js new file mode 100644 index 0000000..eff9102 --- /dev/null +++ b/unit-tests/ratio/outsideRatio/test.js @@ -0,0 +1,3 @@ +import unitTest from '../../../gulp/helpers/unitTest'; + +unitTest('outsideRatio', __dirname, '@media (max-aspect-ratio: 1 / 1), (min-aspect-ratio: 2 / 1){.unitTest{color:#000}}') diff --git a/unit-tests/ratio/outsideRatioVar/outsideRatioVar.css b/unit-tests/ratio/outsideRatioVar/outsideRatioVar.css new file mode 100644 index 0000000..586548f --- /dev/null +++ b/unit-tests/ratio/outsideRatioVar/outsideRatioVar.css @@ -0,0 +1 @@ +@media (max-aspect-ratio: 1 / 1), (min-aspect-ratio: 2 / 1){.unitTest{color:#000}} diff --git a/unit-tests/ratio/outsideRatioVar/outsideRatioVar.pug b/unit-tests/ratio/outsideRatioVar/outsideRatioVar.pug new file mode 100644 index 0000000..7d1c79f --- /dev/null +++ b/unit-tests/ratio/outsideRatioVar/outsideRatioVar.pug @@ -0,0 +1,12 @@ +mixin outsideRatioVar + //-outsideRatioVar + +demo({ + html: ` +.test.-outsideRatioVar +`, + scss: ` +$MQ-outsideRatioVar: (outside-ratio, "2 / 1", "1 / 1"); +@include mq($MQ-outsideRatioVar) { + background: $green; +}`, + }) diff --git a/unit-tests/ratio/outsideRatioVar/outsideRatioVar.scss b/unit-tests/ratio/outsideRatioVar/outsideRatioVar.scss new file mode 100644 index 0000000..b7d47c4 --- /dev/null +++ b/unit-tests/ratio/outsideRatioVar/outsideRatioVar.scss @@ -0,0 +1,21 @@ +@import '../../test-dependencies.scss'; + +@mixin outsideRatioVar { + $MQ-outsideRatioVar: (outside-ratio, "2 / 1", "1 / 1"); + @include mq($MQ-outsideRatioVar) { + @content; + } +} + +@if ($test-only) { + .unitTest { + @include outsideRatioVar { color: #000; } + } +} @else { + .test.-outsideRatioVar { + &::before { content: 'mq($MQ-outsideRatioVar)'; } + @include outsideRatioVar { + @include isActive; + } + } +} diff --git a/unit-tests/ratio/outsideRatioVar/test.js b/unit-tests/ratio/outsideRatioVar/test.js new file mode 100644 index 0000000..72c830d --- /dev/null +++ b/unit-tests/ratio/outsideRatioVar/test.js @@ -0,0 +1,3 @@ +import unitTest from '../../../gulp/helpers/unitTest'; + +unitTest('outsideRatioVar', __dirname, '@media (max-aspect-ratio: 1 / 1), (min-aspect-ratio: 2 / 1){.unitTest{color:#000}}') diff --git a/unit-tests/ratio/ratio/ratio.css b/unit-tests/ratio/ratio/ratio.css new file mode 100644 index 0000000..1ea60ce --- /dev/null +++ b/unit-tests/ratio/ratio/ratio.css @@ -0,0 +1 @@ +@media (aspect-ratio: 2 / 1){.unitTest{color:#000}} diff --git a/unit-tests/ratio/ratio/ratio.pug b/unit-tests/ratio/ratio/ratio.pug new file mode 100644 index 0000000..c31d7fb --- /dev/null +++ b/unit-tests/ratio/ratio/ratio.pug @@ -0,0 +1,11 @@ +mixin ratio + //-ratio + +demo({ + html: ` +.test.-ratio +`, + scss: ` +@include mq(ratio, "2 / 1") { + background: $green; +}`, + }) diff --git a/unit-tests/ratio/ratio/ratio.scss b/unit-tests/ratio/ratio/ratio.scss new file mode 100644 index 0000000..24005b7 --- /dev/null +++ b/unit-tests/ratio/ratio/ratio.scss @@ -0,0 +1,20 @@ +@import '../../test-dependencies.scss'; + +@mixin ratio { + @include mq(ratio, "2 / 1") { + @content; + } +} + +@if ($test-only) { + .unitTest { + @include ratio { color: #000; } + } +} @else { + .test.-ratio { + &::before { content: 'mq(ratio, "2 / 1")'; } + @include ratio { + @include isActive; + } + } +} diff --git a/unit-tests/ratio/ratio/test.js b/unit-tests/ratio/ratio/test.js new file mode 100644 index 0000000..6150cf8 --- /dev/null +++ b/unit-tests/ratio/ratio/test.js @@ -0,0 +1,3 @@ +import unitTest from '../../../gulp/helpers/unitTest'; + +unitTest('ratio', __dirname, '@media (aspect-ratio: 2 / 1){.unitTest{color:#000}}') diff --git a/unit-tests/ratio/ratioVar/ratioVar.css b/unit-tests/ratio/ratioVar/ratioVar.css new file mode 100644 index 0000000..1ea60ce --- /dev/null +++ b/unit-tests/ratio/ratioVar/ratioVar.css @@ -0,0 +1 @@ +@media (aspect-ratio: 2 / 1){.unitTest{color:#000}} diff --git a/unit-tests/ratio/ratioVar/ratioVar.pug b/unit-tests/ratio/ratioVar/ratioVar.pug new file mode 100644 index 0000000..eb88432 --- /dev/null +++ b/unit-tests/ratio/ratioVar/ratioVar.pug @@ -0,0 +1,12 @@ +mixin ratioVar + //-ratioVar + +demo({ + html: ` +.test.-ratioVar +`, + scss: ` +$MQ-ratioVar: (ratio, "2 / 1"); +@include mq($MQ-ratioVar) { + background: $green; +}`, + }) diff --git a/unit-tests/ratio/ratioVar/ratioVar.scss b/unit-tests/ratio/ratioVar/ratioVar.scss new file mode 100644 index 0000000..9892d0e --- /dev/null +++ b/unit-tests/ratio/ratioVar/ratioVar.scss @@ -0,0 +1,21 @@ +@import '../../test-dependencies.scss'; + +@mixin ratioVar { + $MQ-ratioVar: (ratio, "2 / 1"); + @include mq($MQ-ratioVar) { + @content; + } +} + +@if ($test-only) { + .unitTest { + @include ratioVar { color: #000; } + } +} @else { + .test.-ratioVar { + &::before { content: 'mq($MQ-ratioVar)'; } + @include ratioVar { + @include isActive; + } + } +} diff --git a/unit-tests/ratio/ratioVar/test.js b/unit-tests/ratio/ratioVar/test.js new file mode 100644 index 0000000..da64f6f --- /dev/null +++ b/unit-tests/ratio/ratioVar/test.js @@ -0,0 +1,3 @@ +import unitTest from '../../../gulp/helpers/unitTest'; + +unitTest('ratioVar', __dirname, '@media (aspect-ratio: 2 / 1){.unitTest{color:#000}}') diff --git a/unit-tests/test-dependencies.scss b/unit-tests/test-dependencies.scss new file mode 100644 index 0000000..5cd62c5 --- /dev/null +++ b/unit-tests/test-dependencies.scss @@ -0,0 +1,6 @@ +//loads the configuration settings for the site +@import '../src/_styles/00-config-files/03-BPs-MQs/00-bp-break-points-base.scss'; + +@import '../_mq.scss'; + +$test-only: true !default; diff --git a/unit-tests/test-styles.scss b/unit-tests/test-styles.scss new file mode 100644 index 0000000..4ac9ef3 --- /dev/null +++ b/unit-tests/test-styles.scss @@ -0,0 +1,39 @@ +$test-only: false; + +$red: #6D0808; +$green: #004700; + +.test { + padding: 30px; + border: 2px solid #000; + background: $red; + display: flex; + align-items: center; + justify-content: center; + margin-bottom: 20px; + + h3 { + margin-bottom: 0; + } + + &::before, &::after { + color: #fff; + white-space: pre; + } + + &::before { + font-size: 20px; + //Use "\A" to create new lines + } + + &::after { + content: ' = false'; + } +} + +@mixin isActive { + background: $green; + &::after { content: ' = true'; } +} + +@import '*/*/*.scss'; diff --git a/unit-tests/width/inside/inside.css b/unit-tests/width/inside/inside.css new file mode 100644 index 0000000..dba5234 --- /dev/null +++ b/unit-tests/width/inside/inside.css @@ -0,0 +1 @@ +@media (max-width: 800px) and (min-width: 601px){.unitTest{color:#000}} diff --git a/unit-tests/width/inside/inside.pug b/unit-tests/width/inside/inside.pug new file mode 100644 index 0000000..7fd54b8 --- /dev/null +++ b/unit-tests/width/inside/inside.pug @@ -0,0 +1,11 @@ +mixin inside + //-inside + +demo({ + html: ` +.test.-inside +`, + scss: ` +@include mq(inside, $BP-medium, $BP-small) { + background: $green; +}`, + }) diff --git a/unit-tests/width/inside/inside.scss b/unit-tests/width/inside/inside.scss new file mode 100644 index 0000000..43d492e --- /dev/null +++ b/unit-tests/width/inside/inside.scss @@ -0,0 +1,20 @@ +@import '../../test-dependencies.scss'; + +@mixin inside { + @include mq(inside, $BP-medium, $BP-small) { + @content; + } +} + +@if ($test-only) { + .unitTest { + @include inside { color: #000; } + } +} @else { + .test.-inside { + &::before { content: 'mq(inside, #{$BP-medium}, #{$BP-small})'; } + @include inside { + @include isActive; + } + } +} diff --git a/unit-tests/width/inside/test.js b/unit-tests/width/inside/test.js new file mode 100644 index 0000000..0d4e5d4 --- /dev/null +++ b/unit-tests/width/inside/test.js @@ -0,0 +1,3 @@ +import unitTest from '../../../gulp/helpers/unitTest'; + +unitTest('inside', __dirname, '@media (max-width: 800px) and (min-width: 601px){.unitTest{color:#000}}') diff --git a/unit-tests/width/insideVar/insideVar.css b/unit-tests/width/insideVar/insideVar.css new file mode 100644 index 0000000..dba5234 --- /dev/null +++ b/unit-tests/width/insideVar/insideVar.css @@ -0,0 +1 @@ +@media (max-width: 800px) and (min-width: 601px){.unitTest{color:#000}} diff --git a/unit-tests/width/insideVar/insideVar.pug b/unit-tests/width/insideVar/insideVar.pug new file mode 100644 index 0000000..01dce5c --- /dev/null +++ b/unit-tests/width/insideVar/insideVar.pug @@ -0,0 +1,12 @@ +mixin insideVar + //-insideVar + +demo({ + html: ` +.test.-insideVar +`, + scss: ` +$MQ-insideVar: (inside, $BP-medium, $BP-small); +@include mq($MQ-insideVar) { + background: $green; +}`, + }) diff --git a/unit-tests/width/insideVar/insideVar.scss b/unit-tests/width/insideVar/insideVar.scss new file mode 100644 index 0000000..fd6add9 --- /dev/null +++ b/unit-tests/width/insideVar/insideVar.scss @@ -0,0 +1,21 @@ +@import '../../test-dependencies.scss'; + +@mixin insideVar { + $MQ-insideVar: (inside, $BP-medium, $BP-small); + @include mq($MQ-insideVar) { + @content; + } +} + +@if ($test-only) { + .unitTest { + @include insideVar { color: #000; } + } +} @else { + .test.-insideVar { + &::before { content: 'mq($MQ-insideVar)'; } + @include insideVar { + @include isActive; + } + } +} diff --git a/unit-tests/width/insideVar/test.js b/unit-tests/width/insideVar/test.js new file mode 100644 index 0000000..95e1602 --- /dev/null +++ b/unit-tests/width/insideVar/test.js @@ -0,0 +1,3 @@ +import unitTest from '../../../gulp/helpers/unitTest'; + +unitTest('insideVar', __dirname, '@media (max-width: 800px) and (min-width: 601px){.unitTest{color:#000}}') diff --git a/unit-tests/width/insideWidth/insideWidth.css b/unit-tests/width/insideWidth/insideWidth.css new file mode 100644 index 0000000..dba5234 --- /dev/null +++ b/unit-tests/width/insideWidth/insideWidth.css @@ -0,0 +1 @@ +@media (max-width: 800px) and (min-width: 601px){.unitTest{color:#000}} diff --git a/unit-tests/width/insideWidth/insideWidth.pug b/unit-tests/width/insideWidth/insideWidth.pug new file mode 100644 index 0000000..b080398 --- /dev/null +++ b/unit-tests/width/insideWidth/insideWidth.pug @@ -0,0 +1,11 @@ +mixin insideWidth + //-insideWidth + +demo({ + html: ` +.test.-insideWidth +`, + scss: ` +@include mq(inside-width, $BP-small, $BP-medium) { + background: $green; +}`, + }) diff --git a/unit-tests/width/insideWidth/insideWidth.scss b/unit-tests/width/insideWidth/insideWidth.scss new file mode 100644 index 0000000..99629d4 --- /dev/null +++ b/unit-tests/width/insideWidth/insideWidth.scss @@ -0,0 +1,20 @@ +@import '../../test-dependencies.scss'; + +@mixin insideWidth { + @include mq(inside-width, $BP-small, $BP-medium) { + @content; + } +} + +@if ($test-only) { + .unitTest { + @include insideWidth { color: #000; } + } +} @else { + .test.-insideWidth { + &::before { content: 'mq(inside-width, #{$BP-small}, #{$BP-medium})'; } + @include insideWidth { + @include isActive; + } + } +} diff --git a/unit-tests/width/insideWidth/test.js b/unit-tests/width/insideWidth/test.js new file mode 100644 index 0000000..84e5ad3 --- /dev/null +++ b/unit-tests/width/insideWidth/test.js @@ -0,0 +1,3 @@ +import unitTest from '../../../gulp/helpers/unitTest'; + +unitTest('insideWidth', __dirname, '@media (max-width: 800px) and (min-width: 601px){.unitTest{color:#000}}') diff --git a/unit-tests/width/max/max.css b/unit-tests/width/max/max.css new file mode 100644 index 0000000..b3ca325 --- /dev/null +++ b/unit-tests/width/max/max.css @@ -0,0 +1 @@ +@media (max-width: 800px){.unitTest{color:#000}} diff --git a/unit-tests/width/max/max.pug b/unit-tests/width/max/max.pug new file mode 100644 index 0000000..8036141 --- /dev/null +++ b/unit-tests/width/max/max.pug @@ -0,0 +1,11 @@ +mixin max + //-max + +demo({ + html: ` +.test.-max +`, + scss: ` +@include mq(max, $BP-medium) { + background: $green; +}`, + }) diff --git a/unit-tests/width/max/max.scss b/unit-tests/width/max/max.scss new file mode 100644 index 0000000..ec9a3b0 --- /dev/null +++ b/unit-tests/width/max/max.scss @@ -0,0 +1,20 @@ +@import '../../test-dependencies.scss'; + +@mixin max { + @include mq(max, $BP-medium) { + @content; + } +} + +@if ($test-only) { + .unitTest { + @include max { color: #000; } + } +} @else { + .test.-max { + &::before { content: 'mq(max, #{$BP-medium})'; } + @include max { + @include isActive; + } + } +} diff --git a/unit-tests/width/max/test.js b/unit-tests/width/max/test.js new file mode 100644 index 0000000..737b2d7 --- /dev/null +++ b/unit-tests/width/max/test.js @@ -0,0 +1,3 @@ +import unitTest from '../../../gulp/helpers/unitTest'; + +unitTest('max', __dirname, '@media (max-width: 800px){.unitTest{color:#000}}') diff --git a/unit-tests/width/maxVar/maxVar.css b/unit-tests/width/maxVar/maxVar.css new file mode 100644 index 0000000..b3ca325 --- /dev/null +++ b/unit-tests/width/maxVar/maxVar.css @@ -0,0 +1 @@ +@media (max-width: 800px){.unitTest{color:#000}} diff --git a/unit-tests/width/maxVar/maxVar.pug b/unit-tests/width/maxVar/maxVar.pug new file mode 100644 index 0000000..096b5fd --- /dev/null +++ b/unit-tests/width/maxVar/maxVar.pug @@ -0,0 +1,12 @@ +mixin maxVar + //-maxVar + +demo({ + html: ` +.test.-maxVar +`, + scss: ` +$MQ-maxVar: (max, $BP-medium); +@include mq($MQ-maxVar) { + background: $green; +}`, + }) diff --git a/unit-tests/width/maxVar/maxVar.scss b/unit-tests/width/maxVar/maxVar.scss new file mode 100644 index 0000000..4305d58 --- /dev/null +++ b/unit-tests/width/maxVar/maxVar.scss @@ -0,0 +1,21 @@ +@import '../../test-dependencies.scss'; + +@mixin maxVar { + $MQ-maxVar: (max, $BP-medium); + @include mq($MQ-maxVar) { + @content; + } +} + +@if ($test-only) { + .unitTest { + @include maxVar { color: #000; } + } +} @else { + .test.-maxVar { + &::before { content: 'mq($MQ-maxVar)'; } + @include maxVar { + @include isActive; + } + } +} diff --git a/unit-tests/width/maxVar/test.js b/unit-tests/width/maxVar/test.js new file mode 100644 index 0000000..5effc60 --- /dev/null +++ b/unit-tests/width/maxVar/test.js @@ -0,0 +1,3 @@ +import unitTest from '../../../gulp/helpers/unitTest'; + +unitTest('maxVar', __dirname, '@media (max-width: 800px){.unitTest{color:#000}}') diff --git a/unit-tests/width/maxWidth/maxWidth.css b/unit-tests/width/maxWidth/maxWidth.css new file mode 100644 index 0000000..b3ca325 --- /dev/null +++ b/unit-tests/width/maxWidth/maxWidth.css @@ -0,0 +1 @@ +@media (max-width: 800px){.unitTest{color:#000}} diff --git a/unit-tests/width/maxWidth/maxWidth.pug b/unit-tests/width/maxWidth/maxWidth.pug new file mode 100644 index 0000000..c753cb8 --- /dev/null +++ b/unit-tests/width/maxWidth/maxWidth.pug @@ -0,0 +1,11 @@ +mixin maxWidth + //-maxWidth + +demo({ + html: ` +.test.-maxWidth +`, + scss: ` +@include mq(max-width, $BP-medium) { + background: $green; +}`, + }) diff --git a/unit-tests/width/maxWidth/maxWidth.scss b/unit-tests/width/maxWidth/maxWidth.scss new file mode 100644 index 0000000..8ec3164 --- /dev/null +++ b/unit-tests/width/maxWidth/maxWidth.scss @@ -0,0 +1,20 @@ +@import '../../test-dependencies.scss'; + +@mixin maxWidth { + @include mq(max-width, $BP-medium) { + @content; + } +} + +@if ($test-only) { + .unitTest { + @include maxWidth { color: #000; } + } +} @else { + .test.-maxWidth { + &::before { content: 'mq(max-width, #{$BP-medium})'; } + @include maxWidth { + @include isActive; + } + } +} diff --git a/unit-tests/width/maxWidth/test.js b/unit-tests/width/maxWidth/test.js new file mode 100644 index 0000000..b376f46 --- /dev/null +++ b/unit-tests/width/maxWidth/test.js @@ -0,0 +1,3 @@ +import unitTest from '../../../gulp/helpers/unitTest'; + +unitTest('maxWidth', __dirname, '@media (max-width: 800px){.unitTest{color:#000}}') diff --git a/unit-tests/width/min/min.css b/unit-tests/width/min/min.css new file mode 100644 index 0000000..e6456d1 --- /dev/null +++ b/unit-tests/width/min/min.css @@ -0,0 +1 @@ +@media (min-width: 801px){.unitTest{color:#000}} diff --git a/unit-tests/width/min/min.pug b/unit-tests/width/min/min.pug new file mode 100644 index 0000000..1322239 --- /dev/null +++ b/unit-tests/width/min/min.pug @@ -0,0 +1,11 @@ +mixin min + //-min + +demo({ + html: ` +.test.-min +`, + scss: ` +@include mq(min, $BP-medium) { + background: $green; +}`, + }) diff --git a/unit-tests/width/min/min.scss b/unit-tests/width/min/min.scss new file mode 100644 index 0000000..666b341 --- /dev/null +++ b/unit-tests/width/min/min.scss @@ -0,0 +1,20 @@ +@import '../../test-dependencies.scss'; + +@mixin min { + @include mq(min, $BP-medium) { + @content; + } +} + +@if ($test-only) { + .unitTest { + @include min { color: #000; } + } +} @else { + .test.-min { + &::before { content: 'mq(min, #{$BP-medium})'; } + @include min { + @include isActive; + } + } +} diff --git a/unit-tests/width/min/test.js b/unit-tests/width/min/test.js new file mode 100644 index 0000000..7175444 --- /dev/null +++ b/unit-tests/width/min/test.js @@ -0,0 +1,3 @@ +import unitTest from '../../../gulp/helpers/unitTest'; + +unitTest('min', __dirname, '@media (min-width: 801px){.unitTest{color:#000}}') diff --git a/unit-tests/width/minVar/minVar.css b/unit-tests/width/minVar/minVar.css new file mode 100644 index 0000000..e6456d1 --- /dev/null +++ b/unit-tests/width/minVar/minVar.css @@ -0,0 +1 @@ +@media (min-width: 801px){.unitTest{color:#000}} diff --git a/unit-tests/width/minVar/minVar.pug b/unit-tests/width/minVar/minVar.pug new file mode 100644 index 0000000..a50560a --- /dev/null +++ b/unit-tests/width/minVar/minVar.pug @@ -0,0 +1,12 @@ +mixin minVar + //-minVar + +demo({ + html: ` +.test.-minVar +`, + scss: ` +$MQ-minVar: (min, $BP-medium); +@include mq($MQ-minVar) { + background: $green; +}`, + }) diff --git a/unit-tests/width/minVar/minVar.scss b/unit-tests/width/minVar/minVar.scss new file mode 100644 index 0000000..2c59e9b --- /dev/null +++ b/unit-tests/width/minVar/minVar.scss @@ -0,0 +1,21 @@ +@import '../../test-dependencies.scss'; + +@mixin minVar { + $MQ-minVar: (min, $BP-medium); + @include mq($MQ-minVar) { + @content; + } +} + +@if ($test-only) { + .unitTest { + @include minVar { color: #000; } + } +} @else { + .test.-minVar { + &::before { content: 'mq($MQ-minVar)'; } + @include minVar { + @include isActive; + } + } +} diff --git a/unit-tests/width/minVar/test.js b/unit-tests/width/minVar/test.js new file mode 100644 index 0000000..1a29434 --- /dev/null +++ b/unit-tests/width/minVar/test.js @@ -0,0 +1,3 @@ +import unitTest from '../../../gulp/helpers/unitTest'; + +unitTest('minVar', __dirname, '@media (min-width: 801px){.unitTest{color:#000}}') diff --git a/unit-tests/width/minWidth/minWidth.css b/unit-tests/width/minWidth/minWidth.css new file mode 100644 index 0000000..e6456d1 --- /dev/null +++ b/unit-tests/width/minWidth/minWidth.css @@ -0,0 +1 @@ +@media (min-width: 801px){.unitTest{color:#000}} diff --git a/unit-tests/width/minWidth/minWidth.pug b/unit-tests/width/minWidth/minWidth.pug new file mode 100644 index 0000000..5d3e5b2 --- /dev/null +++ b/unit-tests/width/minWidth/minWidth.pug @@ -0,0 +1,11 @@ +mixin minWidth + //-minWidth + +demo({ + html: ` +.test.-minWidth +`, + scss: ` +@include mq(min-width, $BP-medium) { + background: $green; +}`, + }) diff --git a/unit-tests/width/minWidth/minWidth.scss b/unit-tests/width/minWidth/minWidth.scss new file mode 100644 index 0000000..aa91283 --- /dev/null +++ b/unit-tests/width/minWidth/minWidth.scss @@ -0,0 +1,20 @@ +@import '../../test-dependencies.scss'; + +@mixin minWidth { + @include mq(min-width, $BP-medium) { + @content; + } +} + +@if ($test-only) { + .unitTest { + @include minWidth { color: #000; } + } +} @else { + .test.-minWidth { + &::before { content: 'mq(min-width, #{$BP-medium})'; } + @include minWidth { + @include isActive; + } + } +} diff --git a/unit-tests/width/minWidth/test.js b/unit-tests/width/minWidth/test.js new file mode 100644 index 0000000..c7fa1ac --- /dev/null +++ b/unit-tests/width/minWidth/test.js @@ -0,0 +1,3 @@ +import unitTest from '../../../gulp/helpers/unitTest'; + +unitTest('minWidth', __dirname, '@media (min-width: 801px){.unitTest{color:#000}}') diff --git a/unit-tests/width/outside/outside.css b/unit-tests/width/outside/outside.css new file mode 100644 index 0000000..be623b4 --- /dev/null +++ b/unit-tests/width/outside/outside.css @@ -0,0 +1 @@ +@media (max-width: 600px), (min-width: 801px){.unitTest{color:#000}} diff --git a/unit-tests/width/outside/outside.pug b/unit-tests/width/outside/outside.pug new file mode 100644 index 0000000..263f8e2 --- /dev/null +++ b/unit-tests/width/outside/outside.pug @@ -0,0 +1,11 @@ +mixin outside + //-outside + +demo({ + html: ` +.test.-outside +`, + scss: ` +@include mq(outside, $BP-medium, $BP-small) { + background: $green; +}`, + }) diff --git a/unit-tests/width/outside/outside.scss b/unit-tests/width/outside/outside.scss new file mode 100644 index 0000000..32146d4 --- /dev/null +++ b/unit-tests/width/outside/outside.scss @@ -0,0 +1,20 @@ +@import '../../test-dependencies.scss'; + +@mixin outside { + @include mq(outside, $BP-medium, $BP-small) { + @content; + } +} + +@if ($test-only) { + .unitTest { + @include outside { color: #000; } + } +} @else { + .test.-outside { + &::before { content: 'mq(outside, #{$BP-medium}, #{$BP-small})'; } + @include outside { + @include isActive; + } + } +} diff --git a/unit-tests/width/outside/test.js b/unit-tests/width/outside/test.js new file mode 100644 index 0000000..258ed03 --- /dev/null +++ b/unit-tests/width/outside/test.js @@ -0,0 +1,3 @@ +import unitTest from '../../../gulp/helpers/unitTest'; + +unitTest('outside', __dirname, '@media (max-width: 600px), (min-width: 801px){.unitTest{color:#000}}') diff --git a/unit-tests/width/outsideVar/outsideVar.css b/unit-tests/width/outsideVar/outsideVar.css new file mode 100644 index 0000000..be623b4 --- /dev/null +++ b/unit-tests/width/outsideVar/outsideVar.css @@ -0,0 +1 @@ +@media (max-width: 600px), (min-width: 801px){.unitTest{color:#000}} diff --git a/unit-tests/width/outsideVar/outsideVar.pug b/unit-tests/width/outsideVar/outsideVar.pug new file mode 100644 index 0000000..672607b --- /dev/null +++ b/unit-tests/width/outsideVar/outsideVar.pug @@ -0,0 +1,12 @@ +mixin outsideVar + //-outsideVar + +demo({ + html: ` +.test.-outsideVar +`, + scss: ` +$MQ-outsideVar: (outside, $BP-medium, $BP-small); +@include mq($MQ-outsideVar) { + background: $green; +}`, + }) diff --git a/unit-tests/width/outsideVar/outsideVar.scss b/unit-tests/width/outsideVar/outsideVar.scss new file mode 100644 index 0000000..a68a568 --- /dev/null +++ b/unit-tests/width/outsideVar/outsideVar.scss @@ -0,0 +1,21 @@ +@import '../../test-dependencies.scss'; + +@mixin outsideVar { + $MQ-outsideVar: (outside, $BP-medium, $BP-small); + @include mq($MQ-outsideVar) { + @content; + } +} + +@if ($test-only) { + .unitTest { + @include outsideVar { color: #000; } + } +} @else { + .test.-outsideVar { + &::before { content: 'mq($MQ-outsideVar)'; } + @include outsideVar { + @include isActive; + } + } +} diff --git a/unit-tests/width/outsideVar/test.js b/unit-tests/width/outsideVar/test.js new file mode 100644 index 0000000..59e2602 --- /dev/null +++ b/unit-tests/width/outsideVar/test.js @@ -0,0 +1,3 @@ +import unitTest from '../../../gulp/helpers/unitTest'; + +unitTest('outsideVar', __dirname, '@media (max-width: 600px), (min-width: 801px){.unitTest{color:#000}}') diff --git a/unit-tests/width/outsideWidth/outsideWidth.css b/unit-tests/width/outsideWidth/outsideWidth.css new file mode 100644 index 0000000..be623b4 --- /dev/null +++ b/unit-tests/width/outsideWidth/outsideWidth.css @@ -0,0 +1 @@ +@media (max-width: 600px), (min-width: 801px){.unitTest{color:#000}} diff --git a/unit-tests/width/outsideWidth/outsideWidth.pug b/unit-tests/width/outsideWidth/outsideWidth.pug new file mode 100644 index 0000000..bbad4b8 --- /dev/null +++ b/unit-tests/width/outsideWidth/outsideWidth.pug @@ -0,0 +1,11 @@ +mixin outsideWidth + //-outsideWidth + +demo({ + html: ` +.test.-outsideWidth +`, + scss: ` +@include mq(outside-width, $BP-small, $BP-medium) { + background: $green; +}`, + }) diff --git a/unit-tests/width/outsideWidth/outsideWidth.scss b/unit-tests/width/outsideWidth/outsideWidth.scss new file mode 100644 index 0000000..d31b712 --- /dev/null +++ b/unit-tests/width/outsideWidth/outsideWidth.scss @@ -0,0 +1,20 @@ +@import '../../test-dependencies.scss'; + +@mixin outsideWidth { + @include mq(outside-width, $BP-small, $BP-medium) { + @content; + } +} + +@if ($test-only) { + .unitTest { + @include outsideWidth { color: #000; } + } +} @else { + .test.-outsideWidth { + &::before { content: 'mq(outside, #{$BP-medium}, #{$BP-small})'; } + @include outsideWidth { + @include isActive; + } + } +} diff --git a/unit-tests/width/outsideWidth/test.js b/unit-tests/width/outsideWidth/test.js new file mode 100644 index 0000000..37a507a --- /dev/null +++ b/unit-tests/width/outsideWidth/test.js @@ -0,0 +1,3 @@ +import unitTest from '../../../gulp/helpers/unitTest'; + +unitTest('outsideWidth', __dirname, '@media (max-width: 600px), (min-width: 801px){.unitTest{color:#000}}')