postcss-zindex-order/index.js

A PostCSS plugin that helps order your z-index values.

var postcss = require('postcss');
var _ = require('underscore');

// Where all the z-index layers will reside.
var zLayers = {};

module.exports = postcss.plugin('zindex-order', function (options) {
    return function (css) {
        options = options || {};

        // zLayersValues is what the user will use in a gulp file to set the options
        zLayers = _.extend(zLayers, options.zLayerValues);

        css.walkRules(function (rule) {
            rule.walkDecls(function (decl, i) {
                var value = decl.value;

                if (value.indexOf( 'zOrder(' ) !== -1) {

                    var zlayer_requested = value.match(/\(([^)]+)\)/)[1].replace(/["']/g, "");

                    var zlayer = zLayers[zlayer_requested];

                    decl.value = zlayer;
                }
            });
        });
    };
});