Тема Дзен
Тема оформления "Дзен" позволяет менять цвет контента областей страницы, существенную часть которых составляет изображение.
Для стилизации элементов, располагающихся на фоне некоторого изображения используется контейнер Controls/themes:ZenWrapper.
Подбор цвета темы осуществляется на основе двух параметров:
- доминантный цвет - преобладающий в гамме изображения цвет. Используется в качестве фона для области, к которой применили темизацию. В зависимости от него определяется, светлая или темная тема Дзен будет применена для контента темизируемой области.
- комплементарный цвет - контрастный цвет по отношению к доминантному. Применяется к элементам, которые необходимо акцентировать.
- яркость темы - в зависимости от цветовой гаммы изображения будет определена яркость темы - светлая или темная.
Доминантный цвет изображения определяется с помощью параметра DominantColor, который возвращает метод бизнес-логики DominantColorByURL.
Полученный цвет необходимо передать в качестве значения в опцию dominantColor.
<!-- WML -->
<Controls.themes:ZenWrapper
dominantColor="255, 255, 255" >
<ws:partial template="MyModule/someContent" />
</Controls.themes:ZenWrapper>
Комплементарный цвет изображения определяется с помощью параметра ComplimentaryColor, который возвращает метод бизнес-логики DominantColorByURL.
Полученный цвет необходимо передать в качестве значения в опцию complementaryColor.
<!-- WML -->
<Controls.themes:ZenWrapper
dominantColor="255, 255, 255"
complementaryColor="178, 35, 35" >
<ws:partial template="MyModule/someContent" />
</Controls.themes:ZenWrapper>
В зависимости от того, как был интерпретирован полученный доминантный цвет, определяется, светлая или темная тема "Дзен" будет применена для контента темизируемой области.
Яркость изображения определяется с помощью параметра IsDarkTheme, который возвращает метод бизнес-логики DominantColorByURL.
Чтобы определить, темным или светлым является доминантный цвет, установите значение для опции brightness.
<!-- WML -->
<Controls.themes:ZenWrapper
dominantColor="255, 255, 255"
complementaryColor="178, 35, 35"
brightness="light" >
<ws:partial template="MyModule/someContent" />
</Controls.themes:ZenWrapper>
Исходя из яркости темы, элементы будут перекрашиваться по-разному (для тёмной темы цвет текста будет выбран из палитры светлых оттенков, а для светлой темы - из тёмных).