first commit

.editorconfig

@@ -0,0 +1,12 @@
+root = true
+
+[*]
+indent_style = space
+indent_size = 4
+end_of_line = lf
+charset = utf-8
+trim_trailing_whitespace = true
+insert_final_newline = true
+
+[*.{json,yml}]
+indent_size = 2

.gitignore

@@ -0,0 +1,2 @@
+node_modules/
+npm-debug.log

.npmignore

@@ -0,0 +1,7 @@
+.gitignore
+
+node_modules/
+npm-debug.log
+
+test.js
+.travis.yml

.travis.yml

@@ -0,0 +1,5 @@
+language: node_js
+node_js:
+  - "5"
+  - "4"
+  - "0.12"

CHANGELOG.md

@@ -0,0 +1,5 @@
+# Change Log
+
+# v0.1.0
+
+- Initial release

LICENSE

@@ -0,0 +1,20 @@
+The MIT License (MIT)
+
+Copyright 2016 Ismael Martinez <ismael@isma.uy>
+
+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
+the Software without restriction, including without limitation the rights to
+use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of
+the Software, and to permit persons to whom the Software is furnished to do so,
+subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS
+FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR
+COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER
+IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN
+CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.

README.md

@@ -0,0 +1,95 @@
+# PostCSS Utility Library [![Build Status][ci-img]][ci]
+
+[PostCSS] plugin a collection of mixins, shortcuts, helpers and tools for your CSS.
+
+<p align="center">
+    <a href="http://ismamz.github.io/postcss-utilities">
+        <img src="media/logo.svg" alt="PostCSS Utility Library">
+    </a>
+</p>
+
+[PostCSS]: https://github.com/postcss/postcss
+[ci-img]:  https://travis-ci.org/ismamz/postcss-utilities.svg
+[ci]:      https://travis-ci.org/ismamz/postcss-utilities
+
+[postcss-utilities](http://github.io/ismamz/postcss-utilities) is a [PostCSS] plugin that have the most used mixins, shortcuts and helpers to use as native `@util` rules in yours stylesheets.
+
+
+### What is the difference with preprocessor’s mixins libraries?
+
+- You don’t need extra files for mixins.
+- You don’t need mixins for vendor prefixes (use [autoprefixer plugin](https://github.com/postcss/autoprefixer) for that)
+- You can use LESS, SASS, pure CSS or whatever you want.
+
+### [See Documentation](http://ismamz.github.io/postcss-utilities)
+
+## Example
+
+### Input
+```css
+.truncate {
+    @util truncate;
+    width: 500px;
+}
+
+.cfx {
+    @util clearfix;
+}
+
+.box-16-9 {
+    background-color: #ccc;
+    margin-bottom: 20px;
+    @util aspect-ratio(16:9);
+}
+
+.circle {
+    @util circle(200px, red);
+}
+```
+
+### Output
+```css
+.truncate {
+    width: 500px;
+    white-space: nowrap;
+    overflow: hidden;
+    text-overflow: ellipsis;
+}
+
+.cfx:after {
+    content: '';
+    display: block;
+    clear: both;
+}
+
+.box-16-9 {
+    background-color: #ccc;
+    margin-bottom: 20px;
+    position: relative;
+    display: block;
+    height: 0;
+    padding: 0;
+    overflow: hidden;
+    padding-bottom: 56.25%;
+}
+
+.circle {
+    border-radius: 50%;
+    width: 200px;
+    height: 200px;
+    background-color: red;
+}
+```
+
+## Usage
+
+```js
+postcss([ require('postcss-utilities') ])
+```
+
+See [PostCSS] docs for examples for your environment.
+
+## Contributors
+
+- [Andrey Sitnik](https://github.com/ai)
+- [Marcus Tisäter](https://github.com/marcustisater)

index.js

@@ -0,0 +1,115 @@
+var postcss = require('postcss');
+var parser  = require('postcss-value-parser');
+
+// import functions
+var aspectRatio =       require('./lib/aspect-ratio');
+var circle =            require('./lib/circle');
+var clearfix =          require('./lib/clearfix');
+var hdBreakpoint =      require('./lib/hd-breakpoint');
+var hideVisually =      require('./lib/hide-visually');
+var horizontalRule =    require('./lib/horizontal-rule');
+var hover =             require('./lib/hover');
+var noJs =              require('./lib/no-js');
+var resetList =         require('./lib/reset-list');
+var textHide =          require('./lib/text-hide');
+var triangle =          require('./lib/triangle');
+var truncate =          require('./lib/truncate');
+var truncateMultiline = require('./lib/truncate-multiline');
+
+// list of utilities names
+var names = [
+    'aspect-ratio',
+    'circle',
+    'clearfix',
+    'hd',
+    'hide-visually',
+    'horizontal-rule',
+    'hover',
+    'no-js',
+    'hr',
+    'reset-list',
+    'text-hide',
+    'triangle',
+    'truncate'
+];
+
+// main plugin
+module.exports = postcss.plugin('postcss-utilities', function (opts) {
+    opts = opts || {};
+
+    return function (css, result) {
+        css.walkAtRules('util', function (util) {
+            // get name
+            var name = util.params.split(/\(/, 1)[0].trim();
+
+            // check if the utility is available
+            if (names.indexOf(name) <= -1) {
+                throw util.error('Unknown utility ' + name);
+            }
+
+            // save the params in a args array
+            var args = [];
+            args.push(name); // name as first argument
+            var str = parser(util.params);
+            str.nodes.forEach(function (node) {
+                if (node.type === 'function') {
+                    node.nodes.forEach(function (i) {
+                        if (i.type === 'word') {
+                            args.push(i.value);
+                        }
+                    });
+                }
+            });
+
+            // case by case
+            switch (name) {
+            case 'truncate':
+                if (args.length > 1) {
+                    truncateMultiline(util, args);
+                } else {
+                    truncate(util, args);
+                }
+                break;
+            case 'hide-visually':
+                hideVisually(util, args);
+                break;
+            case 'clearfix':
+                clearfix(util, args);
+                break;
+            case 'text-hide':
+                textHide(util);
+                break;
+            case 'aspect-ratio':
+                if (args.length > 3) {
+                    result.warn('Too many arguments for aspect-ratio utility.');
+                }
+                aspectRatio(util, args);
+                break;
+            case 'hr':
+                horizontalRule(util, args);
+                break;
+            case 'circle':
+                circle(util, args);
+                break;
+            case 'triangle':
+                triangle(util, args);
+                break;
+            case 'reset-list':
+                resetList(util, args);
+                break;
+            case 'hover':
+                hover(util, args);
+                break;
+            case 'no-js':
+                noJs(util, args);
+                break;
+            case 'hd':
+                hdBreakpoint(util, args, postcss);
+                break;
+            default:
+                break;
+            }
+        });
+
+    };
+});

lib/aspect-ratio.js

@@ -0,0 +1,37 @@
+/**
+ * Aspect Ratio
+ */
+module.exports = function (decl, args) {
+    var parentDecl = decl.parent;
+
+    var width = args[1];
+    var height = args[2];
+
+    parentDecl.append({
+        prop: 'position',
+        value: 'relative',
+        source: decl.source
+    }, {
+        prop: 'display',
+        value: 'block',
+        source: decl.source
+    }, {
+        prop: 'height',
+        value: 0,
+        source: decl.source
+    }, {
+        prop: 'padding',
+        value: 0,
+        source: decl.source
+    }, {
+        prop: 'overflow',
+        value: 'hidden',
+        source: decl.source
+    }, {
+        prop: 'padding-bottom',
+        value: height / width * 100 + '%',
+        source: decl.source
+    });
+
+    decl.remove();
+};

lib/circle.js

@@ -0,0 +1,36 @@
+/**
+ * Circle
+ */
+module.exports = function (decl, args) {
+    var parentDecl = decl.parent;
+
+    var color = '#000';
+    var size = '100px';
+
+    if (args[2]) {
+        color = args[2];
+    }
+    if (args[1]) {
+        size = args[1];
+    }
+
+    parentDecl.append({
+        prop: 'border-radius',
+        value: '50%',
+        source: decl.source
+    }, {
+        prop: 'width',
+        value: size,
+        source: decl.source
+    }, {
+        prop: 'height',
+        value: size,
+        source: decl.source
+    }, {
+        prop: 'background-color',
+        value: color,
+        source: decl.source
+    });
+
+    decl.remove();
+};

lib/clearfix.js

@@ -0,0 +1,36 @@
+/**
+ * Clear Fix
+ */
+module.exports = function (decl, args) {
+    var parentDecl = decl.parent,
+        ruleSelectors = parentDecl.selectors,
+        newRule;
+
+    ruleSelectors = ruleSelectors.map(function (ruleSelector) {
+        return ruleSelector + ':after';
+    }).join(',\n');
+
+    newRule = parentDecl.cloneBefore({
+        selector: ruleSelectors
+    }).removeAll();
+
+    newRule.append({
+        prop: 'content',
+        value: '\'\'',
+        source: decl.source
+    }, {
+        prop: 'display',
+        value: 'block',
+        source: decl.source
+    }, {
+        prop: 'clear',
+        value: 'both',
+        source: decl.source
+    });
+
+    if (decl.prev() === undefined && decl.next() === undefined) {
+        parentDecl.remove();
+    } else {
+        decl.remove();
+    }
+};