oddbird / accoutrement-type

Font helpers
MIT License
2 stars 1 forks source link

Errors while setting up accoutrement-type #8

Closed pixelpanik closed 6 years ago

pixelpanik commented 6 years ago

Thanks for your work on these helpers. I'm struggling getting accoutrement-type to work.

This is my configuration:

// Define what webfont formats need importing
$font-formats: 'woff' 'woff2';

// Set the a path to your fonts directory
$font-path: '../../fonts/';

$fonts: (
  // describe locally-hosted font files for import and access
  'heading': (
    'name': 'rajdhani',
    'stack': ('helvetica', 'arial', sans-serif),
    'normal': 'rajdhani/rajdhani-v7-latin-regular',
    'bold': 'rajdhani/rajdhani-v7-latin-700',
  ),
);

// Import one font by configuration key, with custom formats
@include font-face('heading', 'woff' 'woff2');

// Import all local fonts
//@include import-webfonts;

When I'm importing one font this error is thrown: Error: wrong number of arguments (2 for 1) for `font-face' on line 18 of sass/base/_type.scss >> @include font-face('heading', 'woff' 'woff2');

When I'm importing all local fonts this error is thrown: Error: (rajdhani) Font-path interpolation requires a list of `formats` to import. on line 490 of node_modules/accoutrement-type/sass/_helpers.scss >> @error '(#{$name}) Font-path interpolation ' + ----^

Could you please explain why those errors come up and how to fix it? Thanks in advance!

Sev

mirisuzanne commented 6 years ago

It looks like you just did a major upgrade, which included some breaking changes. Check out the changelog for all changes in 4.0.0. The quick rundown is that we eliminated the $font-formats global, as well as the $formats argument, and moved that information into the data map. You can set that with various levels of granularity, but the simplest upgrade path look like this:

// Set the a path to your fonts directory
$font-path: '../../fonts/';

$fonts: (
  // describe locally-hosted font files for import and access
  'heading': (
    'name': 'rajdhani',
    'stack': ('helvetica', 'arial', sans-serif),
    'formats': ('woff', 'woff2'),
    'normal': 'rajdhani/rajdhani-v7-latin-regular',
    'bold': 'rajdhani/rajdhani-v7-latin-700',
  ),
);

// Import one font by configuration key, with custom formats
@include font-face('heading');

// Import all local fonts
//@include import-webfonts;
pixelpanik commented 6 years ago

Ah, thank you, now it's working. Excellent!