Дано:
Magento2 с дефолтной темой blank, все таки приходится писать стили в less и компилировать в css штатными средствами магенто, ну то есть static-content: deploy etc.
Штатно же css на выходе минимизируется, но я что я не нашел, так это возможности как то это дело организовать по медиа-запросам по примеру
group-css-media-queries.
В обычной верстке проблем нет - данный плагин есть в gulp версии, есть для webpack. Есть опыт работы с gulp и Magento sass темой, там все это без труда реализуется.
Однако в силу решения команды работать в основном приходится только с официальной magento, а там, как уже говорил, только less...
Поэтому приходится в less строго смотреть за структурой файла, т.е. следить за порядком, какие медиа-запросы вначале, какие следующие, какие в конце. Коллега заранее размечает less файл таким образом, чтобы не было ошибки в этом порядке.
Мне это не очень нравится, так как по факту исходные less раздуваются. Как пример, такой код
.page-wrapper {
.nav-sections {
.ves-megamenu {
.navigation {
ul {
:nth-child(-n+10) {
a {
white-space: pre-wrap;
span {
line-height: 1.5em;
vertical-align: middle;
text-align: center;
@media only screen and (max-width: 1023px) {
font-size: 11px;
}
}
}
}
}
}
}
}
}
придется или писать всю цепочку два раза, ради одного селектора в одном медиа запросе, или плюнуть и писать тупо сразу в css, как вышеозначенная коллега и делает.
Возможно, кто то встречал решение для magento чтобы группировались стили?
Простой
