Spacing
Function: pds-spacing
pds-spacing(name)
name- refers to a spacing name, like 'huge'
Example:
<![CDATA[
h1 {
margin: pds-spacing(huge) pds-spacing(none);
}
]]>
$pds-spacings are defined as a map, like
<![CDATA[
$pds-spacings: (
none: 0,
tiny: 4px,
xxs: 8px,
xs: 12px,
s: 16px,
default: 20px,
m: 24px,
l: 32px,
xl: 48px,
xxl: 56px,
huge: 64px
);
]]>
You can add your own spacing by adding entries to the map:
<![CDATA[
@use "sass:map";
$pds-spacings: map.set($pds-spacings, header-large, 4rem);
$pds-spacings: map.set($pds-spacings, footnote, .5rem);
]]>