jake/jarv.is
1
Fork 0
mirror of https://github.com/jakejarvis/jarv.is.git synced 2025-07-17 12:15:31 -04:00
Code Issues Activity

simplify SASS @font-face mixin

Browse Source
This commit is contained in:
Jake Jarvis
2020-01-30 00:02:46 -05:00
parent 7edb9fa68b
commit 65bb5b12a5
6 changed files with 45 additions and 38 deletions
Download Patch File Download Diff File Expand all files Collapse all files

17
assets/sass/abstracts/_functions.scss
View File

@@ -13,21 +13,16 @@
}
// Web fonts (see components/_fonts.scss)
// stylelint-disable indentation
@mixin font-face($family, $src, $weight: normal, $range: false, $style: normal, $display: swap) {
@font-face {
@mixin font-face($family, $src, $weight: normal, $style: normal, $display: swap) {
@font-face {
font-family: $family;
font-style: $style;
font-weight: $weight;
font-display: $display;
src: url("#{$src}.woff2") format("woff2"),
url("#{$src}.woff") format("woff");
// src: local("#{$src-local}"), local("#{$src-local-alt}"),
// url('#{$src}.ttf') format('truetype'),
// url('#{$src}.eot') format('embedded-opentype');
@if $range {
unicode-range: U+0000-00FF, U+2000-206F, U+20A0-20CF,
U+2190-21FF, U+2200-22FF, U+2122;
}
url("#{$src}.woff") format("woff"); // stylelint-disable-line indentation
// Allow additional declarations to be passed in:
@content;
}
}

1
assets/sass/components/_content.scss
View File

@@ -99,4 +99,5 @@ div#content {
// Responsive
@mixin responsive--content() {
// stylelint-disable block-no-empty
}

19
assets/sass/components/_fonts.scss
View File

@@ -1,5 +1,10 @@
@charset "UTF-8";
// Note to self: got this list after subsetting Inter with glyphhanger:
// https://github.com/filamentgroup/glyphhanger
// ex: glyphhanger --whitelist="" --family="Inter" --formats=woff2,woff --subset="*.woff"
$unicode-subset: U+0000-00FF, U+2000-206F, U+20A0-20CF, U+2190-21FF, U+2200-22FF, U+2122;
/*!
* Inter typeface v3.11 - https://rsms.me/inter/
*
@@ -7,9 +12,15 @@
* Licensed under the SIL Open Font License, Version 1.1:
* https://github.com/rsms/inter/blob/v3.11/LICENSE.txt
*/
@include font-face("Inter", "./fonts/inter-regular-subset", 400, true);
@include font-face("Inter", "./fonts/inter-medium-subset", 500, true);
@include font-face("Inter", "./fonts/inter-bold-subset", 700, true);
@include font-face("Inter", "fonts/inter-regular-subset", 400) {
unicode-range: $unicode-subset;
}
@include font-face("Inter", "fonts/inter-medium-subset", 500) {
unicode-range: $unicode-subset;
}
@include font-face("Inter", "fonts/inter-bold-subset", 700) {
unicode-range: $unicode-subset;
}
/*!
* Hack typeface v3.003 - https://sourcefoundry.org/hack/
@@ -18,4 +29,4 @@
* Licensed under the MIT License:
* https://github.com/source-foundry/Hack/blob/v3.003/LICENSE.md
*/
@include font-face("Hack", "./fonts/hack-regular-subset", 400);
@include font-face("Hack", "fonts/hack-regular-subset", 400);

2
assets/sass/components/_wave.scss
View File

@@ -1,6 +1,6 @@
@charset "UTF-8";
/*! Fancy Waving Hand Emoji™ - https://go.jarv.is/wave */
/*! Magic Waving Hand™ - https://go.jarv.is/wave */
span.wave {
display: inline-block;

2
assets/sass/pages/_videos.scss
View File

@@ -20,7 +20,7 @@ main#video {
letter-spacing: -0.005em;
line-height: 1.5;
color: #777777;
margin: 1.25em;
margin: 1.25em 1em 0 1em;
a {
font-weight: bold;