Open Data Coder p3t3r67x0

##Find/Replace tag attributes

###everything between <a >

<div/?[a\s]*[^>]*>

###everything between

href="/?[a\s]*[^>]*?"

An ongoing project to catalogue all of these sneaky, hidden, bleeding edge selectors as I prepare my JSConf EU 2012 talk.

Everything is broken up by tag, but within each the selectors aren't particularly ordered.

I have not tested/verified all of these. Have I missed some or got it wrong? Let me know. - A

A friendly reminder that you may need to set this property on your target/selected element to get the styling results you want:

-webkit-appearance:none;

Intro

http://socialdriver.com/2012/07/20-best-responsive-websites/ lists 20 sites that are supposedly best-in-class when it comes to responsive design techniques. I had a look at the viewport meta tags used in these sites.

All sites use width=device-width, with in most cases an additional initial-scale=1. This is good practice.

However:

8 sites turn off pinch-zooming by setting maximum-scale to 1, or using user-scalable=no. While there are some corner use cases for this, it does not make sense to do this on text-heavy sites as it impairs accessibility.
3 sites use semi-colons as delimiters between viewport values. While this works in newer mobile browsers, it's not officially supported, and breaks in older mobile browser versions.
1 site has 2 viewport meta tags (with different values) in the source...

	// This mixin outputs a property with rem units and a px fallback.
	// Values passed without units are used as multipliers for the final
	// rem and px values, all other units are output without modification.
	// $base-font-size represents the root value of the document font-size
	// in pixels.
	//
	// i.e. html { font-size: 100%;} // -> 16px

	// Usage:
	// @include px-and-rem([property], [multiplier \| explicit value] [, ...]);

	@mixin translate3d($x, $y, $z) {
	-webkit-transform: translate3d($x, $y, $z);
	-moz-transform: translate3d($x, $y, $z);
	-o-transform: translate3d($x, $y, $z);
	transform: translate3d($x, $y, $z);
	}

	@mixin border-radius($radius...) {
	// defining prefixes so we can use them in mixins below
	$prefixes: ("-webkit", "-moz", "-ms", "-o", "");
	@each $prefix in $prefixes {
	#{$prefix}-border-radius: $radius;
	}

	border-radius: $radius;
	}

	/* ---------------------------------------------------------- */
	/* */
	/* A media query that captures: */
	/* */
	/* - Retina iOS devices */
	/* - Retina Macs running Safari */
	/* - High DPI Windows PCs running IE 8 and above */
	/* - Low DPI Windows PCs running IE, zoomed in */
	/* - Low DPI Windows PCs and Macs running Firefox, zoomed in */
	/* - Android hdpi devices and above */

	<!doctype html>
	<head>
	<meta charset=utf-8>
	<title>3D spin</title>
	<style>
	/*
	* nb: -webkit only for brevity. tested in chrome 21
	*/
	body {
	-webkit-perspective: 800px;

	@charset "UTF-8";

	@mixin grab-cursor {
	// http://www.google.com/intl/en_ALL/mapfiles/openhand.cur
	cursor: url('data:image/vnd.microsoft.icon;base64,AAACAAEAICACAAcABQAwAQAAFgAAACgAAAAgAAAAQAAAAAEAAQAAAAAAAAEAAAAAAAAAAAAAAgAAAAAAAAAAAAAA////AAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAD8AAAA/AAAAfwAAAP+AAAH/gAAB/8AAA//AAAd/wAAGf+AAAH9gAADbYAAA2yAAAZsAAAGbAAAAGAAAAAAAAA//////////////////////////////////////////////////////////////////////////////////////gH///4B///8Af//+AD///AA///wAH//4AB//8AAf//AAD//5AA///gAP//4AD//8AF///AB///5A////5///8='), all-scroll;
	// cursor: -webkit-grab;
	cursor: -moz-grab;
	cursor: -o-grab;
	cursor: -ms-grab;
	cursor: grab;

	#!/bin/bash
	# A simple script to backup an organization's GitHub repositories.

	#-------------------------------------------------------------------------------
	# NOTES:
	#-------------------------------------------------------------------------------
	# * User @jimklimov (and probably some others called out in the long comment
	# thread below) have modified this script to make it more robust and keep
	# up with various changes in the GitHub API and response format at:
	# https://github.com/jimklimov/github-scripts