Files
blog_bricked/src/styles/mixins/typography.css
2025-09-29 15:20:46 +02:00

79 lines
1.8 KiB
CSS

@define-mixin text-8xl $leading: 1 {
font-size: var(--typo-size-8xl);
line-height: calc($leading * 1.0435);
letter-spacing: -0.0219em;
}
@define-mixin text-7xl $leading: 1 {
font-size: var(--typo-size-7xl);
line-height: calc($leading * 1.098);
letter-spacing: -0.0198em;
}
@define-mixin text-6xl $leading: 1 {
font-size: var(--typo-size-6xl);
line-height: calc($leading * 1.0864);
letter-spacing: -0.0172em;
}
@define-mixin text-5xl $leading:1 {
font-size: var(--typo-size-5xl);
line-height: calc($leading * 1.125);
letter-spacing: -0.0137em;
}
@define-mixin text-4xl $leading:1 {
font-size: var(--typo-size-4xl);
line-height: calc($leading * 1.1765);
letter-spacing: -0.0096em;
}
@define-mixin text-3xl $leading:1 {
font-size: var(--typo-size-3xl);
line-height: calc($leading * 1.2);
letter-spacing: -0.004em;
}
@define-mixin text-2xl $leading:1 {
font-size: var(--typo-size-2xl);
line-height: calc($leading * 1.25);
letter-spacing: 0.0025em;
}
@define-mixin text-xl $leading:1{
font-size: var(--typo-size-xl);
line-height: calc($leading * 1.28);
letter-spacing: 0.0116em;
}
@define-mixin text-lg $leading:1 {
font-size: var(--typo-size-lg);
line-height: calc($leading * 1.4);
letter-spacing: 0.022em;
}
@define-mixin text-md $leading:1 {
font-size: var(--typo-size-md);
line-height: calc($leading * 1.5);
letter-spacing: 0.035em;
}
@define-mixin text-sm $leading:1 {
font-size: var(--typo-size-sm);
line-height: calc($leading * 1.5385);
letter-spacing: 0.05em;
}
@define-mixin text-xs $leading:1 {
font-size: var(--typo-size-xs);
line-height: calc($leading * 2);
letter-spacing: 0.074em;
}
@define-mixin text-2xs $leading:1 {
font-size: var(--typo-size-2xs);
line-height: calc($leading * 2);
letter-spacing: 0.1em;
}