Использование готовых элементов и цвета темы

Решение использует библиотеку Bootstrap версии 4, поэтому вы можете использовать все его возможности в создании своих кастомных элементов.

Но некоторые стандартные элементы стилизованы под решение. Например, формы и кнопки.

Доступны следующие виды кнопок:

btn-primary
btn-transparent
btn-white

Использование цвета темы

Для использования цвета текущей темы есть целый набор классов. Каждый используется для чего-то одного. В этой статье приведен список таких классов.

Названия всех классов начинаются с префикса theme-. Полный список классов можно посмотреть в файле /bitrix/templates/ranx-landing/themes/color.css.tpl.

Неполный список основных классов:

.theme-color - окрашивает текст в цвет темы
.theme-color-hover - цвет текста при наведении
.theme-bg - цвет фона
.theme-bg-hover - цвет фона при наведении
.theme-border - цвет границы
.theme-border-hover - цвет границы при наведении
.theme-fill и .theme-stroke (также и с -hover) для svg