Clearer font definitons via a font-face mixin
This commit is contained in:
parent
ca4b1594a7
commit
d392608090
|
@ -1,46 +1,23 @@
|
|||
$FontPathSourceSansPro: '~npm-font-source-sans-pro/fonts';
|
||||
$basePath: '#{$FontPathSourceSansPro}/WOFF2/TTF/SourceSansPro';
|
||||
|
||||
@font-face {
|
||||
font-family: 'Source Sans Pro';
|
||||
font-weight: 400;
|
||||
font-style: normal;
|
||||
font-stretch: normal;
|
||||
font-display: swap;
|
||||
src: url('#{$FontPathSourceSansPro}/WOFF2/TTF/SourceSansPro-Regular.ttf.woff2') format('woff2'),
|
||||
@mixin fontface($name, $path, $weight: null, $style: null, $exts: woff2) {
|
||||
$src: null;
|
||||
@each $ext in $exts {
|
||||
$src: append($src, url(quote($path + "." + $ext)) format(quote($ext)), comma);
|
||||
}
|
||||
@font-face {
|
||||
font-family: quote($name);
|
||||
font-weight: $weight;
|
||||
font-style: $style;
|
||||
font-stretch: normal;
|
||||
font-display: swap;
|
||||
src: $src;
|
||||
}
|
||||
}
|
||||
|
||||
@font-face {
|
||||
font-family: 'Source Sans Pro';
|
||||
font-weight: 400;
|
||||
font-style: italic;
|
||||
font-stretch: normal;
|
||||
font-display: swap;
|
||||
src: url('#{$FontPathSourceSansPro}/WOFF2/TTF/SourceSansPro-It.ttf.woff2') format('woff2'),
|
||||
}
|
||||
|
||||
@font-face {
|
||||
font-family: 'Source Sans Pro';
|
||||
font-weight: 600;
|
||||
font-style: normal;
|
||||
font-stretch: normal;
|
||||
font-display: swap;
|
||||
src: url('#{$FontPathSourceSansPro}/WOFF2/TTF/SourceSansPro-Semibold.ttf.woff2') format('woff2'),
|
||||
}
|
||||
|
||||
@font-face {
|
||||
font-family: 'Source Sans Pro';
|
||||
font-weight: 600;
|
||||
font-style: italic;
|
||||
font-stretch: normal;
|
||||
font-display: swap;
|
||||
src: url('#{$FontPathSourceSansPro}/WOFF2/TTF/SourceSansPro-SemiboldIt.ttf.woff2') format('woff2'),
|
||||
}
|
||||
|
||||
@font-face {
|
||||
font-family: 'Source Sans Pro';
|
||||
font-weight: 700;
|
||||
font-style: normal;
|
||||
font-stretch: normal;
|
||||
font-display: swap;
|
||||
src: url('#{$FontPathSourceSansPro}/WOFF2/TTF/SourceSansPro-Bold.ttf.woff2') format('woff2'),
|
||||
}
|
||||
@include fontface('Source Sans Pro', '#{$basePath}-Regular.ttf', 400, normal);
|
||||
@include fontface('Source Sans Pro', '#{$basePath}-It.ttf', 400, italic);
|
||||
@include fontface('Source Sans Pro', '#{$basePath}-Semibold.ttf', 600, normal);
|
||||
@include fontface('Source Sans Pro', '#{$basePath}-SemiboldIt.ttf', 600, italic);
|
||||
@include fontface('Source Sans Pro', '#{$basePath}-Bold.ttf', 700, normal);
|
Loading…
Reference in New Issue