$spacing: 1rem;
body {
margin: ($spacing * 4) $spacing;
}
$vertical-rhythm-line-height: 1.7;
$vertical-rhythm-unit: ($vertical-rhythm-line-height * 1rem);
h1 {
margin: 0 0 $vertical-rhythm-unit;
padding-bottom: ($vertical-rhythm-unit * .5);
font-size: 1.5rem;
line-height: ($vertical-rhythm-unit * 2);
border-bottom: 1px solid gray;
}
p {
margin: 0 0 $vertical-rhythm-unit;
line-height: $vertical-rhythm-unit;
}
$ratio: 1.7;
$line-height: $ratio;
$spacing: ($ratio * 1rem);
$spacing-minimal: ($spacing / $ratio / $ratio / $ratio);
$spacing-tiny: ($spacing / $ratio / $ratio);
$spacing-small: ($spacing / $ratio);
$spacing-large: ($spacing * $ratio);
$spacing-huge: ($spacing * $ratio * $ratio);
$spacing-gargantuan: ($spacing * $ratio * $ratio * $ratio);
$spacing: 8px;
body {
margin: ($spacing * 4) $spacing;
}