// This Source Code Form is subject to the terms of the Mozilla Public // License, v. 2.0. If a copy of the MPL was not distributed with this // file, You can obtain one at http://mozilla.org/MPL/2.0/. // // Copyright (c) KALEIDOS INC // Font sizes $fs8: 0.5rem; $fs9: 0.5625rem; $fs10: 0.625rem; $fs11: 0.6875rem; $fs12: 0.75rem; $fs13: 0.8125rem; $fs14: 0.875rem; $fs15: 0.9375rem; $fs16: 1rem; $fs17: 1.0625rem; $fs18: 1.125rem; $fs19: 1.1875rem; $fs20: 1.25rem; $fs21: 1.315rem; $fs22: 1.375rem; $fs23: 1.4375rem; $fs24: 1.5rem; $fs26: 1.625rem; $fs30: 1.875rem; $fs32: 2rem; $fs34: 2.125rem; $fs36: 2.25rem; $fs38: 2.375rem; $fs40: 2.5rem; $fs42: 2.675rem; $fs44: 2.75rem; $fs80: 5rem; // Font weight // Taken from https://fonts.google.com/specimen/Work+Sans $fw100: 100; // Thin $fw200: 200; // Extra Light $fw300: 300; // Light $fw400: 400; // Regular (CSS value: 'normal') $fw500: 500; // Medium $fw600: 600; // Semi Bold $fw700: 700; // Bold (CSS value: 'bold') $fw800: 800; // Extra Bold $fw900: 900; // Black // Line height // Value are predefined as unitless (ratio to font size in %), because that is the best approach for browsers according to https://developer.mozilla.org/en-US/docs/Web/CSS/line-height#values $lh-normal: normal; // line-height depends of font-family, font-size, your browser, maybe your OS http://meyerweb.com/eric/thoughts/2008/05/06/line-height-abnormal/ $lh-088: 0.88; $lh-100: 1; $lh-115: 1.15; // original $title-lh-sm $lh-125: 1.25; // original $title-lh $lh-128: 1.28; $lh-133: 1.33; // original $base-lh-sm $lh-143: 1.43; // original $base-lh $lh-145: 1.45; $lh-150: 1.5; $lh-188: 1.88; $lh-192: 1.92; $lh-200: 2; $lh-236: 2.36; $lh-500: 5; // Work Sans @include font-face("worksans", "WorkSans-Thin", "100"); @include font-face("worksans", "WorkSans-ThinItalic", "100", italic); @include font-face("worksans", "WorkSans-ExtraLight", "200"); @include font-face("worksans", "WorkSans-ExtraLightitalic", "200", italic); @include font-face("worksans", "WorkSans-Light", "300"); @include font-face("worksans", "WorkSans-LightItalic", "300", italic); @include font-face("worksans", "WorkSans-Regular", normal); @include font-face("worksans", "WorkSans-Italic", normal, italic); @include font-face("worksans", "WorkSans-Medium", "500"); @include font-face("worksans", "WorkSans-MediumItalic", "500", italic); @include font-face("worksans", "WorkSans-SemiBold", "600"); @include font-face("worksans", "WorkSans-SemiBoldItalic", "600", italic); @include font-face("worksans", "WorkSans-Bold", bold); @include font-face("worksans", "WorkSans-BoldItalic", bold, italic); @include font-face("worksans", "WorkSans-Black", "900"); @include font-face("worksans", "WorkSans-BlackItalic", "900", italic); // Source Sans Pro @include font-face("sourcesanspro", "sourcesanspro-extralight", "200"); @include font-face("sourcesanspro", "sourcesanspro-extralightitalic", "200", italic); @include font-face("sourcesanspro", "sourcesanspro-light", "300"); @include font-face("sourcesanspro", "sourcesanspro-lightitalic", "300", italic); @include font-face("sourcesanspro", "sourcesanspro-regular", normal); @include font-face("sourcesanspro", "sourcesanspro-italic", normal, italic); @include font-face("sourcesanspro", "sourcesanspro-semibold", "600"); @include font-face("sourcesanspro", "sourcesanspro-semibolditalic", "600", italic); @include font-face("sourcesanspro", "sourcesanspro-bold", bold); @include font-face("sourcesanspro", "sourcesanspro-bolditalic", bold, italic); @include font-face("sourcesanspro", "sourcesanspro-black", "900"); @include font-face("sourcesanspro", "sourcesanspro-blackitalic", "900", italic); // Vazirmatn @include font-face("vazirmatn", "Vazirmatn-Thin", "100"); @include font-face("vazirmatn", "Vazirmatn-ExtraLight", "200"); @include font-face("vazirmatn", "Vazirmatn-Light", "300"); @include font-face("vazirmatn", "Vazirmatn-Regular", normal); @include font-face("vazirmatn", "Vazirmatn-Medium", "500"); @include font-face("vazirmatn", "Vazirmatn-SemiBold", "600"); @include font-face("vazirmatn", "Vazirmatn-Bold", bold); @include font-face("vazirmatn", "Vazirmatn-ExtraBold", "800"); @include font-face("vazirmatn", "Vazirmatn-Black", "900");