Contents

 
// Returns a scale of a map of proportionally-related type sizes. 
// Each size is composed of a font-size and line-height value.

@function td-type-scale($opts: ()) {

	// Extend default opts with passed opts.
	$opts: map-merge((
		"base-font-size": 16px,
		"base-line-height": 1.5,
		"max-font-size": 28px,
		"max-line-height": 1.35,
		"numb-smaller-sizes": 1,
		"numb-larger-sizes": 4
	), $opts);

	// Create font-size scale
	$font-size-scale: td-scale((
		"base-value": map-get($opts, "base-font-size"),
		"max-value": map-get($opts, "max-font-size"),
		"numb-smaller-values": map-get($opts, "numb-smaller-sizes"),
		"numb-larger-values": map-get($opts, "numb-larger-sizes")
	));

	// Create line-height scale
	$line-height-scale: td-scale((
		"base-value": map-get($opts, "base-line-height"),
		"max-value": map-get($opts, "max-line-height"),
		"numb-smaller-values": map-get($opts, "numb-smaller-sizes"),
		"numb-larger-values": map-get($opts, "numb-larger-sizes")
	));

	// The object we'll return.
	$sizes: ();
	
	// Pair each size with the correponding font-size 
	// and line-height, then add the size to the scale.
	@for $i from -(map-get($opts, "numb-smaller-sizes")) to map-get($opts, "numb-larger-sizes") + 1 {
		
		// Calculate array position in order to lookup sizes in lists.
		$arr-position: $i + map-get($opts, "numb-smaller-sizes") + 1;

		// Key for size
		$name-of-size: $i;

		// Values for size
		$values: (
			"font-size": nth($font-size-scale, $arr-position),
			"line-height": nth($line-height-scale, $arr-position)
		);

		// Add to size array.
		$sizes: map-merge($sizes, ($name-of-size: $values));
	}

	@return $sizes;
}

Version data entries

1 entries across 1 versions & 1 rubygems

Version	Path
type-director-0.9	stylesheets/type-director/_type-scale.scss