.tiles_layout_wide
Слева нас отталкивает только шапка.
Это позиционирующий блок для .unit`ов (подобно блоку .bricklayer для .item). Используется только на десктопах, только на 1340+. Детектим ширину, если она строго меньше чем 1340px, то используем .item`ы с .bricklayout`ами. Если включительно больше, то фигачим вот эти вот .unit`ы с .tiles.
Тут есть проблема с тем, какие ширины давать плиткам. Ширина одного айтема должна считаться от ширины родителя, например 25% для 4 столбцов, 20% для 5 столбцов и т.д. И эти ширины надо перестраивать в зависимости от ширины родителя. Например если родитель 700px, то можно вместить три плитки. Если ширина 1000px, то можно вместить четыре. И, к сожалению, у нас нет возможности писать медиа-запросы от ширины родителя.
Зато есть возможность писать запросы от ширины экрана. Получается, что надо два источника информации:
1) Ширина экрана, которую мы узнаю медиа-запросами
2) Ширина родителя, которую мы знаем из макетов, мы знаем какие блоки какой ширины могут быть
в каком контексте. Эту инфу добавляем в верстку модификаторами _layout_
Пока что у нас есть два вида плиток:
.tiles_layout_narrow - это сплющенная плитка, работает тогда, когда у нас включены
шапка и оба сайдбара.
.tiles_layout_wide - широкая плитка, когда включена только шапка. Например, страница поиска.
Без этих модификаторов у айтемов плитки будет просто статичная ширина в 220px. Такой замес есть только у плиток. У bricklayer все без проблем.
Слева нас отталкивает только шапка.
Слева шапка и сайдбар, справа эсайд - полный комплект.
