diff --git a/src/theme.less b/src/theme.less index 52952c4b4d..67966f5cc4 100644 --- a/src/theme.less +++ b/src/theme.less @@ -60,8 +60,19 @@ Fonts -------------------*/ -.loadFonts() when (@importGoogleFonts) { - @import (css) url('@{googleProtocol}fonts.googleapis.com/css2?family=@{googleFontRequest}'); +.loadFonts() { + & when (@importGoogleFonts) { + @import (css) url('@{googleProtocol}fonts.googleapis.com/css2?family=@{googleFontRequest}'); + } + & when (@importFonts) and not (@fontName = ''){ + each(@fonts, { + @font-face { + each(@value,{ + @{key}: @value; + }); + } + }) + } } /*------------------ diff --git a/src/themes/amazon/globals/site.variables b/src/themes/amazon/globals/site.variables index add84260e6..3f6f02966f 100644 --- a/src/themes/amazon/globals/site.variables +++ b/src/themes/amazon/globals/site.variables @@ -9,6 +9,7 @@ @fontSize : 13px; @fontName : 'Arial'; @importGoogleFonts : false; +@importFonts: false; @h1: 2.25em; diff --git a/src/themes/default/assets/fonts/Lato-Bold.woff b/src/themes/default/assets/fonts/Lato-Bold.woff new file mode 100644 index 0000000000..c6dff51f06 Binary files /dev/null and b/src/themes/default/assets/fonts/Lato-Bold.woff differ diff --git a/src/themes/default/assets/fonts/Lato-Bold.woff2 b/src/themes/default/assets/fonts/Lato-Bold.woff2 new file mode 100644 index 0000000000..bb195043cf Binary files /dev/null and b/src/themes/default/assets/fonts/Lato-Bold.woff2 differ diff --git a/src/themes/default/assets/fonts/Lato-BoldItalic.woff b/src/themes/default/assets/fonts/Lato-BoldItalic.woff new file mode 100644 index 0000000000..88ad05b9ff Binary files /dev/null and b/src/themes/default/assets/fonts/Lato-BoldItalic.woff differ diff --git a/src/themes/default/assets/fonts/Lato-BoldItalic.woff2 b/src/themes/default/assets/fonts/Lato-BoldItalic.woff2 new file mode 100644 index 0000000000..c4e3d804b5 Binary files /dev/null and b/src/themes/default/assets/fonts/Lato-BoldItalic.woff2 differ diff --git a/src/themes/default/assets/fonts/Lato-Italic.woff b/src/themes/default/assets/fonts/Lato-Italic.woff new file mode 100644 index 0000000000..76114bc033 Binary files /dev/null and b/src/themes/default/assets/fonts/Lato-Italic.woff differ diff --git a/src/themes/default/assets/fonts/Lato-Italic.woff2 b/src/themes/default/assets/fonts/Lato-Italic.woff2 new file mode 100644 index 0000000000..3404f37e2e Binary files /dev/null and b/src/themes/default/assets/fonts/Lato-Italic.woff2 differ diff --git a/src/themes/default/assets/fonts/Lato-Regular.woff b/src/themes/default/assets/fonts/Lato-Regular.woff new file mode 100644 index 0000000000..ae1307ff5f Binary files /dev/null and b/src/themes/default/assets/fonts/Lato-Regular.woff differ diff --git a/src/themes/default/assets/fonts/Lato-Regular.woff2 b/src/themes/default/assets/fonts/Lato-Regular.woff2 new file mode 100644 index 0000000000..3bf9843328 Binary files /dev/null and b/src/themes/default/assets/fonts/Lato-Regular.woff2 differ diff --git a/src/themes/default/assets/fonts/LatoLatin-Bold.woff b/src/themes/default/assets/fonts/LatoLatin-Bold.woff new file mode 100644 index 0000000000..cdfcbe0fbc Binary files /dev/null and b/src/themes/default/assets/fonts/LatoLatin-Bold.woff differ diff --git a/src/themes/default/assets/fonts/LatoLatin-Bold.woff2 b/src/themes/default/assets/fonts/LatoLatin-Bold.woff2 new file mode 100644 index 0000000000..2615c853d5 Binary files /dev/null and b/src/themes/default/assets/fonts/LatoLatin-Bold.woff2 differ diff --git a/src/themes/default/assets/fonts/LatoLatin-BoldItalic.woff b/src/themes/default/assets/fonts/LatoLatin-BoldItalic.woff new file mode 100644 index 0000000000..3e683fea7c Binary files /dev/null and b/src/themes/default/assets/fonts/LatoLatin-BoldItalic.woff differ diff --git a/src/themes/default/assets/fonts/LatoLatin-BoldItalic.woff2 b/src/themes/default/assets/fonts/LatoLatin-BoldItalic.woff2 new file mode 100644 index 0000000000..f7bace1377 Binary files /dev/null and b/src/themes/default/assets/fonts/LatoLatin-BoldItalic.woff2 differ diff --git a/src/themes/default/assets/fonts/LatoLatin-Italic.woff b/src/themes/default/assets/fonts/LatoLatin-Italic.woff new file mode 100644 index 0000000000..d8cf84c8b9 Binary files /dev/null and b/src/themes/default/assets/fonts/LatoLatin-Italic.woff differ diff --git a/src/themes/default/assets/fonts/LatoLatin-Italic.woff2 b/src/themes/default/assets/fonts/LatoLatin-Italic.woff2 new file mode 100644 index 0000000000..aaa5a35c3d Binary files /dev/null and b/src/themes/default/assets/fonts/LatoLatin-Italic.woff2 differ diff --git a/src/themes/default/assets/fonts/LatoLatin-Regular.woff b/src/themes/default/assets/fonts/LatoLatin-Regular.woff new file mode 100644 index 0000000000..bf73a6d9f9 Binary files /dev/null and b/src/themes/default/assets/fonts/LatoLatin-Regular.woff differ diff --git a/src/themes/default/assets/fonts/LatoLatin-Regular.woff2 b/src/themes/default/assets/fonts/LatoLatin-Regular.woff2 new file mode 100644 index 0000000000..a4d084bfb7 Binary files /dev/null and b/src/themes/default/assets/fonts/LatoLatin-Regular.woff2 differ diff --git a/src/themes/default/globals/site.variables b/src/themes/default/globals/site.variables index 88cadf105b..caadfde029 100755 --- a/src/themes/default/globals/site.variables +++ b/src/themes/default/globals/site.variables @@ -3,18 +3,113 @@ *******************************/ @import "variation.variables"; +@supportIE: true; /*------------------- Fonts --------------------*/ @fontName : 'Lato'; - -@headerFont : @fontName, 'Helvetica Neue', Arial, Helvetica, sans-serif; -@pageFont : @fontName, 'Helvetica Neue', Arial, Helvetica, sans-serif; +@fontFileNameLatin : 'LatoLatin'; +@fontFileNameSupplement: 'Lato'; + +// based on https://github.com/twbs/bootstrap/blob/v5.1.3/scss/_variables.scss#L577 list +@fallbackFonts : system-ui, -apple-system, "Segoe UI", Roboto, Oxygen, Ubuntu, Cantarell, "Helvetica Neue", Arial, "Noto Sans", "Liberation Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji"; + +@headerFont : @fontName, @fallbackFonts; +@pageFont : @fontName, @fallbackFonts; + +@fontDisplay : swap; +@textRendering : optimizeLegibility; +@unicodeRangeLatin : U+0000, U+000D, U+0020-007E, U+00A0-017F, U+0192, U+0218-021B, U+0237, U+02C6-02C7, U+02C9, U+02D8-02DD, U+0394, U+03A9, U+03BC, U+03C0, U+1E80-1E85, U+2010, U+2013-2014, U+2018-201A, U+201C-201E, U+2020-2022, U+2026, U+2030, U+2039-203A, U+2044, U+20A3-20A4, U+20A7, U+20AC, U+2113, U+2122, U+2126, U+212E, U+2202, U+2206, U+220F, U+2211-2212, U+2215, U+2219-221A, U+221E, U+222B, U+2248, U+2260, U+2264-2265, U+25CA, U+F8FF, U+FB00-FB04; +@unicodeRangeSupplement : U+0180-0191, U+0193-0217, U+021C-0236, U+0238-02C5, U+02C8, U+02CA-02D7, U+02DE-036F, U+0374-0375, U+037A-037E, U+0384-038A, U+038C, U+038E-0393, U+0395-03A1, U+03A3-03A8, U+03AA-03BB, U+03BD-03BF, U+03C1-03CE, U+03D0-0486, U+0488-0513, U+1D00-1DCA, U+1DFE-1E7F, U+1E86-1E9B, U+1E9E, U+1EA0-1EF9, U+1F00-1F15, U+1F18-1F1D, U+1F20-1F45, U+1F48-1F4D, U+1F50-1F57, U+1F59, U+1F5B, U+1F5D, U+1F5F-1F7D, U+1F80-1FB4, U+1FB6-1FC4, U+1FC6-1FD3, U+1FD6-1FDB, U+1FDD-1FEF, U+1FF2-1FF4, U+1FF6-1FFE, U+2000-200F, U+2012, U+2015-2017, U+201B, U+201F, U+202F, U+2034, U+203C-203E, U+205E-205F, U+2070-2071, U+2074-2094, U+20A0-20A2, U+20A5-20A6, U+20A8-20AB, U+20AD-20B5, U+20B8-20BA, U+20DD, U+2105, U+2116-2117, U+2120, U+2132, U+214D-214E, U+2153-215F, U+2183-2184, U+2190-2199, U+21A8, U+221F, U+2229, U+2261, U+2302, U+2310, U+2320-2321, U+2460-2473, U+24EA-24F4, U+24FF-2500, U+2502, U+250C, U+2510, U+2514, U+2518, U+2C60-2C6C, U+2C74-2C77; + +@importFonts : true; +@fonts: { + @regularLatin: { + font-family: @fontName; + src: url("@{fontPath}/@{fontFileNameLatin}-Regular.woff2") format('woff2') + if(@supportIE, e(',') url("@{fontPath}/@{fontFileNameLatin}-Regular.woff") format('woff')); + font-style : normal; + font-weight : @normal; + font-display : @fontDisplay; + text-rendering : @textRendering; + unicode-range : @unicodeRangeLatin; + }; + @boldLatin: { + font-family: @fontName; + src: url("@{fontPath}/@{fontFileNameLatin}-Bold.woff2") format('woff2') + if(@supportIE, e(',') url("@{fontPath}/@{fontFileNameLatin}-Bold.woff") format('woff')); + font-style : normal; + font-weight : @bold; + font-display : @fontDisplay; + text-rendering : @textRendering; + unicode-range : @unicodeRangeLatin; + }; + @italicLatin: { + font-family: @fontName; + src: url("@{fontPath}/@{fontFileNameLatin}-Italic.woff2") format('woff2') + if(@supportIE, e(',') url("@{fontPath}/@{fontFileNameLatin}-Italic.woff") format('woff')); + font-style : italic; + font-weight : @normal; + font-display : @fontDisplay; + text-rendering : @textRendering; + unicode-range : @unicodeRangeLatin; + }; + @boldItalicLatin: { + font-family: @fontName; + src: url("@{fontPath}/@{fontFileNameLatin}-BoldItalic.woff2") format('woff2') + if(@supportIE, e(',') url("@{fontPath}/@{fontFileNameLatin}-BoldItalic.woff") format('woff')); + font-style : italic; + font-weight : @bold; + font-display : @fontDisplay; + text-rendering : @textRendering; + unicode-range : @unicodeRangeLatin; + }; + @regularSupplement: { + font-family: @fontName; + src: url("@{fontPath}/@{fontFileNameSupplement}-Regular.woff2") format('woff2') + if(@supportIE, e(',') url("@{fontPath}/@{fontFileNameSupplement}-Regular.woff") format('woff')); + font-style : normal; + font-weight : @normal; + font-display : @fontDisplay; + text-rendering : @textRendering; + unicode-range : @unicodeRangeSupplement; + }; + @boldSupplement: { + font-family: @fontName; + src: url("@{fontPath}/@{fontFileNameSupplement}-Bold.woff2") format('woff2') + if(@supportIE, e(',') url("@{fontPath}/@{fontFileNameSupplement}-Bold.woff") format('woff')); + font-style : normal; + font-weight : @bold; + font-display : @fontDisplay; + text-rendering : @textRendering; + unicode-range : @unicodeRangeSupplement; + }; + @italicSupplement: { + font-family: @fontName; + src: url("@{fontPath}/@{fontFileNameSupplement}-Italic.woff2") format('woff2') + if(@supportIE, e(',') url("@{fontPath}/@{fontFileNameSupplement}-Italic.woff") format('woff')); + font-style : italic; + font-weight : @normal; + font-display : @fontDisplay; + text-rendering : @textRendering; + unicode-range : @unicodeRangeSupplement; + }; + @boldItalicSupplement: { + font-family: @fontName; + src: url("@{fontPath}/@{fontFileNameSupplement}-BoldItalic.woff2") format('woff2') + if(@supportIE, e(',') url("@{fontPath}/@{fontFileNameSupplement}-BoldItalic.woff") format('woff')); + font-style : italic; + font-weight : @bold; + font-display : @fontDisplay; + text-rendering : @textRendering; + unicode-range : @unicodeRangeSupplement; + }; +}; @googleFontName : @fontName; -@importGoogleFonts : true; +@importGoogleFonts : false; @googleFontSizes : 'ital,wght@0,400%3B0,700%3B1,400%3B1,700'; @googleSubset : 'latin'; @googleFontDisplay : 'swap'; diff --git a/src/themes/github/globals/site.variables b/src/themes/github/globals/site.variables index b5879ee8fd..661a13cf16 100644 --- a/src/themes/github/globals/site.variables +++ b/src/themes/github/globals/site.variables @@ -9,6 +9,7 @@ @fontSize : 13px; @fontName : 'Arial'; @importGoogleFonts : false; +@importFonts: false; @h1: 2.25em; diff --git a/src/themes/systemfont/globals/reset.overrides b/src/themes/systemfont/globals/reset.overrides new file mode 100644 index 0000000000..45b57cf318 --- /dev/null +++ b/src/themes/systemfont/globals/reset.overrides @@ -0,0 +1,8 @@ +/******************************* + Overrides +*******************************/ + +b, +strong { + font-weight: 600; +} diff --git a/src/themes/systemfont/globals/site.variables b/src/themes/systemfont/globals/site.variables new file mode 100644 index 0000000000..4f04470151 --- /dev/null +++ b/src/themes/systemfont/globals/site.variables @@ -0,0 +1,10 @@ +/******************************* + User Global Variables +*******************************/ + +@fontName : ''; +@headerFont : @fallbackFonts; +@pageFont : @fallbackFonts; +@importGoogleFonts : false; +@importFonts : false; +@bold : 600;