2020-12-10 16:49:59 +08:00
|
|
|
/*!markdown
|
|
|
|
|
|
|
|
---
|
|
|
|
title: Font Size
|
|
|
|
---
|
|
|
|
|
2020-12-22 14:58:36 +08:00
|
|
|
| Class | Properties |
|
|
|
|
| ----------- | ------------------------ |
|
|
|
|
| text-xs | font-size: 0.75rem; line-height: 1rem |
|
|
|
|
| text-sm | font-size: 0.875rem; line-height: 1.25rem |
|
|
|
|
| text-base | font-size: 1rem; line-height: 1.5rem |
|
|
|
|
| text-md | font-size: 1.125rem; line-height: 1.75rem |
|
|
|
|
| text-lg | font-size: 1.25rem; line-height: 1.75rem |
|
|
|
|
| text-xl | font-size: 1.5rem; line-height: 2rem |
|
|
|
|
| text-2xl | font-size: 1.875rem; line-height: 2.25rem |
|
|
|
|
| text-3xl | font-size: 2.25rem; line-height: 2.5rem |
|
|
|
|
| text-4xl | font-size: 3rem; line-height: 1 |
|
|
|
|
| text-5xl | font-size: 3.75rem; line-height: 1 |
|
|
|
|
| text-6xl | font-size: 4.5rem; line-height: 1 |
|
|
|
|
| text-7xl | font-size: 6rem; line-height: 1 |
|
|
|
|
| text-8xl | font-size: 8rem; line-height: 1 |
|
|
|
|
|
2020-12-10 16:49:59 +08:00
|
|
|
|
|
|
|
|
|
|
|
*/
|
2020-11-27 00:11:42 +08:00
|
|
|
@mixin make-font-size($prefix: '.', $suffix: '') {
|
|
|
|
@each $name, $values in $fontSizes {
|
|
|
|
#{$prefix}text-#{$name}#{$suffix} {
|
|
|
|
font-size: nth($values, 1);
|
|
|
|
line-height: nth($values, 2);
|
|
|
|
}
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
@include make-font-size();
|
|
|
|
@each $deivce in map-keys($devices) {
|
|
|
|
@include media-device($deivce) {
|
|
|
|
@include make-font-size('.' + selector-escape($deivce + ':'));
|
|
|
|
}
|
|
|
|
}
|