Мультитемизация

В некоторых приложениях на одной странице может использоваться несколько тем.

Для поддержки мультитемизации на странице к верстке каждого контрола должны применяться стили из его темы. Для этого необходимо задать опцию theme для контрола.

В данном примере одна и та же кнопка в разных темах оформления темизируется по-разному.

В результате указания опции theme на нужные контейнеры будут навешаны классы, верстка будет выглядеть так:

<!-- WML -->
<div class="controls_theme-light">
   <div class="controls_theme-dark">
      <button>
         ...
      </button>
   </div>
   <button>
      ...
   </button>
</div>

Благодаря тому, что кнопка сверстана при помощи css-переменных:

/* CSS */
.controls-button {
   background-color: var(--background-color);
}

А также на разных классах .controls_theme-light и .controls_theme-dark задано разное значение переменной, кнопка отображается в разном цвете.