{{ snippet.infolabel('Primary Mixin' )}}
{{ snippet.mixin('fondation-flex-classes') }}

{{ snippet.infolabel('Variables') }}
{{ snippet.sassvar ('flex-source-ordering-count-enable') }}
{{ snippet.sassvar('flex-source-ordering-count') }}
{{ snippet.sassvar('flexbox-responsive-breakpoints') }}

{{ snippet.infolabel('Info') }}
{% call snippet.infocontent() %}
    If you set the variable: {{ snippet.sassvar('global-flexbox') }} to <strong>true</strong> in addition to the XY-Grid, there are flexbox utilities. They can be integrated with the XY-Grid as explained on <a href="https://foundation.zurb.com/sites/docs/flexbox-utilities.html" target="_blank">this page</a>. <br /> In addition to these classes, has been added the possibility to enable or not the <a href="https://foundation.zurb.com/sites/docs/flexbox-utilities.html#source-ordering" target="_blank">source ordering</a>.
    Here are some examples of use with the classes to be called in our templates. <br /> The classes in these examples were applied only to the parent container.
{% endcall %}