Skip to content

Instantly share code, notes, and snippets.

@davidsmith2
Created April 17, 2014 20:17
Show Gist options
  • Save davidsmith2/11009102 to your computer and use it in GitHub Desktop.
Save davidsmith2/11009102 to your computer and use it in GitHub Desktop.
Generated by SassMeister.com.
<p class="museoOne"><em>Test</em></p>
// ----
// Sass (v3.3.5)
// Compass (v1.0.0.alpha.18)
// ----
// configuration
$fonts:
museoOne 100,
museoThree 300,
museoFive 500,
museoSeven 700,
museoNine 900;
// abstract mixins (define rules)
@mixin Import($fontName, $fontWeight, $fontPrefix, $fontDir) {
font-family: $fontName;
src: url(#{$fontDir}/#{$fontPrefix}_#{$fontWeight}.eot);
src: url(#{$fontDir}/#{$fontPrefix}_#{$fontWeight}.eot?#iefix) format('embedded-opentype'),
url(#{$fontDir}/#{$fontPrefix}_#{$fontWeight}.otf) format('opentype');
}
@mixin Apply($fontName, $fontStyle) {
font-family: $fontName, sans-serif;
font-style: $fontStyle;
font-variant: normal;
font-weight: normal !important;
-webkit-font-smoothing: antialiased;
}
// concrete mixins (apply rules)
@mixin import($fontName, $fontWeight) {
@font-face {
@include Import($fontName, $fontWeight, museosans, fonts);
}
}
@mixin apply($fontName, $fontStyle) {
@if $fontStyle == normal {
.#{$fontName},
.#{$fontName}:link,
a.#{$fontName} {
@include Apply($fontName, $fontStyle);
}
}
@if $fontStyle == italic {
.#{$fontName} i,
.#{$fontName} em,
.#{$fontName}.italic,
.#{$fontName} .italic,
.italic .#{$fontName} {
@include Apply($fontName + Italic, $fontStyle);
}
}
}
// executing function
@mixin main() {
@each $font in $fonts {
$fontName: nth($font, 1);
$fontWeight: nth($font, 2);
@include import($fontName, $fontWeight);
@include import($fontName, $fontWeight + _italic);
@include apply($fontName, normal);
@include apply($fontName, italic);
}
}
// execute
@include main();
@font-face {
font-family: museoOne;
src: url(fonts/museosans_100.eot);
src: url(fonts/museosans_100.eot?#iefix) format("embedded-opentype"), url(fonts/museosans_100.otf) format("opentype");
}
@font-face {
font-family: museoOne;
src: url(fonts/museosans_100_italic.eot);
src: url(fonts/museosans_100_italic.eot?#iefix) format("embedded-opentype"), url(fonts/museosans_100_italic.otf) format("opentype");
}
.museoOne,
.museoOne:link,
a.museoOne {
font-family: museoOne, sans-serif;
font-style: normal;
font-variant: normal;
font-weight: normal !important;
-webkit-font-smoothing: antialiased;
}
.museoOne i,
.museoOne em,
.museoOne.italic,
.museoOne .italic,
.italic .museoOne {
font-family: museoOneItalic, sans-serif;
font-style: italic;
font-variant: normal;
font-weight: normal !important;
-webkit-font-smoothing: antialiased;
}
@font-face {
font-family: museoThree;
src: url(fonts/museosans_300.eot);
src: url(fonts/museosans_300.eot?#iefix) format("embedded-opentype"), url(fonts/museosans_300.otf) format("opentype");
}
@font-face {
font-family: museoThree;
src: url(fonts/museosans_300_italic.eot);
src: url(fonts/museosans_300_italic.eot?#iefix) format("embedded-opentype"), url(fonts/museosans_300_italic.otf) format("opentype");
}
.museoThree,
.museoThree:link,
a.museoThree {
font-family: museoThree, sans-serif;
font-style: normal;
font-variant: normal;
font-weight: normal !important;
-webkit-font-smoothing: antialiased;
}
.museoThree i,
.museoThree em,
.museoThree.italic,
.museoThree .italic,
.italic .museoThree {
font-family: museoThreeItalic, sans-serif;
font-style: italic;
font-variant: normal;
font-weight: normal !important;
-webkit-font-smoothing: antialiased;
}
@font-face {
font-family: museoFive;
src: url(fonts/museosans_500.eot);
src: url(fonts/museosans_500.eot?#iefix) format("embedded-opentype"), url(fonts/museosans_500.otf) format("opentype");
}
@font-face {
font-family: museoFive;
src: url(fonts/museosans_500_italic.eot);
src: url(fonts/museosans_500_italic.eot?#iefix) format("embedded-opentype"), url(fonts/museosans_500_italic.otf) format("opentype");
}
.museoFive,
.museoFive:link,
a.museoFive {
font-family: museoFive, sans-serif;
font-style: normal;
font-variant: normal;
font-weight: normal !important;
-webkit-font-smoothing: antialiased;
}
.museoFive i,
.museoFive em,
.museoFive.italic,
.museoFive .italic,
.italic .museoFive {
font-family: museoFiveItalic, sans-serif;
font-style: italic;
font-variant: normal;
font-weight: normal !important;
-webkit-font-smoothing: antialiased;
}
@font-face {
font-family: museoSeven;
src: url(fonts/museosans_700.eot);
src: url(fonts/museosans_700.eot?#iefix) format("embedded-opentype"), url(fonts/museosans_700.otf) format("opentype");
}
@font-face {
font-family: museoSeven;
src: url(fonts/museosans_700_italic.eot);
src: url(fonts/museosans_700_italic.eot?#iefix) format("embedded-opentype"), url(fonts/museosans_700_italic.otf) format("opentype");
}
.museoSeven,
.museoSeven:link,
a.museoSeven {
font-family: museoSeven, sans-serif;
font-style: normal;
font-variant: normal;
font-weight: normal !important;
-webkit-font-smoothing: antialiased;
}
.museoSeven i,
.museoSeven em,
.museoSeven.italic,
.museoSeven .italic,
.italic .museoSeven {
font-family: museoSevenItalic, sans-serif;
font-style: italic;
font-variant: normal;
font-weight: normal !important;
-webkit-font-smoothing: antialiased;
}
@font-face {
font-family: museoNine;
src: url(fonts/museosans_900.eot);
src: url(fonts/museosans_900.eot?#iefix) format("embedded-opentype"), url(fonts/museosans_900.otf) format("opentype");
}
@font-face {
font-family: museoNine;
src: url(fonts/museosans_900_italic.eot);
src: url(fonts/museosans_900_italic.eot?#iefix) format("embedded-opentype"), url(fonts/museosans_900_italic.otf) format("opentype");
}
.museoNine,
.museoNine:link,
a.museoNine {
font-family: museoNine, sans-serif;
font-style: normal;
font-variant: normal;
font-weight: normal !important;
-webkit-font-smoothing: antialiased;
}
.museoNine i,
.museoNine em,
.museoNine.italic,
.museoNine .italic,
.italic .museoNine {
font-family: museoNineItalic, sans-serif;
font-style: italic;
font-variant: normal;
font-weight: normal !important;
-webkit-font-smoothing: antialiased;
}
<p class="museoOne"><em>Test</em></p>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment