diff --git a/.babelrc b/.babelrc index bea32a4..244d28b 100644 --- a/.babelrc +++ b/.babelrc @@ -1,3 +1,3 @@ { - "presets": [ "es2015" ] + "presets": [ "es2015" ] } diff --git a/.csscomb.json b/.csscomb.json index 0277343..09972c1 100644 --- a/.csscomb.json +++ b/.csscomb.json @@ -1,404 +1,404 @@ { - "always-semicolon": true, - "color-case": "lower", - "block-indent": "\t", - "color-shorthand": false, - "eof-newline": true, - "leading-zero": true, - "quotes": "double", - "space-before-colon": "", - "space-after-colon": " ", - "space-before-combinator": " ", - "space-after-combinator": " ", - "space-between-declarations": "\n", - "space-before-opening-brace": " ", - "space-after-opening-brace": "\n", - "space-before-selector-delimiter": "", - "space-before-closing-brace": "\n", - "strip-spaces": true, - "unitless-zero": true, - "vendor-prefix-align": true, - "sort-order": [ - [ - "$include" - ], - [ - "position", - "top", - "right", - "bottom", - "left", - "z-index", - "display", - "visibility", - "-webkit-flex-direction", - "-moz-flex-direction", - "-ms-flex-direction", - "-o-flex-direction", - "flex-direction", - "-webkit-flex-order", - "-moz-flex-order", - "-ms-flex-order", - "-o-flex-order", - "flex-order", - "-webkit-flex-pack", - "-moz-flex-pack", - "-ms-flex-pack", - "-o-flex-pack", - "flex-pack", - "float", - "clear", - "-webkit-flex-align", - "-moz-flex-align", - "-ms-flex-align", - "-o-flex-align", - "flex-align", - "overflow", - "-ms-overflow-x", - "-ms-overflow-y", - "overflow-x", - "overflow-y", - "-webkit-overflow-scrolling", - "clip", - "-webkit-box-sizing", - "-moz-box-sizing", - "box-sizing", - "margin", - "margin-top", - "margin-right", - "margin-bottom", - "margin-left", - "padding", - "padding-top", - "padding-right", - "padding-bottom", - "padding-left", - "min-width", - "min-height", - "max-width", - "max-height", - "width", - "height", - "outline", - "outline-width", - "outline-style", - "outline-color", - "outline-offset", - "border", - "border-spacing", - "border-collapse", - "border-width", - "border-style", - "border-color", - "border-top", - "border-top-width", - "border-top-style", - "border-top-color", - "border-right", - "border-right-width", - "border-right-style", - "border-right-color", - "border-bottom", - "border-bottom-width", - "border-bottom-style", - "border-bottom-color", - "border-left", - "border-left-width", - "border-left-style", - "border-left-color", - "-webkit-border-radius", - "-moz-border-radius", - "border-radius", - "-webkit-border-top-left-radius", - "-moz-border-radius-topleft", - "border-top-left-radius", - "-webkit-border-top-right-radius", - "-moz-border-radius-topright", - "border-top-right-radius", - "-webkit-border-bottom-right-radius", - "-moz-border-radius-bottomright", - "border-bottom-right-radius", - "-webkit-border-bottom-left-radius", - "-moz-border-radius-bottomleft", - "border-bottom-left-radius", - "-webkit-border-image", - "-moz-border-image", - "-o-border-image", - "border-image", - "-webkit-border-image-source", - "-moz-border-image-source", - "-o-border-image-source", - "border-image-source", - "-webkit-border-image-slice", - "-moz-border-image-slice", - "-o-border-image-slice", - "border-image-slice", - "-webkit-border-image-width", - "-moz-border-image-width", - "-o-border-image-width", - "border-image-width", - "-webkit-border-image-outset", - "-moz-border-image-outset", - "-o-border-image-outset", - "border-image-outset", - "-webkit-border-image-repeat", - "-moz-border-image-repeat", - "-o-border-image-repeat", - "border-image-repeat", - "-webkit-border-top-image", - "-moz-border-top-image", - "-o-border-top-image", - "border-top-image", - "-webkit-border-right-image", - "-moz-border-right-image", - "-o-border-right-image", - "border-right-image", - "-webkit-border-bottom-image", - "-moz-border-bottom-image", - "-o-border-bottom-image", - "border-bottom-image", - "-webkit-border-left-image", - "-moz-border-left-image", - "-o-border-left-image", - "border-left-image", - "-webkit-border-corner-image", - "-moz-border-corner-image", - "-o-border-corner-image", - "border-corner-image", - "-webkit-border-top-left-image", - "-moz-border-top-left-image", - "-o-border-top-left-image", - "border-top-left-image", - "-webkit-border-top-right-image", - "-moz-border-top-right-image", - "-o-border-top-right-image", - "border-top-right-image", - "-webkit-border-bottom-right-image", - "-moz-border-bottom-right-image", - "-o-border-bottom-right-image", - "border-bottom-right-image", - "-webkit-border-bottom-left-image", - "-moz-border-bottom-left-image", - "-o-border-bottom-left-image", - "border-bottom-left-image", - "background", - "filter:progid:DXImageTransform.Microsoft.AlphaImageLoader", - "background-color", - "background-image", - "background-attachment", - "background-position", - "-ms-background-position-x", - "-ms-background-position-y", - "background-position-x", - "background-position-y", - "-webkit-background-clip", - "-moz-background-clip", - "background-clip", - "background-origin", - "-webkit-background-size", - "-moz-background-size", - "-o-background-size", - "background-size", - "background-repeat", - "box-decoration-break", - "-webkit-box-shadow", - "-moz-box-shadow", - "box-shadow", - "color", - "table-layout", - "caption-side", - "empty-cells", - "list-style", - "list-style-position", - "list-style-type", - "list-style-image", - "quotes", - "content", - "counter-increment", - "counter-reset", - "-ms-writing-mode", - "vertical-align", - "text-align", - "-webkit-text-align-last", - "-moz-text-align-last", - "-ms-text-align-last", - "text-align-last", - "text-decoration", - "text-emphasis", - "text-emphasis-position", - "text-emphasis-style", - "text-emphasis-color", - "text-indent", - "-ms-text-justify", - "text-justify", - "text-outline", - "text-transform", - "text-wrap", - "-ms-text-overflow", - "text-overflow", - "text-overflow-ellipsis", - "text-overflow-mode", - "text-shadow", - "white-space", - "word-spacing", - "-ms-word-wrap", - "word-wrap", - "-ms-word-break", - "word-break", - "-moz-tab-size", - "-o-tab-size", - "tab-size", - "-webkit-hyphens", - "-moz-hyphens", - "hyphens", - "letter-spacing", - "font", - "font-weight", - "font-style", - "font-variant", - "font-size-adjust", - "font-stretch", - "font-size", - "font-family", - "src", - "line-height", - "opacity", - "-ms-filter:\\'progid:DXImageTransform.Microsoft.Alpha", - "filter:progid:DXImageTransform.Microsoft.Alpha(Opacity", - "-ms-interpolation-mode", - "-webkit-filter", - "-ms-filter", - "filter", - "resize", - "cursor", - "nav-index", - "nav-up", - "nav-right", - "nav-down", - "nav-left", - "-webkit-transition", - "-moz-transition", - "-ms-transition", - "-o-transition", - "transition", - "-webkit-transition-delay", - "-moz-transition-delay", - "-ms-transition-delay", - "-o-transition-delay", - "transition-delay", - "-webkit-transition-timing-function", - "-moz-transition-timing-function", - "-ms-transition-timing-function", - "-o-transition-timing-function", - "transition-timing-function", - "-webkit-transition-duration", - "-moz-transition-duration", - "-ms-transition-duration", - "-o-transition-duration", - "transition-duration", - "-webkit-transition-property", - "-moz-transition-property", - "-ms-transition-property", - "-o-transition-property", - "transition-property", - "-webkit-transform", - "-moz-transform", - "-ms-transform", - "-o-transform", - "transform", - "-webkit-transform-origin", - "-moz-transform-origin", - "-ms-transform-origin", - "-o-transform-origin", - "transform-origin", - "-webkit-animation", - "-moz-animation", - "-ms-animation", - "-o-animation", - "animation", - "-webkit-animation-name", - "-moz-animation-name", - "-ms-animation-name", - "-o-animation-name", - "animation-name", - "-webkit-animation-duration", - "-moz-animation-duration", - "-ms-animation-duration", - "-o-animation-duration", - "animation-duration", - "-webkit-animation-play-state", - "-moz-animation-play-state", - "-ms-animation-play-state", - "-o-animation-play-state", - "animation-play-state", - "-webkit-animation-timing-function", - "-moz-animation-timing-function", - "-ms-animation-timing-function", - "-o-animation-timing-function", - "animation-timing-function", - "-webkit-animation-delay", - "-moz-animation-delay", - "-ms-animation-delay", - "-o-animation-delay", - "animation-delay", - "-webkit-animation-iteration-count", - "-moz-animation-iteration-count", - "-ms-animation-iteration-count", - "-o-animation-iteration-count", - "animation-iteration-count", - "-webkit-animation-direction", - "-moz-animation-direction", - "-ms-animation-direction", - "-o-animation-direction", - "animation-direction", - "pointer-events", - "unicode-bidi", - "direction", - "-webkit-columns", - "-moz-columns", - "columns", - "-webkit-column-span", - "-moz-column-span", - "column-span", - "-webkit-column-width", - "-moz-column-width", - "column-width", - "-webkit-column-count", - "-moz-column-count", - "column-count", - "-webkit-column-fill", - "-moz-column-fill", - "column-fill", - "-webkit-column-gap", - "-moz-column-gap", - "column-gap", - "-webkit-column-rule", - "-moz-column-rule", - "column-rule", - "-webkit-column-rule-width", - "-moz-column-rule-width", - "column-rule-width", - "-webkit-column-rule-style", - "-moz-column-rule-style", - "column-rule-style", - "-webkit-column-rule-color", - "-moz-column-rule-color", - "column-rule-color", - "break-before", - "break-inside", - "break-after", - "page-break-before", - "page-break-inside", - "page-break-after", - "orphans", - "widows", - "-ms-zoom", - "zoom", - "max-zoom", - "min-zoom", - "user-zoom", - "orientation", - "..." + "always-semicolon": true, + "color-case": "lower", + "block-indent": "\t", + "color-shorthand": false, + "eof-newline": true, + "leading-zero": true, + "quotes": "double", + "space-before-colon": "", + "space-after-colon": " ", + "space-before-combinator": " ", + "space-after-combinator": " ", + "space-between-declarations": "\n", + "space-before-opening-brace": " ", + "space-after-opening-brace": "\n", + "space-before-selector-delimiter": "", + "space-before-closing-brace": "\n", + "strip-spaces": true, + "unitless-zero": true, + "vendor-prefix-align": true, + "sort-order": [ + [ + "$include" + ], + [ + "position", + "top", + "right", + "bottom", + "left", + "z-index", + "display", + "visibility", + "-webkit-flex-direction", + "-moz-flex-direction", + "-ms-flex-direction", + "-o-flex-direction", + "flex-direction", + "-webkit-flex-order", + "-moz-flex-order", + "-ms-flex-order", + "-o-flex-order", + "flex-order", + "-webkit-flex-pack", + "-moz-flex-pack", + "-ms-flex-pack", + "-o-flex-pack", + "flex-pack", + "float", + "clear", + "-webkit-flex-align", + "-moz-flex-align", + "-ms-flex-align", + "-o-flex-align", + "flex-align", + "overflow", + "-ms-overflow-x", + "-ms-overflow-y", + "overflow-x", + "overflow-y", + "-webkit-overflow-scrolling", + "clip", + "-webkit-box-sizing", + "-moz-box-sizing", + "box-sizing", + "margin", + "margin-top", + "margin-right", + "margin-bottom", + "margin-left", + "padding", + "padding-top", + "padding-right", + "padding-bottom", + "padding-left", + "min-width", + "min-height", + "max-width", + "max-height", + "width", + "height", + "outline", + "outline-width", + "outline-style", + "outline-color", + "outline-offset", + "border", + "border-spacing", + "border-collapse", + "border-width", + "border-style", + "border-color", + "border-top", + "border-top-width", + "border-top-style", + "border-top-color", + "border-right", + "border-right-width", + "border-right-style", + "border-right-color", + "border-bottom", + "border-bottom-width", + "border-bottom-style", + "border-bottom-color", + "border-left", + "border-left-width", + "border-left-style", + "border-left-color", + "-webkit-border-radius", + "-moz-border-radius", + "border-radius", + "-webkit-border-top-left-radius", + "-moz-border-radius-topleft", + "border-top-left-radius", + "-webkit-border-top-right-radius", + "-moz-border-radius-topright", + "border-top-right-radius", + "-webkit-border-bottom-right-radius", + "-moz-border-radius-bottomright", + "border-bottom-right-radius", + "-webkit-border-bottom-left-radius", + "-moz-border-radius-bottomleft", + "border-bottom-left-radius", + "-webkit-border-image", + "-moz-border-image", + "-o-border-image", + "border-image", + "-webkit-border-image-source", + "-moz-border-image-source", + "-o-border-image-source", + "border-image-source", + "-webkit-border-image-slice", + "-moz-border-image-slice", + "-o-border-image-slice", + "border-image-slice", + "-webkit-border-image-width", + "-moz-border-image-width", + "-o-border-image-width", + "border-image-width", + "-webkit-border-image-outset", + "-moz-border-image-outset", + "-o-border-image-outset", + "border-image-outset", + "-webkit-border-image-repeat", + "-moz-border-image-repeat", + "-o-border-image-repeat", + "border-image-repeat", + "-webkit-border-top-image", + "-moz-border-top-image", + "-o-border-top-image", + "border-top-image", + "-webkit-border-right-image", + "-moz-border-right-image", + "-o-border-right-image", + "border-right-image", + "-webkit-border-bottom-image", + "-moz-border-bottom-image", + "-o-border-bottom-image", + "border-bottom-image", + "-webkit-border-left-image", + "-moz-border-left-image", + "-o-border-left-image", + "border-left-image", + "-webkit-border-corner-image", + "-moz-border-corner-image", + "-o-border-corner-image", + "border-corner-image", + "-webkit-border-top-left-image", + "-moz-border-top-left-image", + "-o-border-top-left-image", + "border-top-left-image", + "-webkit-border-top-right-image", + "-moz-border-top-right-image", + "-o-border-top-right-image", + "border-top-right-image", + "-webkit-border-bottom-right-image", + "-moz-border-bottom-right-image", + "-o-border-bottom-right-image", + "border-bottom-right-image", + "-webkit-border-bottom-left-image", + "-moz-border-bottom-left-image", + "-o-border-bottom-left-image", + "border-bottom-left-image", + "background", + "filter:progid:DXImageTransform.Microsoft.AlphaImageLoader", + "background-color", + "background-image", + "background-attachment", + "background-position", + "-ms-background-position-x", + "-ms-background-position-y", + "background-position-x", + "background-position-y", + "-webkit-background-clip", + "-moz-background-clip", + "background-clip", + "background-origin", + "-webkit-background-size", + "-moz-background-size", + "-o-background-size", + "background-size", + "background-repeat", + "box-decoration-break", + "-webkit-box-shadow", + "-moz-box-shadow", + "box-shadow", + "color", + "table-layout", + "caption-side", + "empty-cells", + "list-style", + "list-style-position", + "list-style-type", + "list-style-image", + "quotes", + "content", + "counter-increment", + "counter-reset", + "-ms-writing-mode", + "vertical-align", + "text-align", + "-webkit-text-align-last", + "-moz-text-align-last", + "-ms-text-align-last", + "text-align-last", + "text-decoration", + "text-emphasis", + "text-emphasis-position", + "text-emphasis-style", + "text-emphasis-color", + "text-indent", + "-ms-text-justify", + "text-justify", + "text-outline", + "text-transform", + "text-wrap", + "-ms-text-overflow", + "text-overflow", + "text-overflow-ellipsis", + "text-overflow-mode", + "text-shadow", + "white-space", + "word-spacing", + "-ms-word-wrap", + "word-wrap", + "-ms-word-break", + "word-break", + "-moz-tab-size", + "-o-tab-size", + "tab-size", + "-webkit-hyphens", + "-moz-hyphens", + "hyphens", + "letter-spacing", + "font", + "font-weight", + "font-style", + "font-variant", + "font-size-adjust", + "font-stretch", + "font-size", + "font-family", + "src", + "line-height", + "opacity", + "-ms-filter:\\'progid:DXImageTransform.Microsoft.Alpha", + "filter:progid:DXImageTransform.Microsoft.Alpha(Opacity", + "-ms-interpolation-mode", + "-webkit-filter", + "-ms-filter", + "filter", + "resize", + "cursor", + "nav-index", + "nav-up", + "nav-right", + "nav-down", + "nav-left", + "-webkit-transition", + "-moz-transition", + "-ms-transition", + "-o-transition", + "transition", + "-webkit-transition-delay", + "-moz-transition-delay", + "-ms-transition-delay", + "-o-transition-delay", + "transition-delay", + "-webkit-transition-timing-function", + "-moz-transition-timing-function", + "-ms-transition-timing-function", + "-o-transition-timing-function", + "transition-timing-function", + "-webkit-transition-duration", + "-moz-transition-duration", + "-ms-transition-duration", + "-o-transition-duration", + "transition-duration", + "-webkit-transition-property", + "-moz-transition-property", + "-ms-transition-property", + "-o-transition-property", + "transition-property", + "-webkit-transform", + "-moz-transform", + "-ms-transform", + "-o-transform", + "transform", + "-webkit-transform-origin", + "-moz-transform-origin", + "-ms-transform-origin", + "-o-transform-origin", + "transform-origin", + "-webkit-animation", + "-moz-animation", + "-ms-animation", + "-o-animation", + "animation", + "-webkit-animation-name", + "-moz-animation-name", + "-ms-animation-name", + "-o-animation-name", + "animation-name", + "-webkit-animation-duration", + "-moz-animation-duration", + "-ms-animation-duration", + "-o-animation-duration", + "animation-duration", + "-webkit-animation-play-state", + "-moz-animation-play-state", + "-ms-animation-play-state", + "-o-animation-play-state", + "animation-play-state", + "-webkit-animation-timing-function", + "-moz-animation-timing-function", + "-ms-animation-timing-function", + "-o-animation-timing-function", + "animation-timing-function", + "-webkit-animation-delay", + "-moz-animation-delay", + "-ms-animation-delay", + "-o-animation-delay", + "animation-delay", + "-webkit-animation-iteration-count", + "-moz-animation-iteration-count", + "-ms-animation-iteration-count", + "-o-animation-iteration-count", + "animation-iteration-count", + "-webkit-animation-direction", + "-moz-animation-direction", + "-ms-animation-direction", + "-o-animation-direction", + "animation-direction", + "pointer-events", + "unicode-bidi", + "direction", + "-webkit-columns", + "-moz-columns", + "columns", + "-webkit-column-span", + "-moz-column-span", + "column-span", + "-webkit-column-width", + "-moz-column-width", + "column-width", + "-webkit-column-count", + "-moz-column-count", + "column-count", + "-webkit-column-fill", + "-moz-column-fill", + "column-fill", + "-webkit-column-gap", + "-moz-column-gap", + "column-gap", + "-webkit-column-rule", + "-moz-column-rule", + "column-rule", + "-webkit-column-rule-width", + "-moz-column-rule-width", + "column-rule-width", + "-webkit-column-rule-style", + "-moz-column-rule-style", + "column-rule-style", + "-webkit-column-rule-color", + "-moz-column-rule-color", + "column-rule-color", + "break-before", + "break-inside", + "break-after", + "page-break-before", + "page-break-inside", + "page-break-after", + "orphans", + "widows", + "-ms-zoom", + "zoom", + "max-zoom", + "min-zoom", + "user-zoom", + "orientation", + "..." + ] ] - ] } diff --git a/.editorconfig b/.editorconfig index 25983f0..7fbfae2 100644 --- a/.editorconfig +++ b/.editorconfig @@ -4,12 +4,11 @@ root = true [*] charset = utf-8 -indent_style = tab -indent_size = 4 end_of_line = lf -trim_trailing_whitespace = true -insert_final_newline = true - -[{*.md,.*rc,.*.json,*.yml,.editorconfig,.env,.env.*,.git*,.htaccess,.jshintignore,bower.json,composer.json,package.json}] +indent_size = 4 indent_style = space -indent_size = 2 +insert_final_newline = true +trim_trailing_whitespace = true + +[*.{md,markdown}] +trim_trailing_whitespace = false diff --git a/.eslintrc b/.eslintrc index c24dc33..5e19138 100644 --- a/.eslintrc +++ b/.eslintrc @@ -1,46 +1,46 @@ { - "env": { - "browser": true, - "node": true, - "es6": true - }, - "parserOptions": { - "ecmaVersion": 6, - "sourceType": "module" - }, - "ecmaFeatures": { - "arrowFunctions": true, - "binaryLiterals": true, - "blockBindings": true, - "classes": true, - "defaultParams": true, - "destructuring": true, - "forOf": true, - "generators": true, - "modules": true, - "objectLiteralComputedProperties": true, - "objectLiteralDuplicateProperties": true, - "objectLiteralShorthandMethods": true, - "objectLiteralShorthandProperties": true, - "octalLiterals": true, - "regexUFlag": true, - "regexYFlag": true, - "spread": true, - "superInFunctions": false, - "templateStrings": true, - "unicodeCodePointEscapes": true, - "globalReturn": true, - "jsx": true - }, - "rules": { - "eqeqeq": 2, - "strict": 0, - "no-empty": 1, - "no-alert": 2, - "no-eval": 2, - "quotes": [1, "single", "avoid-escape"], - "no-trailing-spaces": [2, { "skipBlankLines": true }], - "eol-last": 0, - "yoda": [2, "never", { "exceptRange": true }] - } + "env": { + "browser": true, + "node": true, + "es6": true + }, + "parserOptions": { + "ecmaVersion": 6, + "sourceType": "module" + }, + "ecmaFeatures": { + "arrowFunctions": true, + "binaryLiterals": true, + "blockBindings": true, + "classes": true, + "defaultParams": true, + "destructuring": true, + "forOf": true, + "generators": true, + "modules": true, + "objectLiteralComputedProperties": true, + "objectLiteralDuplicateProperties": true, + "objectLiteralShorthandMethods": true, + "objectLiteralShorthandProperties": true, + "octalLiterals": true, + "regexUFlag": true, + "regexYFlag": true, + "spread": true, + "superInFunctions": false, + "templateStrings": true, + "unicodeCodePointEscapes": true, + "globalReturn": true, + "jsx": true + }, + "rules": { + "eqeqeq": 2, + "strict": 0, + "no-empty": 1, + "no-alert": 2, + "no-eval": 2, + "quotes": [1, "single", "avoid-escape"], + "no-trailing-spaces": [2, { "skipBlankLines": true }], + "eol-last": 0, + "yoda": [2, "never", { "exceptRange": true }] + } } diff --git a/.gitignore b/.gitignore index 02407f0..6215441 100644 --- a/.gitignore +++ b/.gitignore @@ -14,7 +14,6 @@ vendor/ node_modules/ bower_components/ - # Macintosh # ----------------- diff --git a/Gruntfile.js b/Gruntfile.js index cc7d883..80d02e5 100644 --- a/Gruntfile.js +++ b/Gruntfile.js @@ -9,27 +9,27 @@ module.exports = function (grunt) { - var path = require('path'); + var path = require('path'); - require('load-grunt-config')(grunt, { - configPath: path.join(process.cwd(), 'build/grunt/config'), - data: { - paths: { - grunt: 'build/grunt', - npm: 'node_modules', - js: { - src: 'assets/scripts', - dist: 'www/assets/scripts' - }, - css: { - src: 'assets/styles', - dist: 'www/assets/styles' - }, - img: { - src: 'assets/images', - dist: 'www/assets/images' - } - } - } - }); + require('load-grunt-config')(grunt, { + configPath: path.join(process.cwd(), 'build/grunt/config'), + data: { + paths: { + grunt: 'build/grunt', + npm: 'node_modules', + js: { + src: 'assets/scripts', + dist: 'www/assets/scripts' + }, + css: { + src: 'assets/styles', + dist: 'www/assets/styles' + }, + img: { + src: 'assets/images', + dist: 'www/assets/images' + } + } + } + }); }; diff --git a/LICENSE b/LICENSE index 357a673..c5a60e2 100644 --- a/LICENSE +++ b/LICENSE @@ -1,6 +1,6 @@ The MIT License (MIT) -Copyright (c) Locomotive +Copyright (c) Locomotive, Inc. Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the "Software"), to deal in diff --git a/README.md b/README.md index 5e6dd96..94961a3 100644 --- a/README.md +++ b/README.md @@ -1,50 +1,51 @@ -Locomotive front-end boilerplate -==================== +Locomotive's Front-end Boilerplate +================================== -Front-end Boilerplate for projects by Locomotive. +Front-end boilerplate for projects by [Locomotive][locomtl]. ## Requirements -| Prerequisite | How to check | How to install | -| --------------- | ------------- | -------------- | -| Node.js 4.1.1 | `node -v` | [nodejs.org](//nodejs.org/) | -| Grunt >= 0.1.13 | `grunt -v` | `npm install -g grunt-cli` | - +| Prerequisite | How to check | How to install | +| --------------- | ------------- | -------------------------------- | +| Node.js 4.1.1 | `node -v` | [nodejs.org](https://nodejs.org) | +| Grunt >= 0.1.13 | `grunt -v` | `npm install -g grunt-cli` | ## Getting started -1. **Get the latest node modules** - 1. `npm install -g npm-check-updates` - 2. `npm-check-updates -u` - 3. `npm install` +1. **Get the latest node modules** + 1. `npm install -g npm-check-updates` + 2. `npm-check-updates -u` + 3. `npm install` -2. **Run grunt and start coding** - - `grunt` +2. **Run grunt and start coding** + - `grunt` ### Grunt + Each Grunt task has it's own file in the `grunt_tasks` folder. ### BrowserSync + BrowserSync will automatically inject, refresh and sync all your browsers. Run `grunt sync` ## CSS -- We use [Sass](http://sass-lang.com/) for our CSS Preprocessor -- [itcss](http://itcss.io/) CSS architecture -- More Minimal BEM like CSS Syntax: `.block_element -modifier` -- [More Transparent UI Code with Namespaces](http://csswizardry.com/2015/03/more-transparent-ui-code-with-namespaces/) +- We use [Sass](http://sass-lang.com) for our CSS Preprocessor +- [itcss](http://itcss.io) CSS architecture +- More Minimal BEM like CSS Syntax: `.block_element -modifier` +- [More Transparent UI Code with Namespaces](http://csswizardry.com/2015/03/more-transparent-ui-code-with-namespaces) ### Sass import order -* **Settings:** Global variables, site-wide settings, config switches, etc. -* **Tools:** Site-wide mixins and functions. -* **Generic:** Low-specificity, far-reaching rulesets (e.g. resets). -* **Base:** Unclassed HTML elements (e.g. `a {}`, `blockquote {}`, `address {}`). -* **Objects:** Objects, abstractions, and design patterns (e.g. `.o-media {}`). -* **Components:** Discrete, complete chunks of UI (e.g. `.c-carousel {}`). -* **Trumps:** High-specificity, very explicit selectors. Overrides and helper +* **Settings:** Global variables, site-wide settings, config switches, etc. +* **Tools:** Site-wide mixins and functions. +* **Generic:** Low-specificity, far-reaching rulesets (e.g. resets). +* **Base:** Unclassed HTML elements (e.g. `a {}`, `blockquote {}`, `address {}`). +* **Objects:** Objects, abstractions, and design patterns (e.g. `.o-media {}`). +* **Components:** Discrete, complete chunks of UI (e.g. `.c-carousel {}`). +* **Trumps:** High-specificity, very explicit selectors. Overrides and helper classes (e.g. `.u-hidden {}`). ### Grid @@ -56,19 +57,24 @@ We are using a simple inline-block grid system. Insert a `o-grid` block and add `o-grid_item` elements inside it. No rows that contain floats, no twelve columns system; just the number of items you want, with the classes names you want, inside a single block. -- Include the grid mixins in your components classes. -- Create custom width grid items by including the `grid_item` mixin and adding the widths you need or just include the helpers mixins with fractions like names. -- Add media queries, on the helpers mixins or on your custom components to change the grid items widths, for your content, on different screen sizes. +- Include the grid mixins in your components classes. +- Create custom width grid items by including the `grid_item` mixin and adding the widths you need or just include the helpers mixins with fractions like names. +- Add media queries, on the helpers mixins or on your custom components to change the grid items widths, for your content, on different screen sizes. -*[Demo](http://codepen.io/AntoineBoulanger/pen/EaLNxe)* +*[Demo][demo-grid]* ### Form We included some basic CSS styles and resets to the form elements so we can easily have custom style form elements that work on every browsers. -*[Demo](http://codepen.io/AntoineBoulanger/pen/uBJmi)* +*[Demo][demo-form]* ## JavaScript -- We use HTML data attributes to init our JavaScript modules: `data-module` -- All DOM related JavaScript is hooked to `js-` prefixed HTML classes -- [jQuery](https://jquery.com/) is globally included + +- We use HTML data attributes to init our JavaScript modules: `data-module` +- All DOM related JavaScript is hooked to `js-` prefixed HTML classes +- [jQuery](https://jquery.com) is globally included + +[locomtl]: https://locomotive.ca +[demo-grid]: https://codepen.io/AntoineBoulanger/pen/EaLNxe +[demo-form]: https://codepen.io/AntoineBoulanger/pen/uBJmi diff --git a/assets/scripts/App.js b/assets/scripts/App.js index c9a79c5..38d8ebf 100644 --- a/assets/scripts/App.js +++ b/assets/scripts/App.js @@ -9,50 +9,50 @@ import globals from './utils/globals'; import * as modules from './modules'; class App { - constructor() { - this.modules = modules; - this.currentModules = []; + constructor() { + this.modules = modules; + this.currentModules = []; - $document.on('initModules.App', (event) => { - this.initGlobals(event.firstBlood) - .deleteModules() - .initModules(); - }); - } + $document.on('initModules.App', (event) => { + this.initGlobals(event.firstBlood) + .deleteModules() + .initModules(); + }); + } - /** - * Destroy all existing modules - * @return {Object} this Allows chaining - */ - deleteModules() { - // Loop modules - var i = this.currentModules.length; + /** + * Destroy all existing modules + * @return {Object} this Allows chaining + */ + deleteModules() { + // Loop modules + var i = this.currentModules.length; - // Destroy all modules - while (i--) { - this.currentModules[i].destroy(); - this.currentModules.splice(i); - } + // Destroy all modules + while (i--) { + this.currentModules[i].destroy(); + this.currentModules.splice(i); + } - return this; - } + return this; + } - /** - * Execute global functions and settings - * Allows you to initialize global modules only once if you need - * (ex.: when using Barba.js or SmoothState.js) - * @return {Object} this Allows chaining - */ - initGlobals(firstBlood) { - globals(firstBlood); - return this; - } + /** + * Execute global functions and settings + * Allows you to initialize global modules only once if you need + * (ex.: when using Barba.js or SmoothState.js) + * @return {Object} this Allows chaining + */ + initGlobals(firstBlood) { + globals(firstBlood); + return this; + } - /** - * Find modules and initialize them - * @return {Object} this Allows chaining - */ - initModules() { + /** + * Find modules and initialize them + * @return {Object} this Allows chaining + */ + initModules() { // Elements with module var moduleEls = document.querySelectorAll('[data-module]'); diff --git a/assets/scripts/modules/AbstractModule.js b/assets/scripts/modules/AbstractModule.js index e6dec19..84bc538 100644 --- a/assets/scripts/modules/AbstractModule.js +++ b/assets/scripts/modules/AbstractModule.js @@ -6,12 +6,12 @@ import { $document, $window, $html, $body } from '../utils/environment'; * Gives access to generic jQuery nodes */ export default class { - constructor(options) { - this.$document = $document; - this.$window = $window; - this.$html = $html; - this.$body = $body; - this.$el = options.$el; - this.el = options.el; - } + constructor(options) { + this.$document = $document; + this.$window = $window; + this.$html = $html; + this.$body = $body; + this.$el = options.$el; + this.el = options.el; + } } diff --git a/assets/scripts/modules/Button.js b/assets/scripts/modules/Button.js index d5092f9..dd60f4d 100644 --- a/assets/scripts/modules/Button.js +++ b/assets/scripts/modules/Button.js @@ -2,15 +2,15 @@ import AbstractModule from './AbstractModule'; export default class extends AbstractModule { - constructor(options) { - super(options); + constructor(options) { + super(options); - this.$el.on('click.Button', (event) => { - this.$document.trigger('Title.changeLabel', [$(event.currentTarget).val()]); - }); - } + this.$el.on('click.Button', (event) => { + this.$document.trigger('Title.changeLabel', [$(event.currentTarget).val()]); + }); + } - destroy() { - this.$el.off('.Button'); - } + destroy() { + this.$el.off('.Button'); + } } diff --git a/assets/scripts/modules/Title.js b/assets/scripts/modules/Title.js index 8c33014..791d4af 100644 --- a/assets/scripts/modules/Title.js +++ b/assets/scripts/modules/Title.js @@ -3,56 +3,56 @@ import { visibilityApi } from '../utils/visibility'; import AbstractModule from './AbstractModule'; export default class extends AbstractModule { - constructor(options) { - super(options); + constructor(options) { + super(options); - this.$label = this.$el.find('.js-label'); + this.$label = this.$el.find('.js-label'); - this.$document.on('Title.changeLabel', (event, value) => { - this.changeLabel(value); - this.destroy(); - }); + this.$document.on('Title.changeLabel', (event, value) => { + this.changeLabel(value); + this.destroy(); + }); - this.hiddenCallbackIdent = visibilityApi({ - action: 'addCallback', - state: 'hidden', - callback: this.logHidden - }); + this.hiddenCallbackIdent = visibilityApi({ + action: 'addCallback', + state: 'hidden', + callback: this.logHidden + }); - this.visibleCallbackIdent = visibilityApi({ - action: 'addCallback', - state: 'visible', - callback: this.logVisible - }); - } + this.visibleCallbackIdent = visibilityApi({ + action: 'addCallback', + state: 'visible', + callback: this.logVisible + }); + } - logHidden() { - console.log('Title is hidden'); - } + logHidden() { + console.log('Title is hidden'); + } - logVisible() { - console.log('Title is visible'); - } + logVisible() { + console.log('Title is visible'); + } - changeLabel(value) { - this.$label.text(value); - } + changeLabel(value) { + this.$label.text(value); + } - destroy() { - this.$document.off('Title.changeLabel'); + destroy() { + this.$document.off('Title.changeLabel'); - visibilityApi({ - action: 'removeCallback', - state: 'hidden', - ident: this.hiddenCallbackIdent - }); + visibilityApi({ + action: 'removeCallback', + state: 'hidden', + ident: this.hiddenCallbackIdent + }); - visibilityApi({ - action: 'removeCallback', - state: 'visible', - ident: this.visibleCallbackIdent - }); + visibilityApi({ + action: 'removeCallback', + state: 'visible', + ident: this.visibleCallbackIdent + }); - this.$el.off('.Title'); - } + this.$el.off('.Title'); + } } diff --git a/assets/scripts/utils/array.js b/assets/scripts/utils/array.js index 60fb514..f197a22 100644 --- a/assets/scripts/utils/array.js +++ b/assets/scripts/utils/array.js @@ -1,83 +1,83 @@ import { isArray } from './is'; export function addToArray ( array, value ) { - var index = array.indexOf( value ); + var index = array.indexOf( value ); - if ( index === -1 ) { - array.push( value ); - } + if ( index === -1 ) { + array.push( value ); + } } export function arrayContains ( array, value ) { - for ( let i = 0, c = array.length; i < c; i++ ) { - if ( array[i] == value ) { - return true; - } - } + for ( let i = 0, c = array.length; i < c; i++ ) { + if ( array[i] == value ) { + return true; + } + } - return false; + return false; } export function arrayContentsMatch ( a, b ) { - var i; + var i; - if ( !isArray( a ) || !isArray( b ) ) { - return false; - } + if ( !isArray( a ) || !isArray( b ) ) { + return false; + } - if ( a.length !== b.length ) { - return false; - } + if ( a.length !== b.length ) { + return false; + } - i = a.length; - while ( i-- ) { - if ( a[i] !== b[i] ) { - return false; - } - } + i = a.length; + while ( i-- ) { + if ( a[i] !== b[i] ) { + return false; + } + } - return true; + return true; } export function ensureArray ( x ) { - if ( typeof x === 'string' ) { - return [ x ]; - } + if ( typeof x === 'string' ) { + return [ x ]; + } - if ( x === undefined ) { - return []; - } + if ( x === undefined ) { + return []; + } - return x; + return x; } export function lastItem ( array ) { - return array[ array.length - 1 ]; + return array[ array.length - 1 ]; } export function removeFromArray ( array, member ) { - if ( !array ) { - return; - } + if ( !array ) { + return; + } - const index = array.indexOf( member ); + const index = array.indexOf( member ); - if ( index !== -1 ) { - array.splice( index, 1 ); - } + if ( index !== -1 ) { + array.splice( index, 1 ); + } } export function toArray ( arrayLike ) { - var array = [], i = arrayLike.length; - while ( i-- ) { - array[i] = arrayLike[i]; - } + var array = [], i = arrayLike.length; + while ( i-- ) { + array[i] = arrayLike[i]; + } - return array; + return array; } export function findByKeyValue( array, key, value ) { - return array.filter(function( obj ) { - return obj[key] === value; - }); + return array.filter(function( obj ) { + return obj[key] === value; + }); } diff --git a/assets/scripts/utils/globals.js b/assets/scripts/utils/globals.js index abfdbbb..b80342e 100644 --- a/assets/scripts/utils/globals.js +++ b/assets/scripts/utils/globals.js @@ -1,5 +1,5 @@ /* jshint esnext: true */ export default function() { - svg4everybody(); + svg4everybody(); } diff --git a/assets/scripts/utils/is.js b/assets/scripts/utils/is.js index a288d61..8a1e503 100644 --- a/assets/scripts/utils/is.js +++ b/assets/scripts/utils/is.js @@ -1,37 +1,37 @@ var toString = Object.prototype.toString, - arrayLikePattern = /^\[object (?:Array|FileList)\]$/; + arrayLikePattern = /^\[object (?:Array|FileList)\]$/; // thanks, http://perfectionkills.com/instanceof-considered-harmful-or-how-to-write-a-robust-isarray/ export function isArray ( thing ) { - return toString.call( thing ) === '[object Array]'; + return toString.call( thing ) === '[object Array]'; } export function isArrayLike ( obj ) { - return arrayLikePattern.test( toString.call( obj ) ); + return arrayLikePattern.test( toString.call( obj ) ); } export function isEqual ( a, b ) { - if ( a === null && b === null ) { - return true; - } + if ( a === null && b === null ) { + return true; + } - if ( typeof a === 'object' || typeof b === 'object' ) { - return false; - } + if ( typeof a === 'object' || typeof b === 'object' ) { + return false; + } - return a === b; + return a === b; } // http://stackoverflow.com/questions/18082/validate-numbers-in-javascript-isnumeric export function isNumeric ( thing ) { - return !isNaN( parseFloat( thing ) ) && isFinite( thing ); + return !isNaN( parseFloat( thing ) ) && isFinite( thing ); } export function isObject ( thing ) { - return ( thing && toString.call( thing ) === '[object Object]' ); + return ( thing && toString.call( thing ) === '[object Object]' ); } export function isFunction( thing ) { - var getType = {}; - return thing && getType.toString.call(thing) === '[object Function]'; + var getType = {}; + return thing && getType.toString.call(thing) === '[object Function]'; } diff --git a/assets/scripts/utils/visibility.js b/assets/scripts/utils/visibility.js index 441601b..92c64b1 100644 --- a/assets/scripts/utils/visibility.js +++ b/assets/scripts/utils/visibility.js @@ -4,18 +4,18 @@ import { arrayContains, findByKeyValue, removeFromArray } from './array'; import { $document, $window, $html, $body } from './environment'; const CALLBACKS = { - hidden: [], - visible: [] + hidden: [], + visible: [] }; const ACTIONS = [ - 'addCallback', - 'removeCallback' + 'addCallback', + 'removeCallback' ]; const STATES = [ - 'visible', - 'hidden' + 'visible', + 'hidden' ]; const PREFIX = 'v-'; @@ -24,11 +24,11 @@ let UUID = 0; // Main event $document.on('visibilitychange', function(event) { - if (document.hidden) { - onDocumentChange('hidden'); - } else { - onDocumentChange('visible'); - } + if (document.hidden) { + onDocumentChange('hidden'); + } else { + onDocumentChange('visible'); + } }); /** @@ -38,21 +38,21 @@ $document.on('visibilitychange', function(event) { * @return {string} ident */ function addCallback (state, options) { - let callback = options.callback || ''; + let callback = options.callback || ''; - if (!isFunction(callback)) { - console.warn('Callback is not a function'); - return false; - } + if (!isFunction(callback)) { + console.warn('Callback is not a function'); + return false; + } - let ident = PREFIX + UUID++; + let ident = PREFIX + UUID++; - CALLBACKS[state].push({ - ident: ident, - callback: callback - }); + CALLBACKS[state].push({ + ident: ident, + callback: callback + }); - return ident; + return ident; } /** @@ -62,25 +62,25 @@ function addCallback (state, options) { * @return {boolean} If operation was a success */ function removeCallback (state, options) { - let ident = options.ident || ''; + let ident = options.ident || ''; - if (typeof(ident) === 'undefined' || ident === '') { - console.warn('Need ident to remove callback'); - return false; - } + if (typeof(ident) === 'undefined' || ident === '') { + console.warn('Need ident to remove callback'); + return false; + } - let index = findByKeyValue(CALLBACKS[state], 'ident', ident)[0]; + let index = findByKeyValue(CALLBACKS[state], 'ident', ident)[0]; - // console.log(ident) - // console.log(CALLBACKS[state]) + // console.log(ident) + // console.log(CALLBACKS[state]) - if (typeof(index) !== 'undefined') { - removeFromArray(CALLBACKS[state], index); - return true; - } else { - console.warn('Callback could not be found'); - return false; - } + if (typeof(index) !== 'undefined') { + removeFromArray(CALLBACKS[state], index); + return true; + } else { + console.warn('Callback could not be found'); + return false; + } } /** @@ -88,13 +88,13 @@ function removeCallback (state, options) { * @param {string} state Visible or hidden */ function onDocumentChange (state) { - let callbackArray = CALLBACKS[state]; - let i = 0; - let len = callbackArray.length; + let callbackArray = CALLBACKS[state]; + let i = 0; + let len = callbackArray.length; - for (; i < len; i++) { - callbackArray[i].callback(); - } + for (; i < len; i++) { + callbackArray[i].callback(); + } } /** @@ -103,28 +103,28 @@ function onDocumentChange (state) { * @return {boolean|integer} Unique identifier for the callback or boolean indicating success or failure */ function visibilityApi (options) { - let action = options.action || ''; - let state = options.state || ''; - let ret; + let action = options.action || ''; + let state = options.state || ''; + let ret; - // Type and value checking - if (!arrayContains(ACTIONS, action)) { - console.warn('Action does not exist'); - return false; - } - if (!arrayContains(STATES, state)) { - console.warn('State does not exist'); - return false; - } + // Type and value checking + if (!arrayContains(ACTIONS, action)) { + console.warn('Action does not exist'); + return false; + } + if (!arrayContains(STATES, state)) { + console.warn('State does not exist'); + return false; + } - // @todo Magic call function pls - if (action === 'addCallback') { - ret = addCallback(state, options); - } else if (action === 'removeCallback') { - ret = removeCallback(state, options); - } + // @todo Magic call function pls + if (action === 'addCallback') { + ret = addCallback(state, options); + } else if (action === 'removeCallback') { + ret = removeCallback(state, options); + } - return ret; + return ret; } export { visibilityApi }; diff --git a/assets/styles/base/_base.scss b/assets/styles/base/_base.scss index f9335a6..4447712 100644 --- a/assets/styles/base/_base.scss +++ b/assets/styles/base/_base.scss @@ -2,35 +2,35 @@ // Base // ========================================================================== html { - color: $color; - font-size: $font-size; - font-family: $font-family; - line-height: $line-height; + color: $color; + font-size: $font-size; + font-family: $font-family; + line-height: $line-height; } ::selection { - background: $selection; - color: $selection-text; - text-shadow: none; + background: $selection; + color: $selection-text; + text-shadow: none; } hr { - display: block; - margin: 1em 0; - padding: 0; - height: 1px; - border: 0; - border-top: 1px solid #cccccc; + display: block; + margin: 1em 0; + padding: 0; + height: 1px; + border: 0; + border-top: 1px solid #cccccc; } img, svg { - max-width: 100%; + max-width: 100%; } a { - color: $link; + color: $link; - &:hover { - color: $link-hover; - } + &:hover { + color: $link-hover; + } } diff --git a/assets/styles/base/_headings.scss b/assets/styles/base/_headings.scss index 4beff54..2b4e020 100644 --- a/assets/styles/base/_headings.scss +++ b/assets/styles/base/_headings.scss @@ -2,45 +2,45 @@ // Headings // ========================================================================== @mixin h { - margin-top: 0; - line-height: $heading-line-height; + margin-top: 0; + line-height: $heading-line-height; } .o-h { - @include h; + @include h; } h1, .o-h1 { - @extend .o-h; + @extend .o-h; - font-size: rem($heading1); + font-size: rem($heading1); } h2, .o-h2 { - @extend .o-h; + @extend .o-h; - font-size: rem($heading2); + font-size: rem($heading2); } h3, .o-h3 { - @extend .o-h; + @extend .o-h; - font-size: rem($heading3); + font-size: rem($heading3); } h4, .o-h4 { - @extend .o-h; + @extend .o-h; - font-size: rem($heading4); + font-size: rem($heading4); } h5, .o-h5 { - @extend .o-h; + @extend .o-h; - font-size: rem($heading5); + font-size: rem($heading5); } h6, .o-h6 { - @extend .o-h; + @extend .o-h; - font-size: rem($heading6); + font-size: rem($heading6); } diff --git a/assets/styles/generic/_button.scss b/assets/styles/generic/_button.scss index 2f665ba..52a3459 100644 --- a/assets/styles/generic/_button.scss +++ b/assets/styles/generic/_button.scss @@ -3,24 +3,24 @@ // ========================================================================== button, .o-button { - display: inline-block; - overflow: visible; - margin: 0; - padding: 0; - outline: 0; - border: 0; - background: none; - color: inherit; - vertical-align: middle; - text-align: center; - text-decoration: none; - text-transform: none; - font: inherit; - line-height: normal; - cursor: pointer; - user-select: none; + display: inline-block; + overflow: visible; + margin: 0; + padding: 0; + outline: 0; + border: 0; + background: none; + color: inherit; + vertical-align: middle; + text-align: center; + text-decoration: none; + text-transform: none; + font: inherit; + line-height: normal; + cursor: pointer; + user-select: none; - &:hover { - text-decoration: none; - } + &:hover { + text-decoration: none; + } } diff --git a/assets/styles/generic/_form.scss b/assets/styles/generic/_form.scss index 5c4390b..723c501 100644 --- a/assets/styles/generic/_form.scss +++ b/assets/styles/generic/_form.scss @@ -4,39 +4,39 @@ input, select, textarea { - display: block; - margin: 0; - padding: 0; - width: 100%; - outline: 0; - border: 0; - border-radius: 0; - color: inherit; - font: inherit; - line-height: normal; - appearance: none; + display: block; + margin: 0; + padding: 0; + width: 100%; + outline: 0; + border: 0; + border-radius: 0; + color: inherit; + font: inherit; + line-height: normal; + appearance: none; } select { - text-transform: none; + text-transform: none; - &::-ms-expand { - display: none; - } + &::-ms-expand { + display: none; + } - &::-ms-value { - background: none; - color: inherit; - } + &::-ms-value { + background: none; + color: inherit; + } - // Remove Firefox :focus dotted outline, breaks color inherit - /*&:-moz-focusring { + // Remove Firefox :focus dotted outline, breaks color inherit + /*&:-moz-focusring { color: transparent; text-shadow: 0 0 0 #000000; // Text :focus color }*/ } textarea { - overflow: auto; - resize: vertical; + overflow: auto; + resize: vertical; } diff --git a/assets/styles/generic/_generic.scss b/assets/styles/generic/_generic.scss index 429d62d..3aaf28f 100644 --- a/assets/styles/generic/_generic.scss +++ b/assets/styles/generic/_generic.scss @@ -2,11 +2,11 @@ // Generic resets // ========================================================================== html { - box-sizing: border-box; + box-sizing: border-box; } *, *:before, *:after { - box-sizing: inherit; + box-sizing: inherit; } audio, @@ -15,5 +15,5 @@ iframe, img, svg, video { - vertical-align: middle; + vertical-align: middle; } diff --git a/assets/styles/main.scss b/assets/styles/main.scss index 70a6f19..e689aed 100644 --- a/assets/styles/main.scss +++ b/assets/styles/main.scss @@ -1,4 +1,7 @@ -// ========================================================================== -// Main -// ========================================================================== +/** + * Front-end Styles + * + * @package Boilerplate + */ + @import "_imports.scss"; diff --git a/assets/styles/objects/_button.scss b/assets/styles/objects/_button.scss index 1cabd80..2992fd1 100644 --- a/assets/styles/objects/_button.scss +++ b/assets/styles/objects/_button.scss @@ -2,18 +2,18 @@ // Button objects // ========================================================================== .o-button { - padding: rem(10px); - background-color: lightgray; + padding: rem(10px); + background-color: lightgray; - &:focus { - background-color: darkgray; - } + &:focus { + background-color: darkgray; + } - &:hover { - background-color: gray; - } + &:hover { + background-color: gray; + } - &:active { - background-color: dimgray; - } + &:active { + background-color: dimgray; + } } diff --git a/assets/styles/objects/_container.scss b/assets/styles/objects/_container.scss index 3e79a85..5a9f967 100644 --- a/assets/styles/objects/_container.scss +++ b/assets/styles/objects/_container.scss @@ -2,9 +2,9 @@ // Container // ========================================================================== .o-container { - position: relative; - margin: 0 auto; - padding-right: rem($padding); - padding-left: rem($padding); - max-width: rem($max-width) + rem($padding * 2); + position: relative; + margin: 0 auto; + padding-right: rem($padding); + padding-left: rem($padding); + max-width: rem($max-width) + rem($padding * 2); } diff --git a/assets/styles/objects/_form.scss b/assets/styles/objects/_form.scss index a779f7d..46bbed0 100644 --- a/assets/styles/objects/_form.scss +++ b/assets/styles/objects/_form.scss @@ -5,8 +5,8 @@ // Label // ========================================================================== .o-label { - display: block; - margin-bottom: rem(15px); + display: block; + margin-bottom: rem(15px); } // Input @@ -14,19 +14,19 @@ $input-icon-color: 424242; // No # .o-input { - padding: rem(10px); - border-width: 1px; - border-style: solid; - border-color: lightgray; - background-color: white; + padding: rem(10px); + border-width: 1px; + border-style: solid; + border-color: lightgray; + background-color: white; - &:focus { - border-color: gray; - } + &:focus { + border-color: gray; + } - &::placeholder { - color: gray; - } + &::placeholder { + color: gray; + } } // Checkbox @@ -35,58 +35,58 @@ $checkbox: rem(18px); $checkbox-icon-color: $input-icon-color; .o-checkbox { - position: absolute; - width: 0; - opacity: 0; + position: absolute; + width: 0; + opacity: 0; - &:focus { - + .o-checkbox-label { - &::before { - border-color: gray; - } - } - } + &:focus { + + .o-checkbox-label { + &::before { + border-color: gray; + } + } + } - &:checked { - + .o-checkbox-label { - &::after { - opacity: 1; - } - } - } + &:checked { + + .o-checkbox-label { + &::after { + opacity: 1; + } + } + } } .o-checkbox-label { - @extend .o-label; + @extend .o-label; - position: relative; - display: inline-block; - margin-right: 0.5em; - padding-left: ($checkbox + rem(10px)); + position: relative; + display: inline-block; + margin-right: 0.5em; + padding-left: ($checkbox + rem(10px)); - &::before, &::after { - @extend .o-input; + &::before, &::after { + @extend .o-input; - position: absolute; - top: 50%; - left: 0; - display: inline-block; - margin-top: (-$checkbox / 2); - padding: 0; - width: $checkbox; - height: $checkbox; - content: ""; - } + position: absolute; + top: 50%; + left: 0; + display: inline-block; + margin-top: (-$checkbox / 2); + padding: 0; + width: $checkbox; + height: $checkbox; + content: ""; + } - &::after { - border-color: transparent; - background-color: transparent; - background-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20version%3D%221.1%22%20x%3D%220%22%20y%3D%220%22%20width%3D%2213%22%20height%3D%2210.5%22%20viewBox%3D%220%200%2013%2010.5%22%20enable-background%3D%22new%200%200%2013%2010.5%22%20xml%3Aspace%3D%22preserve%22%3E%3Cpath%20fill%3D%22%23#{$checkbox-icon-color}%22%20d%3D%22M4.8%205.8L2.4%203.3%200%205.7l4.8%204.8L13%202.4c0%200-2.4-2.4-2.4-2.4L4.8%205.8z%22%2F%3E%3C%2Fsvg%3E"); - background-position: center; - background-size: rem(13px); - background-repeat: no-repeat; - opacity: 0; - } + &::after { + border-color: transparent; + background-color: transparent; + background-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20version%3D%221.1%22%20x%3D%220%22%20y%3D%220%22%20width%3D%2213%22%20height%3D%2210.5%22%20viewBox%3D%220%200%2013%2010.5%22%20enable-background%3D%22new%200%200%2013%2010.5%22%20xml%3Aspace%3D%22preserve%22%3E%3Cpath%20fill%3D%22%23#{$checkbox-icon-color}%22%20d%3D%22M4.8%205.8L2.4%203.3%200%205.7l4.8%204.8L13%202.4c0%200-2.4-2.4-2.4-2.4L4.8%205.8z%22%2F%3E%3C%2Fsvg%3E"); + background-position: center; + background-size: rem(13px); + background-repeat: no-repeat; + opacity: 0; + } } // Radio @@ -94,20 +94,20 @@ $checkbox-icon-color: $input-icon-color; $radio-icon-color: $input-icon-color; .o-radio { - @extend .o-checkbox; + @extend .o-checkbox; } .o-radio-label { - @extend .o-checkbox-label; + @extend .o-checkbox-label; - &::before, &::after { - border-radius: 50%; - } + &::before, &::after { + border-radius: 50%; + } - &::after { - background-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20version%3D%221.1%22%20x%3D%220%22%20y%3D%220%22%20width%3D%2213%22%20height%3D%2213%22%20viewBox%3D%220%200%2013%2013%22%20enable-background%3D%22new%200%200%2013%2013%22%20xml%3Aspace%3D%22preserve%22%3E%3Ccircle%20fill%3D%22%23#{$radio-icon-color}%22%20cx%3D%226.5%22%20cy%3D%226.5%22%20r%3D%226.5%22%2F%3E%3C%2Fsvg%3E"); - background-size: rem(8px); - } + &::after { + background-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20version%3D%221.1%22%20x%3D%220%22%20y%3D%220%22%20width%3D%2213%22%20height%3D%2213%22%20viewBox%3D%220%200%2013%2013%22%20enable-background%3D%22new%200%200%2013%2013%22%20xml%3Aspace%3D%22preserve%22%3E%3Ccircle%20fill%3D%22%23#{$radio-icon-color}%22%20cx%3D%226.5%22%20cy%3D%226.5%22%20r%3D%226.5%22%2F%3E%3C%2Fsvg%3E"); + background-size: rem(8px); + } } // Select @@ -116,36 +116,36 @@ $select-icon: rem(40px); $select-icon-color: $input-icon-color; .o-select { - @extend .o-input; + @extend .o-input; - position: relative; - z-index: 1; - padding-right: $select-icon; + position: relative; + z-index: 1; + padding-right: $select-icon; } .o-select-wrap { - position: relative; + position: relative; - &::after { - position: absolute; - top: 0; - right: 0; - bottom: 0; - z-index: 2; - width: $select-icon; - background-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20version%3D%221.1%22%20x%3D%220%22%20y%3D%220%22%20width%3D%2213%22%20height%3D%2211.3%22%20viewBox%3D%220%200%2013%2011.3%22%20enable-background%3D%22new%200%200%2013%2011.3%22%20xml%3Aspace%3D%22preserve%22%3E%3Cpolygon%20fill%3D%22%23#{$select-icon-color}%22%20points%3D%226.5%2011.3%203.3%205.6%200%200%206.5%200%2013%200%209.8%205.6%20%22%2F%3E%3C%2Fsvg%3E"); - background-position: center; - background-size: rem(10px); - background-repeat: no-repeat; - content: ""; - pointer-events: none; - } + &::after { + position: absolute; + top: 0; + right: 0; + bottom: 0; + z-index: 2; + width: $select-icon; + background-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20version%3D%221.1%22%20x%3D%220%22%20y%3D%220%22%20width%3D%2213%22%20height%3D%2211.3%22%20viewBox%3D%220%200%2013%2011.3%22%20enable-background%3D%22new%200%200%2013%2011.3%22%20xml%3Aspace%3D%22preserve%22%3E%3Cpolygon%20fill%3D%22%23#{$select-icon-color}%22%20points%3D%226.5%2011.3%203.3%205.6%200%200%206.5%200%2013%200%209.8%205.6%20%22%2F%3E%3C%2Fsvg%3E"); + background-position: center; + background-size: rem(10px); + background-repeat: no-repeat; + content: ""; + pointer-events: none; + } } // Textarea // ========================================================================== .o-textarea { - @extend .o-input; + @extend .o-input; - min-height: rem(100px); + min-height: rem(100px); } diff --git a/assets/styles/objects/_grid.scss b/assets/styles/objects/_grid.scss index 725dc54..87a1806 100644 --- a/assets/styles/objects/_grid.scss +++ b/assets/styles/objects/_grid.scss @@ -2,21 +2,21 @@ // Grid // ========================================================================== @mixin grid($grid-gutter: 0) { - margin-left: -$grid-gutter; - letter-spacing: normal; - font-size: 0; + margin-left: -$grid-gutter; + letter-spacing: normal; + font-size: 0; } .o-grid { - @include grid; + @include grid; } @mixin grid_item($grid-gutter: 0) { - display: inline-block; - padding-left: $grid-gutter; - width: 100%; - vertical-align: top; - font-size: 1rem; + display: inline-block; + padding-left: $grid-gutter; + width: 100%; + vertical-align: top; + font-size: 1rem; } .o-grid_item { - @include grid_item; + @include grid_item; } diff --git a/assets/styles/tools/_functions.scss b/assets/styles/tools/_functions.scss index dec3d0c..478a1bc 100644 --- a/assets/styles/tools/_functions.scss +++ b/assets/styles/tools/_functions.scss @@ -2,13 +2,13 @@ // Functions // ========================================================================== @function em($px, $base: $font-size) { - @return ($px / $base) * 1em; + @return ($px / $base) * 1em; } @function rem($px, $base: $font-size) { - @return ($px / $base) * 1rem; + @return ($px / $base) * 1rem; } @function span($fraction) { - @return $fraction * 100%; + @return $fraction * 100%; } diff --git a/assets/styles/tools/_mixins.scss b/assets/styles/tools/_mixins.scss index 939f44a..14479e9 100644 --- a/assets/styles/tools/_mixins.scss +++ b/assets/styles/tools/_mixins.scss @@ -2,43 +2,43 @@ // Mixins // ========================================================================== @mixin vertical-center { - font-size: 0; + font-size: 0; - &:before { - display: inline-block; - height: 100%; - content: ""; - vertical-align: middle; - } + &:before { + display: inline-block; + height: 100%; + content: ""; + vertical-align: middle; + } - > * { - display: inline-block; - vertical-align: middle; - font-size: 1rem; - } + > * { + display: inline-block; + vertical-align: middle; + font-size: 1rem; + } } // Micro clearfix, as per {@link css-101.org/articles/clearfix/latest-new-clearfix-so-far.php CSS Mojo} // // @see inuitcss/generic.clearfix @mixin clearfix { - &:after { - display: table; - clear: both; - content: ""; - } + &:after { + display: table; + clear: both; + content: ""; + } } @mixin list-reset { - margin: 0; - padding: 0; - list-style: none; + margin: 0; + padding: 0; + list-style: none; } @mixin tap-highlight-color { - -webkit-tap-highlight-color: rgba(0, 0, 0, 0); + -webkit-tap-highlight-color: rgba(0, 0, 0, 0); } @mixin overflow-scrolling { - -webkit-overflow-scrolling: touch; + -webkit-overflow-scrolling: touch; } diff --git a/assets/styles/trumps/_helpers.scss b/assets/styles/trumps/_helpers.scss index 1d9aee5..9ee3647 100644 --- a/assets/styles/trumps/_helpers.scss +++ b/assets/styles/trumps/_helpers.scss @@ -2,11 +2,11 @@ // Helpers // ========================================================================== .u-vertical-center { - @include vertical-center; + @include vertical-center; } .u-clearfix { - @include clearfix; + @include clearfix; } /* @@ -15,8 +15,8 @@ */ .u-hidden { - display: none !important; - visibility: hidden; + display: none !important; + visibility: hidden; } /* @@ -25,14 +25,14 @@ */ .u-visuallyhidden { - position: absolute; - overflow: hidden; - clip: rect(0 0 0 0); - margin: -1px; - padding: 0; - width: 1px; - height: 1px; - border: 0; + position: absolute; + overflow: hidden; + clip: rect(0 0 0 0); + margin: -1px; + padding: 0; + width: 1px; + height: 1px; + border: 0; } /* @@ -43,12 +43,12 @@ .u-visuallyhidden.focusable:active, .u-visuallyhidden.focusable:focus { - position: static; - overflow: visible; - clip: auto; - margin: 0; - width: auto; - height: auto; + position: static; + overflow: visible; + clip: auto; + margin: 0; + width: auto; + height: auto; } /* @@ -56,5 +56,5 @@ */ .u-invisible { - visibility: hidden; + visibility: hidden; } diff --git a/assets/styles/trumps/_trumps.scss b/assets/styles/trumps/_trumps.scss index 1389cbc..0bbcaf5 100644 --- a/assets/styles/trumps/_trumps.scss +++ b/assets/styles/trumps/_trumps.scss @@ -2,33 +2,33 @@ // Trumps // ========================================================================== .u-left { - float: left !important; + float: left !important; } .u-right { - float: right !important; + float: right !important; } .u-align-left { - text-align: left !important; + text-align: left !important; } .u-align-right { - text-align: right !important; + text-align: right !important; } .u-align-center { - text-align: center !important; + text-align: center !important; } // States // ========================================================================== .is-visible { - visibility: visible !important; - opacity: 1 !important; + visibility: visible !important; + opacity: 1 !important; } .is-hidden { - visibility: hidden !important; - opacity: 0 !important; + visibility: hidden !important; + opacity: 0 !important; } diff --git a/build/grunt/config/aliases.json b/build/grunt/config/aliases.json index ce18eb0..8265290 100644 --- a/build/grunt/config/aliases.json +++ b/build/grunt/config/aliases.json @@ -1,41 +1,41 @@ { - "default": [ - "build" - ], + "default": [ + "build" + ], - "sync": [ - "browserSync", - "browserify:dev", - "watch", - "notify:watch" - ], + "sync": [ + "browserSync", + "browserify:dev", + "watch", + "notify:watch" + ], - "build": [ - "sass", - "postcss", - "cssmin", - "browserify:prod", - "concat:prod", - "uglify", - "svg_sprite", - "notify:build" - ], + "build": [ + "sass", + "postcss", + "cssmin", + "browserify:prod", + "concat:prod", + "uglify", + "svg_sprite", + "notify:build" + ], - "w": [ - "browserify:dev", - "watch", - "notify:watch" - ], + "w": [ + "browserify:dev", + "watch", + "notify:watch" + ], - "c": [ - "csscomb" - ], + "c": [ + "csscomb" + ], - "j": [ - "eslint" - ], + "j": [ + "eslint" + ], - "p": [ - "phplint" - ] + "p": [ + "phplint" + ] } diff --git a/build/grunt/config/browserSync.js b/build/grunt/config/browserSync.js index 49f3f1a..f0fba7e 100644 --- a/build/grunt/config/browserSync.js +++ b/build/grunt/config/browserSync.js @@ -1,19 +1,19 @@ module.exports = { - options: { - open : false, - proxy : 'localhost', - port : 3000, - watchTask : true, - notify : false - }, - dev: { - bsFiles: { - src : [ - '<%= paths.css.dist %>/**/*.css', - '<%= paths.js.dist %>/**/*.js', - '<%= paths.img.dist %>/**/*.svg', - '**/*.php' - ] - } - } + options: { + open : false, + proxy : 'localhost', + port : 3000, + watchTask : true, + notify : false + }, + dev: { + bsFiles: { + src : [ + '<%= paths.css.dist %>/**/*.css', + '<%= paths.js.dist %>/**/*.js', + '<%= paths.img.dist %>/**/*.svg', + '**/*.php' + ] + } + } }; diff --git a/build/grunt/config/browserify.js b/build/grunt/config/browserify.js index afb52d6..72df87c 100644 --- a/build/grunt/config/browserify.js +++ b/build/grunt/config/browserify.js @@ -1,39 +1,39 @@ module.exports = { - options: { - browserifyOptions: { - debug: false - }, - exclude: "", - transform: [ - ['babelify', { - presets: ['es2015'], - plugins: [ - ['transform-es2015-classes', {loose: true}] - ] - }] - ] - }, - dev: { - options: { - browserifyOptions: { - debug: true - }, - watch: true - }, - src: [ - '<%= paths.js.src %>/**/*.js', - '!<%= paths.js.src %>/vendors/**/*.js' - ], - dest: '<%= paths.js.dist %>/app.js' - }, - prod: { - options: { - banner: '/*! <%= package.title %> - <%= grunt.template.today("yyyy-mm-dd") %> */\n' - }, - src: [ - '<%= paths.js.src %>/**/*.js', - '!<%= paths.js.src %>/vendors/**/*.js' - ], - dest: '<%= paths.js.dist %>/app.js' - } + options: { + browserifyOptions: { + debug: false + }, + exclude: "", + transform: [ + ['babelify', { + presets: ['es2015'], + plugins: [ + ['transform-es2015-classes', {loose: true}] + ] + }] + ] + }, + dev: { + options: { + browserifyOptions: { + debug: true + }, + watch: true + }, + src: [ + '<%= paths.js.src %>/**/*.js', + '!<%= paths.js.src %>/vendors/**/*.js' + ], + dest: '<%= paths.js.dist %>/app.js' + }, + prod: { + options: { + banner: '/*! <%= package.title %> - <%= grunt.template.today("yyyy-mm-dd") %> */\n' + }, + src: [ + '<%= paths.js.src %>/**/*.js', + '!<%= paths.js.src %>/vendors/**/*.js' + ], + dest: '<%= paths.js.dist %>/app.js' + } }; diff --git a/build/grunt/config/concat.js b/build/grunt/config/concat.js index 17d599c..a0b6300 100644 --- a/build/grunt/config/concat.js +++ b/build/grunt/config/concat.js @@ -1,13 +1,13 @@ module.exports = { - prod: { - options: { - banner: '/*! Dependencies for <%= package.title %> - <%= grunt.template.today("yyyy-mm-dd") %> */\n' - }, - src : [ - '<%= paths.js.src %>/vendors/**/*.js', - '<%= paths.npm %>/svg4everybody/dist/svg4everybody.min.js' - ], - dest : '<%= paths.js.dist %>/vendors.js' - } + prod: { + options: { + banner: '/*! Dependencies for <%= package.title %> - <%= grunt.template.today("yyyy-mm-dd") %> */\n' + }, + src : [ + '<%= paths.js.src %>/vendors/**/*.js', + '<%= paths.npm %>/svg4everybody/dist/svg4everybody.min.js' + ], + dest : '<%= paths.js.dist %>/vendors.js' + } }; diff --git a/build/grunt/config/csscomb.js b/build/grunt/config/csscomb.js index ef10ae8..f66d7cc 100644 --- a/build/grunt/config/csscomb.js +++ b/build/grunt/config/csscomb.js @@ -1,15 +1,15 @@ module.exports = { - options: { - config: '.csscomb.json' - }, - dev: { - files: [ - { - expand : true, - cwd : '<%= paths.css.src %>', - src : [ '**/*.scss', '!base/_fonts.scss' ], - dest : '<%= paths.css.src %>' - } - ] - } + options: { + config: '.csscomb.json' + }, + dev: { + files: [ + { + expand : true, + cwd : '<%= paths.css.src %>', + src : [ '**/*.scss', '!base/_fonts.scss' ], + dest : '<%= paths.css.src %>' + } + ] + } }; diff --git a/build/grunt/config/cssmin.js b/build/grunt/config/cssmin.js index 9cb4286..1261349 100644 --- a/build/grunt/config/cssmin.js +++ b/build/grunt/config/cssmin.js @@ -1,13 +1,13 @@ module.exports = { - options: {}, - prod: { - files: [ - { - expand : true, - cwd : '<%= paths.css.dist %>', - src : [ '**/*.css', '!**/*.min.css' ], - dest : '<%= paths.css.dist %>' - } - ] - } + options: {}, + prod: { + files: [ + { + expand : true, + cwd : '<%= paths.css.dist %>', + src : [ '**/*.css', '!**/*.min.css' ], + dest : '<%= paths.css.dist %>' + } + ] + } }; diff --git a/build/grunt/config/eslint.js b/build/grunt/config/eslint.js index 0e90f5b..906ada7 100644 --- a/build/grunt/config/eslint.js +++ b/build/grunt/config/eslint.js @@ -1,11 +1,11 @@ module.exports = { - options: { - quiet : false, - format : require('eslint-tap'), - configFile : '.eslintrc' - }, - dev: [ - '<%= paths.js.src %>/**/*.js', - '!<%= paths.js.src %>/vendors/**/*.js' - ] + options: { + quiet : false, + format : require('eslint-tap'), + configFile : '.eslintrc' + }, + dev: [ + '<%= paths.js.src %>/**/*.js', + '!<%= paths.js.src %>/vendors/**/*.js' + ] }; diff --git a/build/grunt/config/notify.js b/build/grunt/config/notify.js index 8f0ea0a..bc09e81 100644 --- a/build/grunt/config/notify.js +++ b/build/grunt/config/notify.js @@ -1,36 +1,36 @@ module.exports = { - notify_hooks: { - options: { - enabled : true, - success : true, - duration : 3, - title : '<%= package.name %>', - max_jshint_notifications : 5 - } - }, - watch: { - options: { - message: 'Keeping an eye out, Chief!' - } - }, - build: { - options: { - message: 'Everything is ready to go!' - } - }, - sass: { - options: { - message: 'CSS is compiled' - } - }, - javascript: { - options: { - message: 'JavaScript is compiled' - } - }, - svg: { - options: { - message: 'SVG is concatenated' - } - } + notify_hooks: { + options: { + enabled : true, + success : true, + duration : 3, + title : '<%= package.name %>', + max_jshint_notifications : 5 + } + }, + watch: { + options: { + message: 'Keeping an eye out, Chief!' + } + }, + build: { + options: { + message: 'Everything is ready to go!' + } + }, + sass: { + options: { + message: 'CSS is compiled' + } + }, + javascript: { + options: { + message: 'JavaScript is compiled' + } + }, + svg: { + options: { + message: 'SVG is concatenated' + } + } }; diff --git a/build/grunt/config/phplint.js b/build/grunt/config/phplint.js index d8c4ad1..2465a82 100644 --- a/build/grunt/config/phplint.js +++ b/build/grunt/config/phplint.js @@ -1,12 +1,12 @@ module.exports = { - options: { - swapPath : '/tmp', - phpArgs : { - // add -f for fatal errors - '-lf': null - } - }, - dev: [ - '**/*.php' - ] + options: { + swapPath : '/tmp', + phpArgs : { + // add -f for fatal errors + '-lf': null + } + }, + dev: [ + '**/*.php' + ] }; diff --git a/build/grunt/config/postcss.js b/build/grunt/config/postcss.js index ff195af..d305e29 100644 --- a/build/grunt/config/postcss.js +++ b/build/grunt/config/postcss.js @@ -1,27 +1,27 @@ module.exports = function (grunt, options) { - return { - options: { - map: false, - processors: [ - require('autoprefixer')({ - browsers: [ 'last 2 versions', '> 1%', 'ie >= 9' ] - }), - require('postcss-banner')({ - banner: grunt.template.process('! <%= package.title %> - <%= grunt.template.today("yyyy-mm-dd") %> ', { data: options }) - }) - ] - }, - prod: { - files: [ - { - expand : true, - flatten : true, - cwd : '<%= paths.css.dist %>', - src : [ '**/*.css', '!**/*.min.css' ], - dest : '<%= paths.css.dist %>' - } - ] - } - } + return { + options: { + map: false, + processors: [ + require('autoprefixer')({ + browsers: [ 'last 2 versions', '> 1%', 'ie >= 9' ] + }), + require('postcss-banner')({ + banner: grunt.template.process('! <%= package.title %> - <%= grunt.template.today("yyyy-mm-dd") %> ', { data: options }) + }) + ] + }, + prod: { + files: [ + { + expand : true, + flatten : true, + cwd : '<%= paths.css.dist %>', + src : [ '**/*.css', '!**/*.min.css' ], + dest : '<%= paths.css.dist %>' + } + ] + } + } }; diff --git a/build/grunt/config/sass.js b/build/grunt/config/sass.js index 5423326..67b2137 100644 --- a/build/grunt/config/sass.js +++ b/build/grunt/config/sass.js @@ -1,17 +1,17 @@ module.exports = { - options: { - sourceMap : false, - outputStyle : 'expanded' - }, - prod: { - files: [ - { - expand : true, - cwd : '<%= paths.css.src %>', - src : [ '**/*.scss' ], - dest : '<%= paths.css.dist %>', - ext : '.css' - } - ] - } + options: { + sourceMap : false, + outputStyle : 'expanded' + }, + prod: { + files: [ + { + expand : true, + cwd : '<%= paths.css.src %>', + src : [ '**/*.scss' ], + dest : '<%= paths.css.dist %>', + ext : '.css' + } + ] + } }; diff --git a/build/grunt/config/svg_sprite.js b/build/grunt/config/svg_sprite.js index 0bc2399..92d9d65 100644 --- a/build/grunt/config/svg_sprite.js +++ b/build/grunt/config/svg_sprite.js @@ -1,29 +1,29 @@ module.exports = { - options : { - svg: { - xmlDeclaration : false, - namespaceIDs : true, - doctypeDeclaration : false, + options : { + svg: { + xmlDeclaration : false, + namespaceIDs : true, + doctypeDeclaration : false, cleanupNumericValues : true, removeTitle : true, removeDesc : true - } - }, - prod: { - expand : true, - cwd : '<%= paths.img.src %>', - src : [ '**/*.svg', '!sprite.svg' ], - dest : '<%= paths.img.dist %>', - options : { - mode: { - symbol: { - dest : '.', - sprite : 'sprite.svg', - example : { - dest: '../../../build/sprite.symbol.html' - } - } - } - } - } + } + }, + prod: { + expand : true, + cwd : '<%= paths.img.dist %>', + src : [ '**/*.svg', '!sprite.svg' ], + dest : '<%= paths.img.dist %>', + options : { + mode: { + symbol: { + dest : '.', + sprite : 'sprite.svg', + example : { + dest: '../../../build/sprite.symbol.html' + } + } + } + } + } } diff --git a/build/grunt/config/uglify.js b/build/grunt/config/uglify.js index a5b2c0d..856a3c3 100644 --- a/build/grunt/config/uglify.js +++ b/build/grunt/config/uglify.js @@ -1,13 +1,13 @@ module.exports = { - options: {}, - prod: { - files: [ - { - expand : true, - cwd : '<%= paths.js.dist %>', - src : [ '**/*.js', '!**/*.min.js' ], - dest : '<%= paths.js.dist %>' - } - ] - } + options: {}, + prod: { + files: [ + { + expand : true, + cwd : '<%= paths.js.dist %>', + src : [ '**/*.js', '!**/*.min.js' ], + dest : '<%= paths.js.dist %>' + } + ] + } }; diff --git a/build/grunt/config/watch.js b/build/grunt/config/watch.js index e5a5993..322e275 100644 --- a/build/grunt/config/watch.js +++ b/build/grunt/config/watch.js @@ -1,27 +1,27 @@ module.exports = { - options: { - spawn: false, - livereload: false - }, - javascript_vendors: { - files: [ '<%= paths.js.src %>/vendors/**/*.js', '<%= paths.grunt %>/config/concat.js' ], - tasks: [ 'concat', 'notify:javascript' ] - }, - sass: { - files: [ '<%= paths.css.src %>/**/*.scss' ], - tasks: [ 'sass', 'postcss', 'notify:sass' ] - }, - svg: { - files: [ '<%= paths.img.src %>/**/*.svg' ], - tasks: [ 'svg_sprite', 'notify:svg' ] - }, - tasks: { - options: { - reload: true - }, - files: [ - 'Gruntfile.js', - '<%= paths.grunt %>/**/*' - ] - } + options: { + spawn: false, + livereload: false + }, + javascript_vendors: { + files: [ '<%= paths.js.src %>/vendors/**/*.js', '<%= paths.grunt %>/config/concat.js' ], + tasks: [ 'concat', 'notify:javascript' ] + }, + sass: { + files: [ '<%= paths.css.src %>/**/*.scss' ], + tasks: [ 'sass', 'postcss', 'notify:sass' ] + }, + svg: { + files: [ '<%= paths.img.dist %>/**/*.svg' ], + tasks: [ 'svg_sprite', 'notify:svg' ] + }, + tasks: { + options: { + reload: true + }, + files: [ + 'Gruntfile.js', + '<%= paths.grunt %>/**/*' + ] + } }; diff --git a/package.json b/package.json index bb0c768..ff15277 100644 --- a/package.json +++ b/package.json @@ -1,32 +1,32 @@ { - "private": true, - "name": "@locomotivemtl/boilerplate", - "title": "Locomotive Boilerplate", - "version": "1.0.0", - "author": "Locomotive ", - "devDependencies": { - "autoprefixer": "0.0.0", - "babel-preset-es2015": "0.0.0", - "babel-plugin-transform-es2015-classes": "0.0.0", - "babelify": "0.0.0", - "eslint-tap": "0.0.0", - "glob": "0.0.0", - "grunt": "0.0.0", - "grunt-browser-sync": "0.0.0", - "grunt-browserify": "0.0.0", - "grunt-contrib-concat": "0.0.0", - "grunt-contrib-cssmin": "0.0.0", - "grunt-contrib-uglify": "0.0.0", - "grunt-contrib-watch": "0.0.0", - "grunt-csscomb": "0.0.0", - "grunt-eslint": "0.0.0", - "grunt-notify": "0.0.0", - "grunt-phplint": "0.0.0", - "grunt-postcss": "0.0.0", - "grunt-sass": "0.0.0", - "grunt-svg-sprite": "0.0.0", - "load-grunt-config": "0.0.0", - "postcss-banner": "0.0.0", - "svg4everybody": "0.0.0" - } + "private": true, + "name": "@locomotivemtl/boilerplate", + "title": "Locomotive Boilerplate", + "version": "1.0.0", + "author": "Locomotive ", + "devDependencies": { + "autoprefixer": "0.0.0", + "babel-preset-es2015": "0.0.0", + "babel-plugin-transform-es2015-classes": "0.0.0", + "babelify": "0.0.0", + "eslint-tap": "0.0.0", + "glob": "0.0.0", + "grunt": "0.0.0", + "grunt-browser-sync": "0.0.0", + "grunt-browserify": "0.0.0", + "grunt-contrib-concat": "0.0.0", + "grunt-contrib-cssmin": "0.0.0", + "grunt-contrib-uglify": "0.0.0", + "grunt-contrib-watch": "0.0.0", + "grunt-csscomb": "0.0.0", + "grunt-eslint": "0.0.0", + "grunt-notify": "0.0.0", + "grunt-phplint": "0.0.0", + "grunt-postcss": "0.0.0", + "grunt-sass": "0.0.0", + "grunt-svg-sprite": "0.0.0", + "load-grunt-config": "0.0.0", + "postcss-banner": "0.0.0", + "svg4everybody": "0.0.0" + } } diff --git a/www/assets/emails/index.html b/www/assets/emails/index.html index 5b00096..65af28a 100644 --- a/www/assets/emails/index.html +++ b/www/assets/emails/index.html @@ -1,36 +1,36 @@ - - - Boilerplate - - -
- - - - -
- - - - -
- - - - -
-

Heading 1

-

Heading 2

-

Heading 3

-

Heading 4

-

- After you enter your content, highlight the text you want to style and select the options you set in the style editor in the "styles" drop down box. Want to -

-
-
-
-
- + + + Boilerplate + + +
+ + + + +
+ + + + +
+ + + + +
+

Heading 1

+

Heading 2

+

Heading 3

+

Heading 4

+

+ After you enter your content, highlight the text you want to style and select the options you set in the style editor in the "styles" drop down box. Want to +

+
+
+
+
+ diff --git a/www/assets/scripts/app.js b/www/assets/scripts/app.js index ff7d0e5..3e7d548 100644 --- a/www/assets/scripts/app.js +++ b/www/assets/scripts/app.js @@ -27,39 +27,39 @@ function _classCallCheck(instance, Constructor) { if (!(instance instanceof Cons var App = function () { - function App() { - var _this = this; + function App() { + var _this = this; - _classCallCheck(this, App); + _classCallCheck(this, App); - this.modules = modules; - this.currentModules = []; + this.modules = modules; + this.currentModules = []; - _environment.$document.on('initModules.App', function (event) { - _this.initGlobals(event.firstBlood).deleteModules().initModules(); - }); - } + _environment.$document.on('initModules.App', function (event) { + _this.initGlobals(event.firstBlood).deleteModules().initModules(); + }); + } - /** + /** * Destroy all existing modules * @return {Object} this Allows chaining */ - App.prototype.deleteModules = function deleteModules() { - // Loop modules - var i = this.currentModules.length; + App.prototype.deleteModules = function deleteModules() { + // Loop modules + var i = this.currentModules.length; - // Destroy all modules - while (i--) { - this.currentModules[i].destroy(); - this.currentModules.splice(i); - } + // Destroy all modules + while (i--) { + this.currentModules[i].destroy(); + this.currentModules.splice(i); + } - return this; - }; + return this; + }; - /** + /** * Execute global functions and settings * Allows you to initialize global modules only once if you need * (ex.: when using Barba.js or SmoothState.js) @@ -67,61 +67,61 @@ var App = function () { */ - App.prototype.initGlobals = function initGlobals(firstBlood) { - (0, _globals2.default)(firstBlood); - return this; - }; + App.prototype.initGlobals = function initGlobals(firstBlood) { + (0, _globals2.default)(firstBlood); + return this; + }; - /** + /** * Find modules and initialize them * @return {Object} this Allows chaining */ - App.prototype.initModules = function initModules() { - // Elements with module - var moduleEls = document.querySelectorAll('[data-module]'); + App.prototype.initModules = function initModules() { + // Elements with module + var moduleEls = document.querySelectorAll('[data-module]'); - // Loop through elements - var i = 0; - var elsLen = moduleEls.length; + // Loop through elements + var i = 0; + var elsLen = moduleEls.length; - for (; i < elsLen; i++) { + for (; i < elsLen; i++) { - // Current element - var el = moduleEls[i]; + // Current element + var el = moduleEls[i]; - // All data- attributes considered as options - var options = (0, _html.getNodeData)(el); + // All data- attributes considered as options + var options = (0, _html.getNodeData)(el); - // Add current DOM element and jQuery element - options.el = el; - options.$el = $(el); + // Add current DOM element and jQuery element + options.el = el; + options.$el = $(el); - // Module does exist at this point - var attr = options.module; + // Module does exist at this point + var attr = options.module; - // Splitting modules found in the data-attribute - var moduleIdents = attr.replace(/\s/g, '').split(','); + // Splitting modules found in the data-attribute + var moduleIdents = attr.replace(/\s/g, '').split(','); - // Loop modules - var j = 0; - var modulesLen = moduleIdents.length; + // Loop modules + var j = 0; + var modulesLen = moduleIdents.length; - for (; j < modulesLen; j++) { - var moduleAttr = moduleIdents[j]; + for (; j < modulesLen; j++) { + var moduleAttr = moduleIdents[j]; - if (typeof this.modules[moduleAttr] === 'function') { - var module = new this.modules[moduleAttr](options); - this.currentModules.push(module); - } - } - } + if (typeof this.modules[moduleAttr] === 'function') { + var module = new this.modules[moduleAttr](options); + this.currentModules.push(module); + } + } + } - return this; - }; + return this; + }; - return App; + return App; }(); // IIFE for loading the application @@ -129,11 +129,11 @@ var App = function () { (function () { - window.App = new App(); - _environment.$document.trigger({ - type: 'initModules.App', - firstBlood: true - }); + window.App = new App(); + _environment.$document.trigger({ + type: 'initModules.App', + firstBlood: true + }); })(); },{"./modules":3,"./utils/environment":8,"./utils/globals":9,"./utils/html":10}],2:[function(require,module,exports){ @@ -228,7 +228,7 @@ function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { de 'use strict'; Object.defineProperty(exports, "__esModule", { - value: true + value: true }); var _environment = require('../utils/environment'); @@ -242,14 +242,14 @@ function _classCallCheck(instance, Constructor) { if (!(instance instanceof Cons */ var _class = function _class(options) { - _classCallCheck(this, _class); + _classCallCheck(this, _class); - this.$document = _environment.$document; - this.$window = _environment.$window; - this.$html = _environment.$html; - this.$body = _environment.$body; - this.$el = options.$el; - this.el = options.el; + this.$document = _environment.$document; + this.$window = _environment.$window; + this.$html = _environment.$html; + this.$body = _environment.$body; + this.$el = options.$el; + this.el = options.el; }; exports.default = _class; @@ -258,7 +258,7 @@ exports.default = _class; 'use strict'; Object.defineProperty(exports, "__esModule", { - value: true + value: true }); var _AbstractModule2 = require('./AbstractModule'); @@ -275,24 +275,24 @@ function _inherits(subClass, superClass) { if (typeof superClass !== "function" var _class = function (_AbstractModule) { - _inherits(_class, _AbstractModule); + _inherits(_class, _AbstractModule); - function _class(options) { - _classCallCheck(this, _class); + function _class(options) { + _classCallCheck(this, _class); - var _this = _possibleConstructorReturn(this, _AbstractModule.call(this, options)); + var _this = _possibleConstructorReturn(this, _AbstractModule.call(this, options)); - _this.$el.on('click.Button', function (event) { - _this.$document.trigger('Title.changeLabel', [$(event.currentTarget).val()]); - }); - return _this; - } + _this.$el.on('click.Button', function (event) { + _this.$document.trigger('Title.changeLabel', [$(event.currentTarget).val()]); + }); + return _this; + } - _class.prototype.destroy = function destroy() { - this.$el.off('.Button'); - }; + _class.prototype.destroy = function destroy() { + this.$el.off('.Button'); + }; - return _class; + return _class; }(_AbstractModule3.default); exports.default = _class; @@ -301,7 +301,7 @@ exports.default = _class; 'use strict'; Object.defineProperty(exports, "__esModule", { - value: true + value: true }); var _visibility = require('../utils/visibility'); @@ -320,65 +320,65 @@ function _inherits(subClass, superClass) { if (typeof superClass !== "function" var _class = function (_AbstractModule) { - _inherits(_class, _AbstractModule); + _inherits(_class, _AbstractModule); - function _class(options) { - _classCallCheck(this, _class); + function _class(options) { + _classCallCheck(this, _class); - var _this = _possibleConstructorReturn(this, _AbstractModule.call(this, options)); + var _this = _possibleConstructorReturn(this, _AbstractModule.call(this, options)); - _this.$label = _this.$el.find('.js-label'); + _this.$label = _this.$el.find('.js-label'); - _this.$document.on('Title.changeLabel', function (event, value) { - _this.changeLabel(value); - _this.destroy(); - }); + _this.$document.on('Title.changeLabel', function (event, value) { + _this.changeLabel(value); + _this.destroy(); + }); - _this.hiddenCallbackIdent = (0, _visibility.visibilityApi)({ - action: 'addCallback', - state: 'hidden', - callback: _this.logHidden - }); + _this.hiddenCallbackIdent = (0, _visibility.visibilityApi)({ + action: 'addCallback', + state: 'hidden', + callback: _this.logHidden + }); - _this.visibleCallbackIdent = (0, _visibility.visibilityApi)({ - action: 'addCallback', - state: 'visible', - callback: _this.logVisible - }); - return _this; - } + _this.visibleCallbackIdent = (0, _visibility.visibilityApi)({ + action: 'addCallback', + state: 'visible', + callback: _this.logVisible + }); + return _this; + } - _class.prototype.logHidden = function logHidden() { - console.log('Title is hidden'); - }; + _class.prototype.logHidden = function logHidden() { + console.log('Title is hidden'); + }; - _class.prototype.logVisible = function logVisible() { - console.log('Title is visible'); - }; + _class.prototype.logVisible = function logVisible() { + console.log('Title is visible'); + }; - _class.prototype.changeLabel = function changeLabel(value) { - this.$label.text(value); - }; + _class.prototype.changeLabel = function changeLabel(value) { + this.$label.text(value); + }; - _class.prototype.destroy = function destroy() { - this.$document.off('Title.changeLabel'); + _class.prototype.destroy = function destroy() { + this.$document.off('Title.changeLabel'); - (0, _visibility.visibilityApi)({ - action: 'removeCallback', - state: 'hidden', - ident: this.hiddenCallbackIdent - }); + (0, _visibility.visibilityApi)({ + action: 'removeCallback', + state: 'hidden', + ident: this.hiddenCallbackIdent + }); - (0, _visibility.visibilityApi)({ - action: 'removeCallback', - state: 'visible', - ident: this.visibleCallbackIdent - }); + (0, _visibility.visibilityApi)({ + action: 'removeCallback', + state: 'visible', + ident: this.visibleCallbackIdent + }); - this.$el.off('.Title'); - }; + this.$el.off('.Title'); + }; - return _class; + return _class; }(_AbstractModule3.default); exports.default = _class; @@ -387,7 +387,7 @@ exports.default = _class; 'use strict'; Object.defineProperty(exports, "__esModule", { - value: true + value: true }); exports.addToArray = addToArray; exports.arrayContains = arrayContains; @@ -401,86 +401,86 @@ exports.findByKeyValue = findByKeyValue; var _is = require('./is'); function addToArray(array, value) { - var index = array.indexOf(value); + var index = array.indexOf(value); - if (index === -1) { - array.push(value); - } + if (index === -1) { + array.push(value); + } } function arrayContains(array, value) { - for (var i = 0, c = array.length; i < c; i++) { - if (array[i] == value) { - return true; - } - } + for (var i = 0, c = array.length; i < c; i++) { + if (array[i] == value) { + return true; + } + } - return false; + return false; } function arrayContentsMatch(a, b) { - var i; + var i; - if (!(0, _is.isArray)(a) || !(0, _is.isArray)(b)) { - return false; - } + if (!(0, _is.isArray)(a) || !(0, _is.isArray)(b)) { + return false; + } - if (a.length !== b.length) { - return false; - } + if (a.length !== b.length) { + return false; + } - i = a.length; - while (i--) { - if (a[i] !== b[i]) { - return false; - } - } + i = a.length; + while (i--) { + if (a[i] !== b[i]) { + return false; + } + } - return true; + return true; } function ensureArray(x) { - if (typeof x === 'string') { - return [x]; - } + if (typeof x === 'string') { + return [x]; + } - if (x === undefined) { - return []; - } + if (x === undefined) { + return []; + } - return x; + return x; } function lastItem(array) { - return array[array.length - 1]; + return array[array.length - 1]; } function removeFromArray(array, member) { - if (!array) { - return; - } + if (!array) { + return; + } - var index = array.indexOf(member); + var index = array.indexOf(member); - if (index !== -1) { - array.splice(index, 1); - } + if (index !== -1) { + array.splice(index, 1); + } } function toArray(arrayLike) { - var array = [], - i = arrayLike.length; - while (i--) { - array[i] = arrayLike[i]; - } + var array = [], + i = arrayLike.length; + while (i--) { + array[i] = arrayLike[i]; + } - return array; + return array; } function findByKeyValue(array, key, value) { - return array.filter(function (obj) { - return obj[key] === value; - }); + return array.filter(function (obj) { + return obj[key] === value; + }); } },{"./is":11}],8:[function(require,module,exports){ @@ -503,11 +503,11 @@ exports.$body = $body; "use strict"; Object.defineProperty(exports, "__esModule", { - value: true + value: true }); exports.default = function () { - svg4everybody(); + svg4everybody(); }; },{}],10:[function(require,module,exports){ @@ -580,7 +580,7 @@ function getNodeData(node) { 'use strict'; Object.defineProperty(exports, "__esModule", { - value: true + value: true }); var _typeof = typeof Symbol === "function" && typeof Symbol.iterator === "symbol" ? function (obj) { return typeof obj; } : function (obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol ? "symbol" : typeof obj; }; @@ -596,44 +596,44 @@ var toString = Object.prototype.toString, // thanks, http://perfectionkills.com/instanceof-considered-harmful-or-how-to-write-a-robust-isarray/ function isArray(thing) { - return toString.call(thing) === '[object Array]'; + return toString.call(thing) === '[object Array]'; } function isArrayLike(obj) { - return arrayLikePattern.test(toString.call(obj)); + return arrayLikePattern.test(toString.call(obj)); } function isEqual(a, b) { - if (a === null && b === null) { - return true; - } + if (a === null && b === null) { + return true; + } - if ((typeof a === 'undefined' ? 'undefined' : _typeof(a)) === 'object' || (typeof b === 'undefined' ? 'undefined' : _typeof(b)) === 'object') { - return false; - } + if ((typeof a === 'undefined' ? 'undefined' : _typeof(a)) === 'object' || (typeof b === 'undefined' ? 'undefined' : _typeof(b)) === 'object') { + return false; + } - return a === b; + return a === b; } // http://stackoverflow.com/questions/18082/validate-numbers-in-javascript-isnumeric function isNumeric(thing) { - return !isNaN(parseFloat(thing)) && isFinite(thing); + return !isNaN(parseFloat(thing)) && isFinite(thing); } function isObject(thing) { - return thing && toString.call(thing) === '[object Object]'; + return thing && toString.call(thing) === '[object Object]'; } function isFunction(thing) { - var getType = {}; - return thing && getType.toString.call(thing) === '[object Function]'; + var getType = {}; + return thing && getType.toString.call(thing) === '[object Function]'; } },{}],12:[function(require,module,exports){ 'use strict'; Object.defineProperty(exports, "__esModule", { - value: true + value: true }); exports.visibilityApi = undefined; @@ -644,8 +644,8 @@ var _array = require('./array'); var _environment = require('./environment'); var CALLBACKS = { - hidden: [], - visible: [] + hidden: [], + visible: [] }; /* jshint esnext: true */ @@ -659,11 +659,11 @@ var UUID = 0; // Main event _environment.$document.on('visibilitychange', function (event) { - if (document.hidden) { - onDocumentChange('hidden'); - } else { - onDocumentChange('visible'); - } + if (document.hidden) { + onDocumentChange('hidden'); + } else { + onDocumentChange('visible'); + } }); /** @@ -673,21 +673,21 @@ _environment.$document.on('visibilitychange', function (event) { * @return {string} ident */ function addCallback(state, options) { - var callback = options.callback || ''; + var callback = options.callback || ''; - if (!(0, _is.isFunction)(callback)) { - console.warn('Callback is not a function'); - return false; - } + if (!(0, _is.isFunction)(callback)) { + console.warn('Callback is not a function'); + return false; + } - var ident = PREFIX + UUID++; + var ident = PREFIX + UUID++; - CALLBACKS[state].push({ - ident: ident, - callback: callback - }); + CALLBACKS[state].push({ + ident: ident, + callback: callback + }); - return ident; + return ident; } /** @@ -697,25 +697,25 @@ function addCallback(state, options) { * @return {boolean} If operation was a success */ function removeCallback(state, options) { - var ident = options.ident || ''; + var ident = options.ident || ''; - if (typeof ident === 'undefined' || ident === '') { - console.warn('Need ident to remove callback'); - return false; - } + if (typeof ident === 'undefined' || ident === '') { + console.warn('Need ident to remove callback'); + return false; + } - var index = (0, _array.findByKeyValue)(CALLBACKS[state], 'ident', ident)[0]; + var index = (0, _array.findByKeyValue)(CALLBACKS[state], 'ident', ident)[0]; - // console.log(ident) - // console.log(CALLBACKS[state]) + // console.log(ident) + // console.log(CALLBACKS[state]) - if (typeof index !== 'undefined') { - (0, _array.removeFromArray)(CALLBACKS[state], index); - return true; - } else { - console.warn('Callback could not be found'); - return false; - } + if (typeof index !== 'undefined') { + (0, _array.removeFromArray)(CALLBACKS[state], index); + return true; + } else { + console.warn('Callback could not be found'); + return false; + } } /** @@ -723,13 +723,13 @@ function removeCallback(state, options) { * @param {string} state Visible or hidden */ function onDocumentChange(state) { - var callbackArray = CALLBACKS[state]; - var i = 0; - var len = callbackArray.length; + var callbackArray = CALLBACKS[state]; + var i = 0; + var len = callbackArray.length; - for (; i < len; i++) { - callbackArray[i].callback(); - } + for (; i < len; i++) { + callbackArray[i].callback(); + } } /** @@ -738,28 +738,28 @@ function onDocumentChange(state) { * @return {boolean|integer} Unique identifier for the callback or boolean indicating success or failure */ function visibilityApi(options) { - var action = options.action || ''; - var state = options.state || ''; - var ret = void 0; + var action = options.action || ''; + var state = options.state || ''; + var ret = void 0; - // Type and value checking - if (!(0, _array.arrayContains)(ACTIONS, action)) { - console.warn('Action does not exist'); - return false; - } - if (!(0, _array.arrayContains)(STATES, state)) { - console.warn('State does not exist'); - return false; - } + // Type and value checking + if (!(0, _array.arrayContains)(ACTIONS, action)) { + console.warn('Action does not exist'); + return false; + } + if (!(0, _array.arrayContains)(STATES, state)) { + console.warn('State does not exist'); + return false; + } - // @todo Magic call function pls - if (action === 'addCallback') { - ret = addCallback(state, options); - } else if (action === 'removeCallback') { - ret = removeCallback(state, options); - } + // @todo Magic call function pls + if (action === 'addCallback') { + ret = addCallback(state, options); + } else if (action === 'removeCallback') { + ret = removeCallback(state, options); + } - return ret; + return ret; } exports.visibilityApi = visibilityApi; diff --git a/www/index.html b/www/index.html index cc30c8d..7e90f69 100644 --- a/www/index.html +++ b/www/index.html @@ -1,30 +1,29 @@ - - - - - - - Boilerplate + + + + + + + Boilerplate - - + + - - - + + + +
+

Locomotive's Boilerplate

+
-
-

Locomotive boilerplate

-
+ - - - - - - - + + + + +