title: Font Face Mixin for Less
body: <p>Using Less I am defining font-families as follows:</p>
  
  <pre><code>@georgia: georgia, times, 'times new roman', 'nimbus roman no9 l', serif; 
  </code></pre>
  
  <p>Then I have the less mixin:</p>
  
  <pre><code>.font(@family: arial, @size: 1.0em, @lineheight: 1.0, @weight: normal, @style: normal, @variant: normal) {
    font: @style @variant @weight @size~"/"@lineheight @family;
  } // font
  </code></pre>
  
  <p>Finally I use it like this:</p>
  
  <pre><code>p {
    .font(@georgia, 1.0em, 1.5)
  }
  </code></pre>
  
  <p>But I would also like to define font families with custom fonts:</p>
  
  <pre><code>@something: 'custom-font', arial, ...;
  </code></pre>
  
  <p>But first I need to register custom-font:</p>
  
  <pre><code>@font-face {
    font-family: 'custom-font';
  src:url('fonts/custom-font.eot');
  src:url('fonts/custom-font.eot?#iefix') format('embedded-opentype'),
      url('fonts/custom-font.woff') format('woff'),
      url('fonts/custom-font.ttf') format('truetype'),
      url('fonts/custom-font.svg#icon') format('svg');
  font-weight: normal;
  font-style: normal;
  }
  </code></pre>
  
  <p>Is it possible to create a LESS mixin for <code>@font-face</code> so I can pass the font name and path and register fonts without repeating all this code?</p>
  
  <p>I am not sure how to integrate this with my font mixin ...</p>
  
  <p>Or if there is even a better way to do this ...</p>
  
  <p>Thank You,
  Miguel</p>