Add typography mixins

This commit is contained in:
Ramon Wenger 2019-03-04 13:07:12 +01:00
parent bce54d0f46
commit 636740a5a0
1 changed files with 59 additions and 0 deletions

View File

@ -1,4 +1,5 @@
@import 'variables';
@import 'functions';
@mixin widget-shadow-base {
border-radius: $default-border-radius;
@ -59,3 +60,61 @@
@content
}
}
@mixin main-title {
font-family: $sans-serif-font-family;
font-weight: 700;
font-size: toRem(64px);
}
@mixin heading-1 {
font-family: $sans-serif-font-family;
font-weight: 600;
font-size: toRem(44px);
}
@mixin heading-2 {
font-family: $sans-serif-font-family;
font-weight: 600;
font-size: toRem(34px);
}
@mixin heading-3 {
font-family: $sans-serif-font-family;
font-weight: 600;
font-size: toRem(22px);
}
@mixin heading-4 {
font-family: $sans-serif-font-family;
font-weight: 600;
font-size: toRem(18px);
}
@mixin regular-text {
font-family: $sans-serif-font-family;
font-weight: 400;
font-size: toRem(18px);
}
@mixin small-text {
font-family: $sans-serif-font-family;
font-weight: 400;
font-size: toRem(16px);
}
@mixin meta-title {
font-family: $serif-font-family;
font-size: toRem(42px);
}
@mixin lead-paragraph {
font-family: $serif-font-family;
line-height: 1.4;
font-size: toRem(26px);
}
@mixin regular-paragraph {
font-family: $serif-font-family;
font-size: toRem(18px);
}