Skip to content

v1.1.0 - Introduced the new mixin format

Compare
Choose a tag to compare
@Dan503 Dan503 released this 22 Dec 00:46
· 28 commits to master since this release

Old syntax

$fonts: (
  'Open Sans' : (
    300 : 'open-sans-light',
    400 : (
      normal : 'open-sans-normal',
      italic : 'open-sans-normal-italic'
    ),
    600 : 'open-sans-semibold',
    700 : 'open-sans-bold'
  )
);

@import '../node_modules/font-face-generator/generator';

New syntax

@import '../node_modules/font-face-generator/mixin';

@include font-face((
  'Open Sans' : (
    300 : 'open-sans-light',
    400 : (
      normal : 'open-sans-normal',
      italic : 'open-sans-normal-italic'
    ),
    600 : 'open-sans-semibold',
    700 : 'open-sans-bold'
  )
));

The new syntax allows for all new possibilities like this:

$font-file-types: 'woff2' 'woff';

@include font-face(
  $fonts: (
    'Open Sans' : (
      300 : 'open-sans-light'
    )
  )
);

@include font-face(
  $fonts: (
    'Another Font' : (
      400 : 'other-normal'
    )
  ),
  $types: 'woff'
);

And this:

@include font-face((
  'Open Sans' : (
    300 : 'open-sans-light', 
    400 : (
      normal : 'open-sans-normal', 
      italic : 'open-sans-normal-italic' 
    ), 
    600 : 'open-sans-semibold',
    700 : 'open-sans-bold'
  )
)){
  unicode-range: U+0025-00FF;
};