SCSS Typography mixin

gistfile1.txt

/**
 * Vertical rhythm by Syncope
 * http://nowodzinski.pl/syncope
 */

html, body {
	font: 16px/1.7 'Helvetica';
}

$v-rhythm-levels: (
	4: ( 5.06rem, 1.33rem, 0.321rem, 0.0123rem ),
	3: ( 3.38rem, 1.50rem, 0.407rem, 0.0926rem ),
	2: ( 2.25rem, 1.50rem, 0.417rem, 0.333rem ),
	1: ( 1.50rem, 1.13rem, 0.208rem, 0.917rem ),
	0: ( 1.00rem, 1.69rem, 0.500rem, 1.19rem ),
);

/**
 * Sets vertical–rhythm for the given level.
 * Usage:
 *
 * 	h1 {
 * 		@include v-rhythm( 4 );
 * 	}
 */
@mixin v-rhythm( $level ) {
	$rhythm: map-get( $v-rhythm-levels, $level );

	font-size: nth( $rhythm, 1 );
	line-height: nth( $rhythm, 2 );
	padding-top: nth( $rhythm, 3 );
	margin-bottom: nth( $rhythm, 4 );
}