feat(visual): updated new theming guide, used default theme selector in dev

NikGurev · NikGurev · commit 6a36d008e24c · 2024-09-04T13:29:46.000+03:00
diff --git a/docs/guides/theming-2.0.md b/docs/guides/theming-2.0.md
@@ -5,7 +5,7 @@
 ### Как использовать?
 
 1. Импортируйте компонент
-2. Просто добавьте класс `kbq-light` к элементу <body> вашего HTML-документа для использования светлой темы и `kbq-dark` для темной темы.
+2. Добавьте `kbq-theme-light` селектор к элементу `<body>` вашего HTML-документа для использования светлой темы и `kbq-theme-dark` для темной темы.
 
 Для переключения тем используйте [ThemeService.](https://github.com/koobiq/angular-components/blob/main/packages/components/core/services/theme.service.ts#L24)
 
@@ -22,7 +22,7 @@
 
 ### Как задать кастомные значения компоненту дизайн-системы?
 
-Изменить цвета, размеры и шрифты можно задав соответствующие значения css-переменным компонента.
+Изменить цвета, размеры и шрифты можно задав соответствующие значения CSS-переменным компонента.
 Например:
 
 ```css
@@ -32,10 +32,19 @@
 }
 ```
 
+### Совместимость
+
+Работает стабильно с `@koobiq/design-tokens@3.4.0`.
+
+### Как применить уже имеющиеся кастомные дизайн-токены?
+
+Темы, где значения дизайн-токенов были перезаписаны с помощью Style-Dictionary,
+применяются аналогично [заданию кастомных значений компонентам.](#как-задать-кастомные-значения-компоненту-дизайн-системы)
+
 ### Откуда теперь брать значения дизайн-токенов для компонентов?
 
-Все актуальные значения для компонентов хранятся в репозитории [@koobiq/design-tokens](https://github.com/koobiq/design-tokens). В репозитории Angular-компонентов затем преобразуются в CSS-переменные.
-Хранение дизайн-токенов в отдельном репозитории позволяет переиспользовать их в других проектах. Сгенерированные на основе дизайн-токенов CSS-переменные позволяет более удобно использовать компоненты и ускоряют их разработку, в том числе проведение дизайн-ревью.
+Все актуальные значения для компонентов хранятся в репозитории [@koobiq/design-tokens](https://github.com/koobiq/design-tokens).
+Сгенерированные на основе дизайн-токенов CSS-переменные компонентов позволяют сделать их использование более удобным, а также ускорить их разработку, в том числе проведение дизайн-ревью.
 
 ### Что планируется сделать дальше?
 
diff --git a/packages/components-dev/index.html b/packages/components-dev/index.html
@@ -21,7 +21,7 @@
 
         <title>Dev Example</title>
     </head>
-    <body class="kbq-app-background kbq-light">
+    <body class="kbq-app-background kbq-theme-light">
         <app />
     </body>
 </html>
