{% macro renderSpacings(spacings, device) %}
    {% for name in spacings %}
        {{ _self.renderSpacingClasses(name, device) }}
    {% endfor %}
{% endmacro %}
{% macro renderSpacingClasses(name, device) %}
    .moto-spacing-top-{{ name }} { padding-top: @spacing_{{ device }}_{{ name }}; }
    .moto-spacing-bottom-{{ name }} { padding-bottom: @spacing_{{ device }}_{{ name }}; }
    .moto-spacing-left-{{ name }} { padding-left: @spacing_{{ device }}_{{ name }}; }
    .moto-spacing-right-{{ name }} { padding-right: @spacing_{{ device }}_{{ name }}; }
{% endmacro %}
{% set devicesWhiteList = StyleHelper.getDevicesList() %}

{% for device, spacings in extra_spacings if device in devicesWhiteList %}
    {% if device != 'desktop' %}
    @media screen and (max-width: @const_media_{{ device }}_max_width) {
    {% endif %}

        {{ _self.renderSpacings(spacings, device) }}

    {% if device != 'desktop' %}
    }
    {% endif %}
{% endfor %}
