Skip to content

Instantly share code, notes, and snippets.

@envoytravis
Created August 26, 2014 22:56
Show Gist options
  • Save envoytravis/154f56cb837ff0d347ca to your computer and use it in GitHub Desktop.
Save envoytravis/154f56cb837ff0d347ca to your computer and use it in GitHub Desktop.
Generated by SassMeister.com.
// ----
// Sass (v3.4.1)
// Compass (v1.0.1)
// ----
$font-faces: (
'Helvetica-Neue': 'helveticaneue',
'Helvetica-Neue-Bold': ('helveticaneue-bold-webfont', 700),
'Helvetica-Neue-Medium': ('helveticaneue-medium-webfont', 500),
'Avant-Garde-Black': ('itcavantgardestd-bk-webfont', 700),
'Avant-Garde-Bold': ('itcavantgardestd-bold-webfont', 500),
'Avant-Garde-Demi': 'itcavantgardestd-demi-webfont',
'Avant-Garde-XLT': ('itcavantgardestd-xlt-webfont', 100)
);
$font-path: '../fonts/';
// font family mixin
@mixin font($font, $style: normal, $weight: normal) {
font-family: $font, Helvetica, Arial, sans-serif;
font-style: $style;
font-weight: $weight;
}
@each $font-face-name, $font-face in $font-faces {
$font-weight: 'normal';
$font-style: 'normal';
// check if we are passing a list
@if (type-of($font-face) == list) {
$font-weight: nth($font-face, 2);
$font-style: if(length($font-face) == 3, nth($font-face, 3), 'normal');
}
// generate all font faces using their appropriate weights & styles
@font-face {
font-family: $font-face-name;
font-weight: $font-weight;
font-style: $font-style;
src: url('#{$font-path}#{nth($font-face, 1)}.eot');
src: url('#{$font-path}#{nth($font-face, 1)}.eot?') format('eot'),
url('#{$font-path}#{nth($font-face, 1)}.woff') format('woff'),
url('#{$font-path}#{nth($font-face, 1)}.ttf') format('truetype');
}
// generate placeholders so we can extend when we need to use a font
%#{$font-face-name} {
@include font($font-face-name, $font-style, $font-weight);
}
}
.test-block {
@extend %Helvetica-Neue;
}
@font-face {
font-family: "Helvetica-Neue";
font-weight: "normal";
font-style: "normal";
src: url("../fonts/helveticaneue.eot");
src: url("../fonts/helveticaneue.eot?") format("eot"), url("../fonts/helveticaneue.woff") format("woff"), url("../fonts/helveticaneue.ttf") format("truetype");
}
.test-block {
font-family: "Helvetica-Neue", Helvetica, Arial, sans-serif;
font-style: "normal";
font-weight: "normal";
}
@font-face {
font-family: "Helvetica-Neue-Bold";
font-weight: 700;
font-style: "normal";
src: url("../fonts/helveticaneue-bold-webfont.eot");
src: url("../fonts/helveticaneue-bold-webfont.eot?") format("eot"), url("../fonts/helveticaneue-bold-webfont.woff") format("woff"), url("../fonts/helveticaneue-bold-webfont.ttf") format("truetype");
}
@font-face {
font-family: "Helvetica-Neue-Medium";
font-weight: 500;
font-style: "normal";
src: url("../fonts/helveticaneue-medium-webfont.eot");
src: url("../fonts/helveticaneue-medium-webfont.eot?") format("eot"), url("../fonts/helveticaneue-medium-webfont.woff") format("woff"), url("../fonts/helveticaneue-medium-webfont.ttf") format("truetype");
}
@font-face {
font-family: "Avant-Garde-Black";
font-weight: 700;
font-style: "normal";
src: url("../fonts/itcavantgardestd-bk-webfont.eot");
src: url("../fonts/itcavantgardestd-bk-webfont.eot?") format("eot"), url("../fonts/itcavantgardestd-bk-webfont.woff") format("woff"), url("../fonts/itcavantgardestd-bk-webfont.ttf") format("truetype");
}
@font-face {
font-family: "Avant-Garde-Bold";
font-weight: 500;
font-style: "normal";
src: url("../fonts/itcavantgardestd-bold-webfont.eot");
src: url("../fonts/itcavantgardestd-bold-webfont.eot?") format("eot"), url("../fonts/itcavantgardestd-bold-webfont.woff") format("woff"), url("../fonts/itcavantgardestd-bold-webfont.ttf") format("truetype");
}
@font-face {
font-family: "Avant-Garde-Demi";
font-weight: "normal";
font-style: "normal";
src: url("../fonts/itcavantgardestd-demi-webfont.eot");
src: url("../fonts/itcavantgardestd-demi-webfont.eot?") format("eot"), url("../fonts/itcavantgardestd-demi-webfont.woff") format("woff"), url("../fonts/itcavantgardestd-demi-webfont.ttf") format("truetype");
}
@font-face {
font-family: "Avant-Garde-XLT";
font-weight: 100;
font-style: "normal";
src: url("../fonts/itcavantgardestd-xlt-webfont.eot");
src: url("../fonts/itcavantgardestd-xlt-webfont.eot?") format("eot"), url("../fonts/itcavantgardestd-xlt-webfont.woff") format("woff"), url("../fonts/itcavantgardestd-xlt-webfont.ttf") format("truetype");
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment