Поддержка LESS CSS и SASS в Composite C1 CMS

Вы уже знаете, что стартовые сайты в Composite C1 4.0, созданы на основе Twitter Bootstrap и, помимо всего прочего, используют LESS.

LESS позволяет создавать "динамические" стили CSS, является надстройкой над последним, с поддержкой переменных, функций, миксинов и т.п.

Поддержка LESS в Composite С1 не встроена, но легко добавляется с помощью пакета расширения.

Если вы избалованы удобством надстроек на CSS, вы можете также использовать SASS, поддержка которого тоже добавляется в Composite C1 с помощью пакета расширения.

Как же именно включить поддержку LESS и SASS в Composite C1?

Для этого вам нужно установить два бесплатных пакета расширения (Система / Пакеты / Доступные пакеты / Composite.Web):

• Composite.Web.Css.Less
• Composite.Web.Css.Sass

После установки пакетов вы можете создавать файлы .less и .scss / .sass и использовать соответствующий синтаксис для создания стилей для вашего сайта.

Редактировать эти файлы вы можете в самой админке. (Обратите внимание, что редактирование .sass / .scss файлов в админке поддерживается только в версии 4.1 бета и выше).

Или можете воспользоваться сторонними инструментами. Например, расширение под Visual Studio:

• Mindscape Web Workbench

Подключаются эти файлы в шаблоны и веб-страницы точно также, как и обычные CSS-файлы:

<link rel="stylesheet" href="~/Frontend/Styles/styles1.less" type="text/css" />
<link rel="stylesheet" href="~/Frontend/Styles/styles2.scss" type="text/css" />