XOP

(function (global) {
  var metaViewport = document.querySelector('meta[name="viewport"]');
  var metaViewportStr = metaViewport && metaViewport.outerHTML || '';
  var metaCharset = document.querySelector('meta[charset]');
  var metaCharsetStr = metaCharset && metaCharset.outerHTML || '';
  var queryCache = {};

  /**
   * Get the styling nodes to inject in the head of the embedded document
   *

XOP

function getDataUri(url, callback) {
    var image = new Image();

    image.onload = function () {
        var canvas = document.createElement('canvas');
        canvas.width = this.naturalWidth; // or 'width' if you want a special/scaled size
        canvas.height = this.naturalHeight; // or 'height' if you want a special/scaled size

        canvas.getContext('2d').drawImage(this, 0, 0);

XOP

function getArgs(func) {
  // First match everything inside the function argument parens.
  var args = func.toString().match(/function\s.*?\(([^)]*)\)/)[1];
 
  // Split the arguments string into an array comma delimited.
  return args.split(',').map(function(arg) {
    // Ensure no inline comments are parsed and trim the whitespace.
    return arg.replace(/\/\*.*\*\//, '').trim();
  }).filter(function(arg) {
    // Ensure no undefined values are added.

XOP

.feed{
	-webkit-animation-duration: 1s;
	-webkit-animation-fill-mode: forwards;
	-webkit-animation-iteration-count: infinite;
	-webkit-animation-name: placeHolderShimmer;
	-webkit-animation-timing-function: linear;
	background: #f6f7f8;
	background-image: -webkit-linear-gradient(left, #f6f7f8 0%, #edeef1 20%, #f6f7f8 40%, #f6f7f8 100%);
	background-image: linear-gradient(left, #f6f7f8 0%, #edeef1 20%, #f6f7f8 40%, #f6f7f8 100%);
	background-repeat: no-repeat;

XOP

//
// function
function iteratePaths(stream, start, finish, paths) {
    paths.forEach(function (path) {
        stream.pipe(gulp.dest(start + path + finish));
    });
    return stream;
}

//

XOP

/**
 * App 
 */

//
// only relevant code!
//
var $ = require('zepto');

//

XOP

/**
 * From
 * http://davidwalsh.name/document-readystate
 */

// The basic check
if(document.readyState === 'complete') {
    // good to go!
}

XOP

(function(undefined, body, selectors){

    var collection = [];
    var current;

    for(var key in selectors){
        current = body.querySelectorAll(selectors[key]);
        current = [].slice.call(current);
        current = current.map(function(i){ return i[key] });

XOP

//
// render in separate layer
// hack to balance CPU/GPU load
// usage gpuRender(chrome, mac-chrome)
gpuRender($browsers){
    $i = 0;
    $comma = ",";
    $rule = "";

    for $b in arguments {

XOP

//
// SCSS for convenience


//
// self sibling
// usage: basically margins and other layout specifics
.element + .element {

}