readme.md

#font-loaded mixin

To be used along with the FontFaceObserver approach https://github.com/bramstein/fontfaceobserver

##Usage

// Example with global variables.
$safe-serif: Georgia, serif;
$custom-serif: 'Tiempos Text Bold', $safe-serif;

.element {
  @include font-loader($safe-serif, $custom-serif);
}

Which compiles in:

.element {
  font-family: Georgia, serif;
}

.fonts-loaded .element {
  font-family: "Tiempos Text Bold", Georgia, serif;
}

fontfaceobserver.scss

@mixin font-loaded($safe-family, $custom-family) {
  .fonts-loaded & {
    font-family: $custom-family;
  }
  
  font-family: $safe-family; 
}