scss spacing_02.scss

Posted 2021-05-17

:root {
    --space-unit: 16px;
    --space-xxs:  calc(0.25 * var(--space-unit)); // 4px
    --space-xs:   calc(0.5 * var(--space-unit));  // 8px
    --space-sm:   calc(0.75 * var(--space-unit)); // 12px
    --space-md:   calc(1.25 * var(--space-unit)); // 20px
    --space-lg:   calc(2 * var(--space-unit));    // 32px
    --space-xl:   calc(3.25 * var(--space-unit)); // 52px
    --space-xxl:  calc(5.25 * var(--space-unit)); // 84px
}