LESS CSS Передать миксин в качестве параметра другому миксину

Есть ли способ передать объявление одного миксина или стиля другому миксину в качестве входного параметра?

Давайте рассмотрим пример с ключевыми кадрами анимации. Ниже показано, как мы определяем ключевые кадры в чистом CSS :

@-moz-keyframes some-name
{
    from { color: red; }
    to { color: blue; }
}

@-webkit-keyframes some-name
{
    from { color: red; }
    to { color: blue; }
}

@keyframes some-name
{
    from { color: red; }
    to { color: blue; }
}

. Идея состоит в том, чтобы упростить эти объявления с помощью примесей, чтобы мы могли получить что-то вроде следующего:

.keyframes(name, from, to)
{
    // here we need somehow to reproduce structure
    // that we have in an example above
}

// define one animation
.my-from() { color: red; }
.my-to() { color: blue; }
// the following won't work because you cannot pass mixin as a parameter
// in way I have here, so I am looking for a way to solve this problem
.keyframes('some-name',.my-from,.my-to);

// define another animation
.another-from() { font-size: 1em; }
.another-to() { font-size: 2em; }
.keyframes('another-name',.another-from,.another-to);

В системе будут разные модули, которые можно динамически прикреплять к приложению, а также удалять. Так что не предлагайте мне использовать @import, потому что это не так. Выходной CSS динамически компилируется -на лету с использованием информации о модулях и их собственных LESS-стилях, а также базовых LESS-зависимостей, таких как библиотека примесей и т. д.

Обратите внимание, :для меня это сработает, если вы знаете способ передачи определения класса вместо примеси. В приведенном выше примере это будет .my-fromвместо .my-from()и т. д.

16
задан alex 28 April 2015 в 06:07
поделиться