Aurélien Delogu pyrsmk

Styling native elements

Native HTML controls are a challenge to style. You can style any element in the web platform that uses Shadow DOM with a pseudo element ::pseudo-element or the /deep/ path selector.

video::webkit-media-controls-timeline {
  background-color: lime;
}

video /deep/ input[type=range] {

YARD CHEATSHEET http://yardoc.org

May 2020 - updated fork: https://gist.github.com/phansch/db18a595d2f5f1ef16646af72fe1fb0e

cribbed from http://pastebin.com/xgzeAmBn

Templates to remind you of the options and formatting for the different types of objects you might want to document using YARD.

Modules

Sass/Less Comparison

In this document I am using Sass's SCSS syntax. You can choose to use the indented syntax in sass, if you prefer it, it has no functional differences from the SCSS syntax.

For less, I'm using the ruby version because this is what they suggest on the website. The javascript version may be different.

	// XPath CheatSheet
	// To test XPath in your Chrome Debugger: $x('/html/body')
	// http://www.jittuu.com/2012/2/14/Testing-XPath-In-Chrome/


	// 0. XPath Examples.
	// More: http://xpath.alephzarro.com/content/cheatsheet.html


	'//hr[@class="edge" and position()=1]' // every first hr of 'edge' class

	#!/bin/bash

	# https://gist.github.com/robwierzbowski/5430952/
	# Create and push to a new github repo from the command line.
	# Grabs sensible defaults from the containing folder and `.gitconfig`.
	# Refinements welcome.

	# Gather constant vars
	CURRENTDIR=${PWD##*/}
	GITHUBUSER=$(git config github.user)

	-- show running queries (pre 9.2)
	SELECT procpid, age(clock_timestamp(), query_start), usename, current_query
	FROM pg_stat_activity
	WHERE current_query != '<IDLE>' AND current_query NOT ILIKE '%pg_stat_activity%'
	ORDER BY query_start desc;

	-- show running queries (9.2)
	SELECT pid, age(clock_timestamp(), query_start), usename, query
	FROM pg_stat_activity
	WHERE query != '<IDLE>' AND query NOT ILIKE '%pg_stat_activity%'

	#!/usr/bin/env bash

	uninstall() {
	list=`gem list --no-versions`
	for gem in $list; do
	gem uninstall $gem -aIx
	done
	gem list
	gem install bundler
	}

	(function(){
	/*

	flex-image: javascript for image replacement based on screen size
	by John Weir http://famedriver.com

	Usage, where `*` will be replaced by the image size.
	<img data-src='/path-to-image/image-*.jpg' data-sizes='320:480,481:960' class='flex-image'/>

	Thanks to Aurélien Delogu & Molt for the inspiration -> https://github.com/pyrsmk/molt

	// http://paulirish.com/2011/requestanimationframe-for-smart-animating/
	// http://my.opera.com/emoller/blog/2011/12/20/requestanimationframe-for-smart-er-animating

	// requestAnimationFrame polyfill by Erik Möller. fixes from Paul Irish and Tino Zijdel

	// MIT license

	(function() {
	var lastTime = 0;
	var vendors = ['ms', 'moz', 'webkit', 'o'];