add base typography mixins
This commit is contained in:
parent
2f13a24fb6
commit
6b6049beb4
|
@ -11,6 +11,7 @@
|
|||
<meta name="description" content="THE DESCRIPTION IS THIS!">
|
||||
<meta name="author" content="I AM THE AUTHOR!">
|
||||
|
||||
<link href="https://fonts.googleapis.com/css2?family=Montserrat:wght@400;500;600;700&display=swap" rel="stylesheet">
|
||||
<link rel="stylesheet" href="css/style.css">
|
||||
|
||||
</head>
|
||||
|
|
|
@ -40,6 +40,7 @@
|
|||
|
||||
body {
|
||||
font-size: 100%;
|
||||
@include font-body;
|
||||
color: $color-body;
|
||||
background-color: $background-color;
|
||||
}
|
||||
|
|
|
@ -0,0 +1,27 @@
|
|||
@mixin font-1($weight) {
|
||||
font-family: "Montserrat", sans-serif;
|
||||
@if $weight == regular {
|
||||
font-weight: 400;
|
||||
} @else if $weight == medium {
|
||||
font-weight: 500;
|
||||
} @else if $weight == semi-bold {
|
||||
font-weight: 600;
|
||||
} @else if $weight == bold {
|
||||
font-weight: 700;
|
||||
} @else {
|
||||
@error "font-weight #{$weight} not in valid font-weights for font-1: 'Montserrat'.";
|
||||
}
|
||||
}
|
||||
|
||||
@mixin font-body($weight: regular) {
|
||||
@include font-1($weight);
|
||||
}
|
||||
|
||||
@mixin font-title($weight: medium) {
|
||||
@include font-1($weight);
|
||||
}
|
||||
|
||||
@mixin font-link($weight: medium) {
|
||||
@include font-1($weight);
|
||||
}
|
||||
|
|
@ -1,4 +1,5 @@
|
|||
@import "variables";
|
||||
@import "node_modules/modern-css-reset/src/reset";
|
||||
@import "typography";
|
||||
@import "base";
|
||||
@import "layout";
|
||||
|
|
Loading…
Reference in New Issue