2015-03-06 3 views
2

Я пытаюсь использовать амперсанд принести родительских селекторов в переменную, содержащую псевдо-селекторов класса:Можно ли ссылаться на родительский селектор в переменной LESS?

.my-selector, 
.my-other-selector { 
    @{pseudo-states} { 
    // rules 
    } 
} 

Последующие попытки все произведенные дословное содержание переменной в созданном CSS:

@pseudo-states: &:hover, &:focus, &:active, &.active; 
@pseudo-states: ~"&:hover, &:focus, &:active, &.active"; 
@pseudo-states: ~"\&:hover, \&:focus, \&:active, \&.active; 

Любой способ добиться этого?

Кажется, что LESS просто не обрабатывает содержимое переменных, поэтому этот вопрос может прийти к тому, есть ли способ изменить это.

+0

Нет, ни амперсанд, ни запятая имеет специальное значение в интерполированном переменном. Возможные обходные пути см., Например, http://stackoverflow.com/questions/23935102. –

+0

@ShawnErquhart Да, щедрость, вероятно, привлечет больше внимания, и, возможно, вы получите ответ. В то же время, посмотрите, поможет ли этот [образец] (http://codepen.io/anon/pen/KwGzpP) любой бит. Я не добавляю это как ответ, потому что он не соответствует вашим требованиям 100%, но сделаю это, если вы пожелаете. – Harry

+0

Спасибо за живой пример - это действительно работает, но он по-прежнему ненормативный. На самом деле надеемся использовать простую встроенную замену для селекторов. –

ответ

4

Принятие одного из примеров, связанных в комментариях выше, здесь самый (до сих пор) чистое решение:

// usage: 

.my-selector, 
.my-other-selector { 
    .pseudo-states({ 
     /* rules */ 
    }); 
} 

// impl.: 

.pseudo-states(@-) { 
    &:hover, &:focus, &:active, &.active {@-();} 
} 
+0

Да, я знаю, что в качестве альтернативы я использую mixin, и это то, что мне, видимо, придется делать, но это похоже на излишний перекус для использования нескольких простых селекторов. Написал вопрос, надеясь, что какой-то гений там будет лучшим решением. Спасибо за предложение, однако, за это. –

+1

. Часть использования составляет всего 1 символ больше по сравнению с возможным синтаксисом интерполяции выбора.) –

+0

Это не длина, с которой я сталкиваюсь, это расхождение синтаксиса путем включения набора правил в parens + curlies. Хотелось бы приблизиться к фактическому css, а не дальше от него. –