@lagudal

Можно ли как то группировать стили по медиа запросам в Magento2?

Дано:
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 чтобы группировались стили?
  • Вопрос задан
  • 76 просмотров
Пригласить эксперта
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Похожие вопросы