Медиадархостҳо дар LESS

Биёед функсияе созем, ки ба элемент медиадархост-ро илова мекунад. Барои мисол, бигзор ин дархости танзимкунандаи услубҳо барои дастгоҳҳои мобилӣ бошад. Функсияи худро мувофиқан номгузорӣ кунем:

styles.less.mobile(@code) {

}

Функсияи мо параметр блоки кодро қабул мекунад. Биёед ин блокро дар дохили медиадархост бароварем:

styles.less.mobile(@code) {
  @media (max-width: 600px) {
    @code();
  }
}

Акнун аз функсияи худ истифода барем:

styles.lessdiv {
  .mobile({
    width: 300px;
  });
}

Дар натиҷаи компилятшавӣ, диви мо дар дохили медиадархост қарор мегирад, ки услубҳои мувофиқро мегирад:

styles.less@media (max-width: 600px) {
  div {
    width: 300px;
  }
}