Jasny-Bootstrap с использованием .offcanvas-sm в файле lessfile

Я хотел бы использовать .offcanvas-sm, который назначен элементу <nav> в файле Less. Файл Less выглядит так:

@import "../../jasny-bootstrap.less";
.test {
  .offcanvas-sm;
}

Проблема в том, что процессор Less говорит - класс offcanvas-sm не существует. Это из этого "https://github.com/jasny/bootstrap/blob/master/less/offcanvas.less" Меньший файл, включенный в "jasny-bootstrap.less". Но как я могу импортировать этот код в класс?


css twitter-bootstrap less jasny-bootstrap
person nPoday    schedule 20.11.2014    source источник

Ответы (1)


arrow_upward
2
arrow_downward

Компилятор здесь прав, действительно .offcanvas-sm не существует в контексте, в котором вы пытаетесь его вызвать. Ключевым словом здесь является Scope: селекторы, определенные в медиа-запросе, могут использоваться в качестве примеси только в этом же блоке медиа-запроса.

В этом конкретном случае extend поможет. Обработка области extend несколько ортогональна обработке миксинов, поэтому селекторы, определенные в блоках медиа-запросов, открыты для «расширения» из внешней области (но не наоборот):

.test {
    &:extend(.offcanvas-sm all);
}

Или просто:

.test:extend(.offcanvas-sm all) {

}

---

В этом случае необходимо ключевое слово all, поскольку стиль .offcanvas-sm на самом деле представляет собой набор два набора правил: .offcanvas-sm и .offcanvas-sm.in

person seven-phases-max    schedule 20.11.2014
comment
Спасибо, первое решение было именно тем, что мне было нужно :) - person nPoday; 20.11.2014