Sass mixin for webfont embedding
Posted by info on November 16th, 2013
// example @include webfont("MyFontname-Regular","fonts","myfontname-regular","italic","300");
@mixin webfont($font-family,$font-url,$font-name,$style: normal, $weight: normal){
@font-face {
font: {
family: $font-family;
style: unquote($style);
weight: unquote($weight);
}
src: url($font-url + '/' + $font-name + '.eot'); //IE9
src: url($font-url + '/' + $font-name + '.eot?#iefix') format("embedded-opentype"), //IE6-8
url($font-url + '/' + $font-name + '.woff') format("woff"), // modern browsers
url($font-url + '/' + $font-name + '.ttf') format("truetype") // safari android ios
url($font-url + '/' + $font-name + '.svg#' + $font-name) format("svg"); //legacy ios
}
}