// Line Clamp @for $i from 1 to 7 { .line-clamp-#{$i} { overflow: hidden; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: #{$i}; } } .line-clamp-none { overflow: visible; display: block; -webkit-box-orient: horizontal; -webkit-line-clamp: none; } // Line Height $lineHeights: 'leading-3' '.75rem','leading-4' '1rem','leading-5' '1.25rem','leading-6' '1.5rem','leading-7' '1.75rem','leading-8' '2rem','leading-9' '2.25rem','leading-10' '2.5rem','leading-none' '1','leading-tight' '1.25','leading-snug' '1.375','leading-normal' '1.5','leading-relaxed' '1.625','leading-loose' '2'; @each $name, $val in $lineHeights { .#{$name} {line-height: #{$val};} }