Chris Talkington ctalkington

Responsive layouts in stylus

There is no span1..15 styles, instead your css defines your layout and your html remains semantic and not polluted with display information. As it should be.
The markup is incredibly easy, you specify the wrappers width, and then each columns width in percentages. Every other grid framework I've found is incredibly complicated with this.
It allows you to have the exact same markup, and completely different styles for different devices, resolutions, stylesheets, whatever. As it should be.

Update: please note that I have since switched to using a set of bash scripts instead of poluting the Git repository with git svn.

	<?php

	/**
	* Toggle the formatting of unix permissions between:
	* - 0644 OR 755
	* - -rw-r--r--
	*
	* @param string\|int $permissions : The permissions string or int that needs to be formatted.
	* @param string $is_dir : if true, the first char of the long permissions format will be 'd'. ie: drw-r--r--
	* @return string: The formatted permissions.

	#!/bin/sh
	# ------------------------------------------------------------------------------
	# SOME INFOS : fairly standard (debian) init script.
	# Note that node doesn't create a PID file (hence --make-pidfile)
	# has to be run in the background (hence --background)
	# and NOT as root (hence --chuid)
	#
	# MORE INFOS : INIT SCRIPT http://www.debian.org/doc/debian-policy/ch-opersys.html#s-sysvinit
	# INIT-INFO RULES http://wiki.debian.org/LSBInitScripts
	# INSTALL/REMOVE http://www.debian-administration.org/articles/28

	<!-- Solution brought to you by Caroline Schnapp -->
	<!-- See this: https://docs.shopify.com/support/your-store/products/can-i-recommend-related-products#finding-a-relevant-collecitons -->

	{% comment %}
	Number of related items per row,
	and number of rows.
	{% endcomment %}

	{% assign number_of_related_products_per_row = 4 %}
	{% assign number_of_rows = 1 %}

	<!DOCTYPE html>
	<html>
	<head>
	<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
	<script src="jquery.ketchup.all.min.js" type="text/javascript"></script>
	</head>
	<body>
	<div id="email">
	<span>Enter your email to sign up</span>
	<form action="/subscribe.php" id="invite" method="POST">

	// Add a getElementsByClassName function if the browser doesn't have one
	// Limitation: only works with one class name
	// Copyright: Eike Send http://eike.se/nd
	// License: MIT License

	if (!document.getElementsByClassName) {
	document.getElementsByClassName = function(search) {
	var d = document, elements, pattern, i, results = [];
	if (d.querySelectorAll) { // IE8
	return d.querySelectorAll("." + search);

	img.grayscale.disabled {
	filter: url("data:image/svg+xml;utf8,<svg xmlns=\'http://www.w3.org/2000/svg\'><filter id=\'grayscale\'><feColorMatrix type=\'matrix\' values=\'1 0 0 0 0, 0 1 0 0 0, 0 0 1 0 0, 0 0 0 1 0\'/></filter></svg>#grayscale");
	-webkit-filter: grayscale(0%);
	}

	/**
	* Outputs a new function with interpolated object property values.
	* Use like so:
	* var fn = makeInterpolator('some/url/{param1}/{param2}');
	* fn({ param1: 123, param2: 456 }); // => 'some/url/123/456'
	*/
	var makeInterpolator = (function() {
	var rc = {
	'\n': '\\n', '\"': '\\\"',
	'\u2028': '\\u2028', '\u2029': '\\u2029'

	<?php

	/**
	* Google Analytics tracking code per language (WPML)
	*
	* @param array $options
	* @see http://plugins.trac.wordpress.org/browser/google-analytics-for-wordpress/tags/4.3.3/frontend/class-frontend.php#L12
	*/
	function prefix_ga_init( $options ) {
	global $yoast_ga;