less.css: ссылки на другие определения стиля?

Question

Можно ли ссылаться на другие определения стиля? Например, если у меня есть стиль btn, подобный этому:

.btn {
    width: 150px;
}

Можно ли ссылаться на .btn width где-то еще? Например, что-то вроде:

#right_of_buttons {
    left: @{.btn.width} * 3; // ie, instead of hard-coding 150px * 3
}

Я знаю, что это можно сделать, определив переменную:

@btn_width: 150px;
.btn { width: @btn_width }

Но я бы предпочел этого не делать, если мне не нужно.

Answer 1

Если я не ошибаюсь в исходном LESS, вы можете сослаться на свойства конкретного селектора:

#right_of_buttons {
  left: .btn[width] * 3;
}

Но это было исключено в версии .js.Вместо этого вы можете использовать переменную:

@btnwidth: 150px;
.btn {
  width: @btnwidth;
}
#sidebar {
  left: @btnwidth * 3;
}

Answer 2

Не проверено, но в соответствии с документацией, вы можете включить javascript напрямую, поэтому

#right_of_buttons {
   left: `document.getElementsByClassName('.btn')[0].style.width`
}

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