Могу ли я использовать параметры url в LESS css?

Введение:

Я тестирую LESS в среде asp.net mvc.

Я использую dotless для обработки на стороне сервера (и я бы не хотел использовать обработку на стороне клиента, особенно для публикации полного проекта).

Мне нужно применить дизайн, где есть разные цветовые схемы в зависимости от разных вещей (например, время дня).

Менее ощутимо мощным в этом случае, поскольку проектирование параметризованного css и изменение только 10 переменных в начале файла для каждой темы действительно подняли.

Проблема:

Но мне нужно каким-то образом изменить цветные темы из внешнего параметра.

Идеи:

Сначала я подумал, что параметр URL, такой как style.less? theme = fuschia, был бы хорош, но я не нашел возможности разобрать что-то вроде этого.

Затем я подумал, что создание очень короткого синего цвета. green.less, orange.less, состоящий только из объявленных цветовых переменных и включая main.less в каждом из них, будет твердым решением.

У меня не было возможности опробовать второе решение, но я подумал, что сейчас самое подходящее время, чтобы попросить совета относительно наиболее надежного способа сделать это.

Проблема снова заключается в следующем: я хочу контролировать некоторые вещи из моего меньшего файла снаружи.

Ответ 1

Да, вы можете (потому что я реализовал эту функцию именно по этой причине).

Dotless поддерживает параметры извне через параметр querystring.

<link rel="stylesheet" href="style.less?foo=bar" />

Позволяет использовать следующее:

@foo = bar;

Код инъекции параметров очень прост. он просто добавляет объявления переменных в ваш обычный файл меньшего размера, поэтому все, что появляется в качестве параметра querystring, будет следовать указанному выше синтаксису.

Этот код очень прост: https://github.com/dotless/dotless/blob/master/src/dotless.Core/Engine/ParameterDecorator.cs

Ответ 2

AFAIK, вы не можете передавать параметры для dotnetless для использования для компиляции.

Как предложение, почему бы просто не называть разные файлы меньше? Это довольно легко сделать, используя свойство Viewbag.

Чтобы сделать разные меньшие, вы сначала создаете меньше файлов с каждым набором цветов в них. Затем вы импортируете свой базовый файл css. dotnetless объединит определения цвета в родительском файле с обычаями в базовом файле. Итак, у вас есть что-то вроде -

@baseGray: #ddd;
@baseGrayDark: darken(@baseGray, 15%);
@baseGrayLight: lighten(@baseGray, 10%);
@import "baseCss.less";

Я только что тестировал этот проект и проект MVC3, и он работает.