@import "forever_style_guide/utils/font-utils"; /* =fonts ---------------------------------------------------------------------------- */ @mixin fontFace($family, $src) { @font-face { font-family: $family; src: font-url('#{$src}.eot'); // IE9 compat src: font-url('#{$src}.eot?#iefix') format('embedded-opentype'), // IE8 and below font-url('#{$src}.woff') format('woff'), // standards font-url('#{$src}.ttf') format('truetype'), // Safari, Android, iOS font-url('#{$src}.svg##{$family}') format('svg'); // legacy iOS } } @include fontFace('proxima_nova-light', 'ProximaNova-Light-webfont'); @include fontFace('proxima_nova-regular', 'ProximaNova-Reg-webfont'); @include fontFace('proxima_nova-semibold', 'ProximaNova-Sbold-webfont'); @include fontFace('proxima_nova-bold', 'ProximaNova-Bold-webfont'); @include fontFace('proxima_nova-regular_italic', 'ProximaNova-RegIt-webfont'); @include fontFace('proxima_nova-bold_italic', 'ProximaNova-BoldIt-webfont'); /* =font faces ---------------------------------------------------------------------------- */ $font-face-light: faceify('light', ('proxima_nova-light', Helvetica, Arial, sans-serif)) !default; $font-face-regular: faceify('regular', ('proxima_nova-regular', Helvetica, Arial, sans-serif)) !default; $font-face-semibold: faceify('semibold', ('proxima_nova-semibold', Helvetica, Arial, sans-serif)) !default; $font-face-bold: faceify('bold', ('proxima_nova-bold', Helvetica, Arial, sans-serif)) !default; $font-face-regular_italic: faceify('italic', ('proxima_nova-regular_italic', Helvetica, Arial, sans-serif)) !default; $font-face-bold_italic: faceify('bold_italic', ('proxima_nova-bold_italic', Helvetica, Arial, sans-serif)) !default; $font-face-gotham: faceify('gotham', ('Gotham A', 'Gotham B', Helvetica, Arial, sans-serif)) !default; @each $id, $font-face in $font-faces { .font-face-#{$id} { font-family: #{$font-face}; } } /* =font sizes ---------------------------------------------------------------------------- */ $font-size-000: fontify('000', 10px) !default; $font-size-100: fontify('100', 12px) !default; $font-size-200: fontify('200', 14px) !default; $font-size-300: fontify('300', 16px) !default; $font-size-400: fontify('400', 18px) !default; $font-size-500: fontify('500', 24px) !default; $font-size-600: fontify('600', 36px) !default; $font-size-700: fontify('700', 48px) !default; $font-size-800: fontify('800', 64px) !default; /* !global to override bootstrap's $font-size-large and $font-size-small */ $font-size-large: fontify('lg', $font-size-400) !global; $font-size-default: fontify('default', $font-size-300) !default; $font-size-small: fontify('sm', $font-size-100) !global; $font-size-xsmall: fontify('xs', $font-size-000) !default; @each $id, $font-size in $font-sizes { .font-size-#{$id} { font-size: #{$font-size}; } } /* =font weights ---------------------------------------------------------------------------- */ $font-weight-100: weightify('100', 100) !default; $font-weight-200: weightify('200', 200) !default; $font-weight-300: weightify('300', 300) !default; $font-weight-400: weightify('400', 400) !default; $font-weight-500: weightify('500', 500) !default; $font-weight-600: weightify('600', 600) !default; $font-weight-700: weightify('700', 700) !default; $font-weight-800: weightify('800', 800) !default; $font-weight-900: weightify('900', 900) !default; $font-weight-normal: weightify('normal', normal) !default; $font-weight-bold: weightify('bold', bold) !default; $font-weight-bolder: weightify('bolder', bolder) !default; $font-weight-lighter: weightify('lighter', lighter) !default; $font-weight-initial: weightify('initial', initial) !default; $font-weight-inherit: weightify('inherit', inherit) !default; @each $id, $font-weight in $font-weights { .font-weight-#{$id} { font-weight: #{$font-weight}; } }