A custom System.js plugin to load in post css. Usage: `import 'somestyles.css!mypostcss';`

mypostcss.js

// Based off of geelen's gists: https://github.com/systemjs/plugin-css/issues/22#issuecomment-89491851

import postcss from 'postcss';

import inlineComments from 'postcss-inline-comment';
import mixins from 'postcss-mixins';
import nestedcss from 'postcss-nested';
import cssvariables from 'postcss-css-variables';
//import autoprefixer from 'autoprefixer-core';

import cursorHandMixin from './custom-postcss-mixins/cursor-hand';
import toggleCheckboxEnclosedMixin from './custom-postcss-mixins/toggle-checkbox-enclosed';

let processors = [
	inlineComments(),
	mixins({
		mixins: {
			'cursor-hand': cursorHandMixin,
			'toggle-checkbox-enclosed': toggleCheckboxEnclosedMixin
		}
	}),
	nestedcss,
	cssvariables(),
	//autoprefixer({browsers: ['last 10 versions']})
];

let myProcessor = postcss(processors);


function escape(source) {
	return source
		.replace(/(["\\])/g, '\\$1')
		.replace(/[\f]/g, "\\f")
		.replace(/[\b]/g, "\\b")
		.replace(/[\n]/g, "\\n")
		.replace(/[\t]/g, "\\t")
		.replace(/[\r]/g, "\\r")
		.replace(/[\u2028]/g, "\\u2028")
		.replace(/[\u2029]/g, "\\u2029");
}


export default {
	translate: function(load) {
		return new Promise(function(resolve, reject) {
			//console.log(load.source);
			myProcessor.process(load.source).then(function(result) {
				console.log('Success');

				let runInBrowser = `
					(function(css) {
					var blob = new Blob([css], {type: 'text/css'}),
					url = URL.createObjectURL(blob),
					elem = document.createElement('link'),
					head = document.getElementsByTagName('head')[0];
					elem.setAttribute('href', url)
					elem.setAttribute('rel', 'stylesheet')
					head.appendChild(elem)
					})("${escape(result.css)}");
				`;

				resolve(runInBrowser);
			}).catch(function(e) {
				reject('Error processing PostCSS:', e);
			});

			
		});
	}
};