dirtystylus

module.exports = (image, caption, className) => {
  const classMarkup = className ? ` class="${className}"` : '';
  const captionMarkup = caption ? `<figcaption>${caption}</figcaption>` : '';
  return `<figure${classMarkup}><img src="/img/${image}" />${captionMarkup}</figure>`;
  // the line below does all this in one line, but is more confusing:
  // return `<figure${className ? ` class="${className}"` : ''}><img src="/img/${image}" />${caption ? `<figcaption>${caption}</figcaption>` : ''}</figure>`;
};

spences10

Useful Git commands

This is just stuff that I have put down that I find I use a lot of the time for my own reference.

Latest changes from repo to your machine

$ git pull

satya164

@mixin quantity-query($selector, $type, $amount, $max: null) {
    @if $type == at-least {
        #{$selector}:nth-last-child(n+#{$amount}),
        #{$selector}:nth-last-child(n+#{$amount}) ~ #{$selector} { @content; }
    } @else if $type == at-most {
        #{$selector}:nth-last-child(-n+#{$amount}):first-child,
        #{$selector}:nth-last-child(-n+#{$amount}):first-child ~ #{$selector} { @content; }
    } @else if $type == between {
        @if type-of($max) != "number" {
            @error "Max value must be a number for quantity-query.";

corysimmons

<?php

/**
 * Plugin Name: Gulp Sitemap Generator
 * Plugin URI: https://gladdy.uk/blog/2014/04/13/using-uncss-and-grunt-uncss-with-wordpress/
 * Description: Generate a JSON list of every page on a site so it can be used with Gulp and uncss.
 * Author: Liam Gladdy
 * Author URI: http://gladdy.co.uk
 * Version: 1.0
 */

pburtchaell

/**
 * VH and VW units can cause issues on iOS devices: http://caniuse.com/#feat=viewport-units
 * 
 * To overcome this, create media queries that target the width, height, and orientation of iOS devices. 
 * It isn't optimal, but there is really no other way to solve the problem. In this example, I am fixing 
 * the height of element `.foo` —which is a full width and height cover image.
 *
 * iOS Resolution Quick Reference: http://www.iosres.com/
 */
 

jacobdubail

@mixin center-align($dir: false) {
	$map: (
		top:  ( Y ),
		left: ( X )
	);

	@if map_get($map, $dir) != null {
		#{$dir}: 50%;
		transform: #{"translate#{map_get($map,$dir)}(-50%)"};
	} @else {

samuelhorn

/*******************************************************************************
1. DEPENDENCIES
*******************************************************************************/

var gulp = require('gulp');                             // gulp core
    sass = require('gulp-sass'),                        // sass compiler
    uglify = require('gulp-uglify'),                    // uglifies the js
    jshint = require('gulp-jshint'),                    // check if js is ok
    rename = require("gulp-rename");                    // rename files
    concat = require('gulp-concat'),                    // concatinate js

bcherny

<!--
	favicons (see http://www.jonathantneal.com/blog/understand-the-favicon)
	---
	
	icon				format		dimensions	documentation
	----				------		----------	-------------
	apple-touch-icon		PNG		152x152		https://developer.apple.com/library/ios/documentation/UserExperience/Conceptual/MobileHIG/IconMatrix.html#//apple_ref/doc/uid/TP40006556-CH27-SW1
	icon				PNG		96x96
	shortcut icon			ICO		32x32
	msapplication-TileImage		PNG		144x144