Timber Shopify Theme Push / Pull столбцы в зависимости от размера экрана

Question

Застрял в этом html-шаблоне shopify, который использует фреймворк Timber CSS. https://github.com/Shopify/Timber/blob/master/assets/timber.scss.liquid

Мне нужно поменять местами два деления с классом

grid__item

если пользователь находится на мобильном устройстве.

Ниже приведен код, который у меня есть. Я понятия не имею, как сделать обмен. Я полагаю, что в начальной загрузке это называется push / pull?

<div class="grid">
  <div class="grid__item one-half medium-down--one-whole">1</div>
  <div class="grid__item one-half medium-down--one-whole">2</div>
</div>

В мобильном я бы хотел, чтобы div с «2» показывался сначала, а затем «1».

Answer 1

Древесина имеет опции для толкания и вытягивания

https://github.com/Shopify/Timber/blob/master/assets/timber.scss.liquid#L38

Таким образом, чтобы добиться изменения порядка на мобильном устройстве, вы должны либо поместить элементы в разметке для рабочего стола, сделать push and pull, либо использовать flexbox, добавив пользовательские стили в файлы .scss вашей темы