joseph-turner’s gists

joseph-turner / clearfix.scss

Last active December 16, 2015 03:59 — forked from Usse/clearfix.scss

	// Clearfix (add or extend this class on elements containing floated elements)
	.cf {
	zoom: 1;
	&:before,
	&:after {
	content: '';
	display: table;
	}
	&:after {
	clear: both;

joseph-turner / quotes.scss

Last active December 16, 2015 04:09

[CSS Tricks](http://css-tricks.com/almanac/properties/q/quotes/)

	q {
	quotes: "“" "”" "‘" "’";

	&:before {
	content: open-quote;
	}

	&:after {
	content: close-quote;
	}

joseph-turner / multi-border.scss

Last active December 16, 2015 04:09

	// Mixin for multiple borders
	$default-inner-border-width: 5px !default;
	$default-inner-border-color: red !default;
	$default-middle-border-width: 5px !default;
	$default-middle-border-color: green !default;
	$default-outer-border-width: 5px !default;
	$default-outer-border-color: blue !default;
	@mixin multi-border(
	$inner-border-width: $default-inner-border-width,
	$inner-border-color: $default-inner-border-color,

joseph-turner / google-cdn.jquery.html

Created April 15, 2013 16:48

Loading jQuery from google with local fallback.

	<script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
	<script>window.jQuery \|\| document.write('<script src="js/vendor/jquery-1.9.1.min.js"><\/script>')</script>

joseph-turner / analytics.js

Created April 15, 2013 16:58

New analytics.js snippet. More detailed control at: https://developers.google.com/analytics/devguides/collection/analyticsjs/

	<!-- Google Analytics -->
	<script>
	(function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]\|\|function(){
	(i[r].q=i[r].q\|\|[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
	m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
	})(window,document,'script','//www.google-analytics.com/analytics.js','ga');

	ga('create', 'UA-XXXX-Y');
	ga('send', 'pageview');

joseph-turner / index.html

Created May 15, 2013 20:25

A CodePen by Joseph Turner.


	<body>
	<div class="filler-content">
	<p>body filler content...</p>
	<p>more content...</p>
	<p>more content...</p>
	</div>

	<footer>

joseph-turner / flexbox-mixin.scss

Created May 29, 2013 22:21

Flexbox SASS mixin (Compass required) Implementation based on Chris Coyier's article: Using Flexbox: Mixing Old and New for the Best Browser Support (http://css-tricks.com/using-flexbox/)

	// ==================================================================
	// Flexbox
	//
	// Implementation based on Chris Coyier's article:
	// Using Flexbox: Mixing Old and New for the Best Browser Support \|\| http://css-tricks.com/using-flexbox/
	// ==================================================================

	// Flexbox Context (applied to container element of flex items)
	@mixin flex-display {
	@include experimental-value(display, box, -moz, -webkit, not -o, -ms, not -khtml, official); // Old