Foundation-sites: How do we map-deep-get() values from $header-styles in 6.3?

Created on 9 Jan 2017  路  2Comments  路  Source: foundation/foundation-sites

Before if I wanted to pull a font-size into a custom component I could do something like the following: font-size: rem-calc(map-deep-get($header-sizes, small, h1));

The following (markup might be wrong for nesting another level?) doesn't work in 6.3: font-size: rem-calc(map-deep-get($header-styles, small, font-size, h1)); gives me the following error:

`Error in plugin 'sass'
Message:
    bower_components/foundation-sites/scss/util/_value.scss
Error: argument `$map` of `map-get($map, $key)` must be a map

       Backtrace:
        bower_components/foundation-sites/scss/util/_value.scss:104, in function `map-get`
        bower_components/foundation-sites/scss/util/_value.scss:104, in function `map-deep-get`
        bower_components/foundation-sites/scss/ucla/_form-tweaks.scss:7
        on line 104 of bower_components/foundation-sites/scss/util/_value.scss
>>     $map: map-get($map, $key);
   ----------^

https://github.com/zurb/foundation-sites/issues/7826

question scss

Most helpful comment

See: scss/typography/_base.scss:55:

$header-styles: (
  small: (
    'h1': ('font-size': 24),
    'h2': ('font-size': 20),
    'h3': ('font-size': 19),
    ...
  ),
  ...
);

So you should search in : small -> h1 -> font-size:
map-deep-get($header-styles, small, h1, font-size).

All 2 comments

See: scss/typography/_base.scss:55:

$header-styles: (
  small: (
    'h1': ('font-size': 24),
    'h2': ('font-size': 20),
    'h3': ('font-size': 19),
    ...
  ),
  ...
);

So you should search in : small -> h1 -> font-size:
map-deep-get($header-styles, small, h1, font-size).

...... yeah I should have caught that.

Was this page helpful?
0 / 5 - 0 ratings