Skip to content

Instantly share code, notes, and snippets.

@elijahmanor
Last active August 29, 2015 14:03
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save elijahmanor/25863edc4f1f83425ec2 to your computer and use it in GitHub Desktop.
Save elijahmanor/25863edc4f1f83425ec2 to your computer and use it in GitHub Desktop.
Generated by SassMeister.com.
@mixin primary-heading {
font-size: scut-em(36);
font-weight: 800;
}
@mixin secondary-heading {
font-size: scut-em(24);
font-weight: 800;
}
@mixin body-copy {
font-size: scut-em(16);
line-height: scut-em(24, 16);
}
body {
@include body-copy;
}
h1 {
@include primary-heading;
}
h2 {
@include secondary-heading;
}
// ----
// Sass (v3.3.8)
// Compass (v1.0.0.alpha.19)
// Scut (v0.10.4)
// ----
@import "scut";
@mixin typeset( $type: body-copy ) {
$types: (
primary-heading: ( font-size: 48px, font-weight: 800 ),
secondary-heading: ( font-size: 16px, font-weight: 700, line-height: 22px ),
body-copy: ( font-size: 16px, line-height: 24px ),
);
$type: map-get($types, $type);
font-size: scut-em(map-get($type, font-size));
@if map-has-key($type, font-weight) {
font-weight: map-get($type, font-weight);
}
@if map-has-key($type, line-height) {
line-height: scut-em(map-get($type, line-height), map-get($type, font-size));
}
}
h1 {
@include typeset(primary-heading);
}
h2 {
@include typeset(secondary-heading);
}
p {
@include typeset(body-copy);
}
/*
* Scut, a collection of Sass utilities
* to ease and improve our implementations of common style-code patterns.
* v0.10.4
* Docs at http://davidtheclark.github.io/scut
*/
h1 {
font-size: 3em;
font-weight: 800;
}
h2 {
font-size: 1em;
font-weight: 700;
line-height: 1.375em;
}
p {
font-size: 1em;
line-height: 1.5em;
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment