@epam/assets 5.0.0 → 5.0.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (625) hide show
  1. package/css/theme/theme_loveship.css.map +1 -1
  2. package/css/theme/theme_promo.css +1 -1
  3. package/css/theme/theme_promo.css.map +1 -1
  4. package/css/theme/theme_vanilla_thunder.css +2 -2
  5. package/css/theme/theme_vanilla_thunder.css.map +1 -1
  6. package/icon-sources/12/account-multiple-plus.svg +3 -3
  7. package/icon-sources/12/action-account.svg +3 -3
  8. package/icon-sources/12/action-add.svg +3 -3
  9. package/icon-sources/12/action-calendar.svg +3 -3
  10. package/icon-sources/12/action-delete light.svg +3 -3
  11. package/icon-sources/12/action-delete.svg +4 -4
  12. package/icon-sources/12/action-drag_corner.svg +8 -8
  13. package/icon-sources/12/action-drag_indicator.svg +3 -3
  14. package/icon-sources/12/action-external_link.svg +3 -3
  15. package/icon-sources/12/action-eye-off.svg +11 -11
  16. package/icon-sources/12/action-eye.svg +4 -4
  17. package/icon-sources/12/action-flash.svg +3 -3
  18. package/icon-sources/12/action-history.svg +3 -3
  19. package/icon-sources/12/action-home.svg +3 -3
  20. package/icon-sources/12/action-job_function.svg +3 -3
  21. package/icon-sources/12/action-language.svg +3 -3
  22. package/icon-sources/12/action-lock-fill.svg +3 -3
  23. package/icon-sources/12/action-lock_open-fill.svg +3 -3
  24. package/icon-sources/12/action-map_pin.svg +3 -3
  25. package/icon-sources/12/action-schedule.svg +4 -4
  26. package/icon-sources/12/action-search.svg +3 -3
  27. package/icon-sources/12/action-settings.svg +3 -3
  28. package/icon-sources/12/action-tune.svg +3 -3
  29. package/icon-sources/12/add-below.svg +4 -4
  30. package/icon-sources/12/bell-off-outline.svg +10 -10
  31. package/icon-sources/12/bell-off.svg +10 -10
  32. package/icon-sources/12/bell-outline.svg +3 -3
  33. package/icon-sources/12/bell.svg +3 -3
  34. package/icon-sources/12/blacklist.svg +3 -3
  35. package/icon-sources/12/certificate.svg +3 -3
  36. package/icon-sources/12/chart-multiline.svg +3 -3
  37. package/icon-sources/12/communication-phone_mobile.svg +3 -3
  38. package/icon-sources/12/content-add-fill.svg +3 -3
  39. package/icon-sources/12/content-clear.svg +3 -3
  40. package/icon-sources/12/content-edit.svg +3 -3
  41. package/icon-sources/12/copy_content.svg +3 -3
  42. package/icon-sources/12/core-skill.svg +3 -3
  43. package/icon-sources/12/cv.svg +3 -3
  44. package/icon-sources/12/empty.svg +3 -3
  45. package/icon-sources/12/fav & rates-favorite.svg +3 -3
  46. package/icon-sources/12/file-attachment.svg +3 -3
  47. package/icon-sources/12/file-download.svg +3 -3
  48. package/icon-sources/12/file-export.svg +4 -4
  49. package/icon-sources/12/file-import.svg +4 -4
  50. package/icon-sources/12/file-upload.svg +3 -3
  51. package/icon-sources/12/grow.svg +4 -4
  52. package/icon-sources/12/in_progress-status.svg +16 -16
  53. package/icon-sources/12/interest.svg +3 -3
  54. package/icon-sources/12/linkedin.svg +3 -3
  55. package/icon-sources/12/medal.svg +4 -4
  56. package/icon-sources/12/na.svg +6 -6
  57. package/icon-sources/12/navigation-arrow-down.svg +3 -3
  58. package/icon-sources/12/navigation-arrow-left.svg +3 -3
  59. package/icon-sources/12/navigation-arrow-right.svg +3 -3
  60. package/icon-sources/12/navigation-arrow-up.svg +3 -3
  61. package/icon-sources/12/navigation-back.svg +4 -4
  62. package/icon-sources/12/navigation-chevron-down.svg +3 -3
  63. package/icon-sources/12/navigation-chevron-left.svg +3 -3
  64. package/icon-sources/12/navigation-chevron-left_left.svg +4 -4
  65. package/icon-sources/12/navigation-chevron-right.svg +3 -3
  66. package/icon-sources/12/navigation-chevron-right_right.svg +4 -4
  67. package/icon-sources/12/navigation-chevron-up.svg +3 -3
  68. package/icon-sources/12/navigation-close.svg +3 -3
  69. package/icon-sources/12/navigation-close_bold.svg +3 -3
  70. package/icon-sources/12/navigation-login.svg +3 -3
  71. package/icon-sources/12/navigation-logout.svg +3 -3
  72. package/icon-sources/12/navigation-menu.svg +3 -3
  73. package/icon-sources/12/navigation-more_horiz.svg +3 -3
  74. package/icon-sources/12/navigation-more_vert.svg +3 -3
  75. package/icon-sources/12/navigation-refresh.svg +3 -3
  76. package/icon-sources/12/navigation-unfold-less.svg +3 -3
  77. package/icon-sources/12/navigation-unfold-more.svg +3 -3
  78. package/icon-sources/12/none.svg +4 -4
  79. package/icon-sources/12/not-recommended.svg +3 -3
  80. package/icon-sources/12/notification-check-fill.svg +3 -3
  81. package/icon-sources/12/notification-done.svg +3 -3
  82. package/icon-sources/12/notification-error-fill.svg +3 -3
  83. package/icon-sources/12/notification-help-fill.svg +3 -3
  84. package/icon-sources/12/notification-info-fill.svg +3 -3
  85. package/icon-sources/12/notification-warning-fill.svg +3 -3
  86. package/icon-sources/12/open-status.svg +10 -10
  87. package/icon-sources/12/optional-skills.svg +3 -3
  88. package/icon-sources/12/ready-to.svg +3 -3
  89. package/icon-sources/12/social-person.svg +3 -3
  90. package/icon-sources/12/text-format.svg +3 -3
  91. package/icon-sources/18/account-multiple-plus.svg +3 -3
  92. package/icon-sources/18/action-account.svg +3 -3
  93. package/icon-sources/18/action-add.svg +3 -3
  94. package/icon-sources/18/action-calendar.svg +3 -3
  95. package/icon-sources/18/action-chat.svg +3 -3
  96. package/icon-sources/18/action-clock.svg +3 -3
  97. package/icon-sources/18/action-copy_content.svg +3 -3
  98. package/icon-sources/18/action-deactivate.svg +3 -3
  99. package/icon-sources/18/action-delete forever.svg +3 -3
  100. package/icon-sources/18/action-delete light.svg +3 -3
  101. package/icon-sources/18/action-delete.svg +4 -4
  102. package/icon-sources/18/action-drag_corner.svg +3 -3
  103. package/icon-sources/18/action-drag_indicator.svg +3 -3
  104. package/icon-sources/18/action-external_link.svg +4 -4
  105. package/icon-sources/18/action-eye-off.svg +4 -4
  106. package/icon-sources/18/action-eye.svg +4 -4
  107. package/icon-sources/18/action-flash.svg +3 -3
  108. package/icon-sources/18/action-history.svg +3 -3
  109. package/icon-sources/18/action-home.svg +3 -3
  110. package/icon-sources/18/action-job_function.svg +3 -3
  111. package/icon-sources/18/action-language.svg +3 -3
  112. package/icon-sources/18/action-level.svg +7 -7
  113. package/icon-sources/18/action-lock-fill.svg +3 -3
  114. package/icon-sources/18/action-lock_open-fill.svg +3 -3
  115. package/icon-sources/18/action-map_pin.svg +3 -3
  116. package/icon-sources/18/action-move_to.svg +3 -3
  117. package/icon-sources/18/action-pin_off.svg +4 -4
  118. package/icon-sources/18/action-pin_on.svg +3 -3
  119. package/icon-sources/18/action-schedule.svg +3 -3
  120. package/icon-sources/18/action-search.svg +3 -3
  121. package/icon-sources/18/action-settings.svg +3 -3
  122. package/icon-sources/18/action-snapshot.svg +7 -7
  123. package/icon-sources/18/action-target.svg +3 -3
  124. package/icon-sources/18/action-trophy.svg +3 -3
  125. package/icon-sources/18/action-tune.svg +3 -3
  126. package/icon-sources/18/action-update.svg +3 -3
  127. package/icon-sources/18/add-above.svg +4 -4
  128. package/icon-sources/18/add-below.svg +4 -4
  129. package/icon-sources/18/bell-off-outline.svg +3 -3
  130. package/icon-sources/18/bell-off.svg +3 -3
  131. package/icon-sources/18/bell-outline.svg +3 -3
  132. package/icon-sources/18/bell.svg +3 -3
  133. package/icon-sources/18/blacklist.svg +3 -3
  134. package/icon-sources/18/certificate.svg +3 -3
  135. package/icon-sources/18/chart-multiline.svg +3 -3
  136. package/icon-sources/18/communication-mail.svg +3 -3
  137. package/icon-sources/18/communication-phone.svg +3 -3
  138. package/icon-sources/18/communication-phone_mobile.svg +3 -3
  139. package/icon-sources/18/communication-skype.svg +3 -3
  140. package/icon-sources/18/communication-skype_business.svg +3 -3
  141. package/icon-sources/18/communication-telescope.svg +7 -7
  142. package/icon-sources/18/content-add-fill.svg +3 -3
  143. package/icon-sources/18/content-add-outline.svg +3 -3
  144. package/icon-sources/18/content-clear.svg +3 -3
  145. package/icon-sources/18/content-code.svg +3 -3
  146. package/icon-sources/18/content-code_check.svg +3 -3
  147. package/icon-sources/18/content-deselect-fill.svg +3 -3
  148. package/icon-sources/18/content-deselect-outline.svg +3 -3
  149. package/icon-sources/18/content-edit.svg +3 -3
  150. package/icon-sources/18/content-edit_redo.svg +3 -3
  151. package/icon-sources/18/content-edit_undo.svg +3 -3
  152. package/icon-sources/18/content-filter_list.svg +3 -3
  153. package/icon-sources/18/content-filtration.svg +3 -3
  154. package/icon-sources/18/content-link.svg +3 -3
  155. package/icon-sources/18/content-link_off.svg +3 -3
  156. package/icon-sources/18/content-plus.svg +3 -3
  157. package/icon-sources/18/content-plus_bold.svg +3 -3
  158. package/icon-sources/18/core-skill.svg +3 -3
  159. package/icon-sources/18/cv.svg +3 -3
  160. package/icon-sources/18/empty.svg +3 -3
  161. package/icon-sources/18/fav & rates-favorite-outline.svg +3 -3
  162. package/icon-sources/18/fav & rates-favorite.svg +3 -3
  163. package/icon-sources/18/fav & rates-star-outline.svg +3 -3
  164. package/icon-sources/18/fav & rates-star.svg +3 -3
  165. package/icon-sources/18/fav & rates-star_half.svg +3 -3
  166. package/icon-sources/18/file-archive.svg +3 -3
  167. package/icon-sources/18/file-attachment.svg +3 -3
  168. package/icon-sources/18/file-download.svg +3 -3
  169. package/icon-sources/18/file-export.svg +4 -4
  170. package/icon-sources/18/file-import.svg +4 -4
  171. package/icon-sources/18/file-upload.svg +3 -3
  172. package/icon-sources/18/folder.svg +4 -4
  173. package/icon-sources/18/grow.svg +4 -4
  174. package/icon-sources/18/interest.svg +3 -3
  175. package/icon-sources/18/linkedin.svg +3 -3
  176. package/icon-sources/18/medal.svg +4 -4
  177. package/icon-sources/18/media-fullscreen.svg +3 -3
  178. package/icon-sources/18/media-fullscreen_exit.svg +3 -3
  179. package/icon-sources/18/media-pause-fill.svg +3 -3
  180. package/icon-sources/18/media-pause-outline.svg +3 -3
  181. package/icon-sources/18/media-pause.svg +3 -3
  182. package/icon-sources/18/media-play-fill.svg +3 -3
  183. package/icon-sources/18/media-play-outline.svg +3 -3
  184. package/icon-sources/18/media-play.svg +3 -3
  185. package/icon-sources/18/media-play_pause.svg +3 -3
  186. package/icon-sources/18/media-playlist-add.svg +3 -3
  187. package/icon-sources/18/media-playlist-check.svg +3 -3
  188. package/icon-sources/18/media-playlist-minus.svg +3 -3
  189. package/icon-sources/18/media-playlist-play.svg +3 -3
  190. package/icon-sources/18/media-playlist-remove.svg +3 -3
  191. package/icon-sources/18/media-replay.svg +3 -3
  192. package/icon-sources/18/media-skip_backward.svg +3 -3
  193. package/icon-sources/18/media-skip_forward.svg +3 -3
  194. package/icon-sources/18/media-skip_next.svg +3 -3
  195. package/icon-sources/18/media-skip_previous.svg +3 -3
  196. package/icon-sources/18/media-stop-fill.svg +3 -3
  197. package/icon-sources/18/media-stop-outline.svg +3 -3
  198. package/icon-sources/18/media-stop.svg +3 -3
  199. package/icon-sources/18/microsoft-teams-outline.svg +3 -3
  200. package/icon-sources/18/microsoft-teams.svg +7 -7
  201. package/icon-sources/18/na.svg +6 -6
  202. package/icon-sources/18/navigation-arrow-down.svg +3 -3
  203. package/icon-sources/18/navigation-arrow-left.svg +3 -3
  204. package/icon-sources/18/navigation-arrow-right.svg +3 -3
  205. package/icon-sources/18/navigation-arrow-up.svg +3 -3
  206. package/icon-sources/18/navigation-back.svg +3 -3
  207. package/icon-sources/18/navigation-chevron-down.svg +3 -3
  208. package/icon-sources/18/navigation-chevron-down_down.svg +4 -4
  209. package/icon-sources/18/navigation-chevron-left.svg +3 -3
  210. package/icon-sources/18/navigation-chevron-left_left.svg +4 -4
  211. package/icon-sources/18/navigation-chevron-right.svg +3 -3
  212. package/icon-sources/18/navigation-chevron-right_right.svg +4 -4
  213. package/icon-sources/18/navigation-chevron-up.svg +3 -3
  214. package/icon-sources/18/navigation-chevron-up_up.svg +4 -4
  215. package/icon-sources/18/navigation-close.svg +3 -3
  216. package/icon-sources/18/navigation-close_bold.svg +3 -3
  217. package/icon-sources/18/navigation-dependency.svg +3 -3
  218. package/icon-sources/18/navigation-first.svg +3 -3
  219. package/icon-sources/18/navigation-last.svg +3 -3
  220. package/icon-sources/18/navigation-login.svg +3 -3
  221. package/icon-sources/18/navigation-logout.svg +3 -3
  222. package/icon-sources/18/navigation-menu.svg +3 -3
  223. package/icon-sources/18/navigation-more_horiz.svg +3 -3
  224. package/icon-sources/18/navigation-more_vert.svg +3 -3
  225. package/icon-sources/18/navigation-refresh.svg +3 -3
  226. package/icon-sources/18/navigation-structure.svg +3 -3
  227. package/icon-sources/18/navigation-structure_alt.svg +3 -3
  228. package/icon-sources/18/navigation-unfold-less.svg +3 -3
  229. package/icon-sources/18/navigation-unfold-more.svg +3 -3
  230. package/icon-sources/18/none.svg +4 -4
  231. package/icon-sources/18/not-recommended.svg +3 -3
  232. package/icon-sources/18/notification-check-fill.svg +3 -3
  233. package/icon-sources/18/notification-check-outline.svg +3 -3
  234. package/icon-sources/18/notification-done.svg +3 -3
  235. package/icon-sources/18/notification-done_bold.svg +3 -3
  236. package/icon-sources/18/notification-error-fill.svg +3 -3
  237. package/icon-sources/18/notification-error-outline.svg +3 -3
  238. package/icon-sources/18/notification-help-fill.svg +3 -3
  239. package/icon-sources/18/notification-help-outline.svg +3 -3
  240. package/icon-sources/18/notification-info-fill.svg +3 -3
  241. package/icon-sources/18/notification-info-outline.svg +3 -3
  242. package/icon-sources/18/notification-warning-fill.svg +3 -3
  243. package/icon-sources/18/notification-warning-outline.svg +3 -3
  244. package/icon-sources/18/optional-skills.svg +7 -7
  245. package/icon-sources/18/people.svg +6 -6
  246. package/icon-sources/18/ready-to.svg +3 -3
  247. package/icon-sources/18/save-outline.svg +3 -3
  248. package/icon-sources/18/save.svg +3 -3
  249. package/icon-sources/18/social-group.svg +3 -3
  250. package/icon-sources/18/social-hot.svg +3 -3
  251. package/icon-sources/18/social-network-facebook.svg +3 -3
  252. package/icon-sources/18/social-network-github.svg +3 -3
  253. package/icon-sources/18/social-network-instagram.svg +3 -3
  254. package/icon-sources/18/social-network-linkedin.svg +3 -3
  255. package/icon-sources/18/social-network-pinterest.svg +3 -3
  256. package/icon-sources/18/social-network-telegram.svg +3 -3
  257. package/icon-sources/18/social-network-twitter.svg +3 -3
  258. package/icon-sources/18/social-network-vk.svg +3 -3
  259. package/icon-sources/18/social-network-yammer.svg +3 -3
  260. package/icon-sources/18/social-network-youtube.svg +3 -3
  261. package/icon-sources/18/social-person.svg +3 -3
  262. package/icon-sources/18/social-reply.svg +3 -3
  263. package/icon-sources/18/social-share.svg +3 -3
  264. package/icon-sources/18/social-thumb-down.svg +3 -3
  265. package/icon-sources/18/social-thumb-up.svg +3 -3
  266. package/icon-sources/18/table-columns.svg +5 -5
  267. package/icon-sources/18/table-group_by.svg +9 -9
  268. package/icon-sources/18/table-info-fill.svg +3 -3
  269. package/icon-sources/18/table-info-outline.svg +3 -3
  270. package/icon-sources/18/table-sort_asc.svg +3 -3
  271. package/icon-sources/18/table-sort_desc.svg +3 -3
  272. package/icon-sources/18/table-swap.svg +3 -3
  273. package/icon-sources/18/text-format.svg +4 -4
  274. package/icon-sources/18/view-grid.svg +6 -6
  275. package/icon-sources/18/view-table.svg +3 -3
  276. package/icon-sources/24/account-multiple-plus.svg +3 -3
  277. package/icon-sources/24/action-account.svg +3 -3
  278. package/icon-sources/24/action-add.svg +3 -3
  279. package/icon-sources/24/action-align-center.svg +3 -3
  280. package/icon-sources/24/action-align-left.svg +3 -3
  281. package/icon-sources/24/action-align-right.svg +3 -3
  282. package/icon-sources/24/action-calendar.svg +3 -3
  283. package/icon-sources/24/action-copy_content.svg +3 -3
  284. package/icon-sources/24/action-currency.svg +3 -3
  285. package/icon-sources/24/action-currency_off.svg +3 -3
  286. package/icon-sources/24/action-delete.svg +3 -3
  287. package/icon-sources/24/action-drag_corner.svg +3 -3
  288. package/icon-sources/24/action-drag_indicator.svg +3 -3
  289. package/icon-sources/24/action-external_link.svg +3 -3
  290. package/icon-sources/24/action-eye-off.svg +4 -4
  291. package/icon-sources/24/action-eye.svg +4 -4
  292. package/icon-sources/24/action-flash.svg +3 -3
  293. package/icon-sources/24/action-full_width.svg +3 -3
  294. package/icon-sources/24/action-history.svg +3 -3
  295. package/icon-sources/24/action-home.svg +3 -3
  296. package/icon-sources/24/action-job_function.svg +3 -3
  297. package/icon-sources/24/action-language.svg +3 -3
  298. package/icon-sources/24/action-level.svg +7 -7
  299. package/icon-sources/24/action-lock-fill.svg +3 -3
  300. package/icon-sources/24/action-lock-outline.svg +3 -3
  301. package/icon-sources/24/action-lock_open-fill.svg +3 -3
  302. package/icon-sources/24/action-lock_open-outline.svg +4 -4
  303. package/icon-sources/24/action-map_pin.svg +3 -3
  304. package/icon-sources/24/action-mic.svg +3 -3
  305. package/icon-sources/24/action-move_to.svg +3 -3
  306. package/icon-sources/24/action-photo.svg +3 -3
  307. package/icon-sources/24/action-pin_off.svg +3 -3
  308. package/icon-sources/24/action-pin_on.svg +3 -3
  309. package/icon-sources/24/action-schedule.svg +3 -3
  310. package/icon-sources/24/action-search.svg +3 -3
  311. package/icon-sources/24/action-send.svg +3 -3
  312. package/icon-sources/24/action-settings.svg +3 -3
  313. package/icon-sources/24/action-snapshot.svg +7 -7
  314. package/icon-sources/24/action-target.svg +3 -3
  315. package/icon-sources/24/action-trophy.svg +3 -3
  316. package/icon-sources/24/action-tune.svg +3 -3
  317. package/icon-sources/24/add-above-1.svg +4 -4
  318. package/icon-sources/24/add-above.svg +4 -4
  319. package/icon-sources/24/add-below.svg +4 -4
  320. package/icon-sources/24/bell-off-outline.svg +3 -3
  321. package/icon-sources/24/bell-off.svg +3 -3
  322. package/icon-sources/24/bell-outline.svg +3 -3
  323. package/icon-sources/24/bell.svg +3 -3
  324. package/icon-sources/24/blacklist.svg +3 -3
  325. package/icon-sources/24/certificate.svg +3 -3
  326. package/icon-sources/24/chart-multiline.svg +3 -3
  327. package/icon-sources/24/communication-chat.svg +3 -3
  328. package/icon-sources/24/communication-communication-chat_alt.svg +3 -3
  329. package/icon-sources/24/communication-geo_tag.svg +3 -3
  330. package/icon-sources/24/communication-mail.svg +3 -3
  331. package/icon-sources/24/communication-phone.svg +3 -3
  332. package/icon-sources/24/communication-phone_mobile.svg +3 -3
  333. package/icon-sources/24/communication-skype.svg +3 -3
  334. package/icon-sources/24/communication-skype_business.svg +3 -3
  335. package/icon-sources/24/communication-telescope.svg +3 -3
  336. package/icon-sources/24/content-add-fill.svg +3 -3
  337. package/icon-sources/24/content-add-outline.svg +3 -3
  338. package/icon-sources/24/content-bookmark-fill.svg +3 -3
  339. package/icon-sources/24/content-bookmark-outline.svg +3 -3
  340. package/icon-sources/24/content-clear-outline.svg +3 -3
  341. package/icon-sources/24/content-clear.svg +3 -3
  342. package/icon-sources/24/content-code.svg +3 -3
  343. package/icon-sources/24/content-code_braces.svg +3 -3
  344. package/icon-sources/24/content-code_check.svg +3 -3
  345. package/icon-sources/24/content-deselect-fill.svg +3 -3
  346. package/icon-sources/24/content-deselect-outline.svg +3 -3
  347. package/icon-sources/24/content-edit.svg +3 -3
  348. package/icon-sources/24/content-edit_redo.svg +3 -3
  349. package/icon-sources/24/content-edit_undo.svg +3 -3
  350. package/icon-sources/24/content-filter_list.svg +3 -3
  351. package/icon-sources/24/content-filtration.svg +3 -3
  352. package/icon-sources/24/content-link.svg +3 -3
  353. package/icon-sources/24/content-link_off.svg +3 -3
  354. package/icon-sources/24/content-minus.svg +3 -3
  355. package/icon-sources/24/content-sort_asc.svg +3 -3
  356. package/icon-sources/24/content-sort_desc.svg +3 -3
  357. package/icon-sources/24/core-skill.svg +3 -3
  358. package/icon-sources/24/cv.svg +3 -3
  359. package/icon-sources/24/database-database.svg +3 -3
  360. package/icon-sources/24/database-lock.svg +6 -6
  361. package/icon-sources/24/database-plus.svg +3 -3
  362. package/icon-sources/24/database-remove.svg +3 -3
  363. package/icon-sources/24/database-settings.svg +3 -3
  364. package/icon-sources/24/delete-1.svg +3 -3
  365. package/icon-sources/24/editor-breakline.svg +5 -5
  366. package/icon-sources/24/editor-chart-arc.svg +3 -3
  367. package/icon-sources/24/editor-chart-areaspline.svg +3 -3
  368. package/icon-sources/24/editor-chart-bar_stacked.svg +3 -3
  369. package/icon-sources/24/editor-chart-bar_vert.svg +3 -3
  370. package/icon-sources/24/editor-chart-bubble.svg +3 -3
  371. package/icon-sources/24/editor-chart-curve.svg +3 -3
  372. package/icon-sources/24/editor-chart-donut.svg +3 -3
  373. package/icon-sources/24/editor-chart-gantt.svg +3 -3
  374. package/icon-sources/24/editor-chart-histogram.svg +3 -3
  375. package/icon-sources/24/editor-chart-line.svg +3 -3
  376. package/icon-sources/24/editor-chart-line_multiline.svg +3 -3
  377. package/icon-sources/24/editor-chart-line_var.svg +3 -3
  378. package/icon-sources/24/editor-chart-pie.svg +3 -3
  379. package/icon-sources/24/editor-chart-table.svg +3 -3
  380. package/icon-sources/24/editor-chart-timeline.svg +3 -3
  381. package/icon-sources/24/editor-chart-tree.svg +6 -6
  382. package/icon-sources/24/editor-code.svg +3 -3
  383. package/icon-sources/24/editor-color.svg +3 -3
  384. package/icon-sources/24/editor-color_none.svg +3 -3
  385. package/icon-sources/24/editor-format_bold.svg +3 -3
  386. package/icon-sources/24/editor-format_italic.svg +3 -3
  387. package/icon-sources/24/editor-format_strikethrough.svg +3 -3
  388. package/icon-sources/24/editor-format_subscript.svg +3 -3
  389. package/icon-sources/24/editor-format_superscript.svg +3 -3
  390. package/icon-sources/24/editor-format_text_alignment_center.svg +3 -3
  391. package/icon-sources/24/editor-format_text_alignment_justify.svg +3 -3
  392. package/icon-sources/24/editor-format_text_alignment_left.svg +3 -3
  393. package/icon-sources/24/editor-format_text_alignment_right.svg +3 -3
  394. package/icon-sources/24/editor-format_text_color.svg +3 -3
  395. package/icon-sources/24/editor-format_underlined.svg +3 -3
  396. package/icon-sources/24/editor-functions.svg +3 -3
  397. package/icon-sources/24/editor-headline.svg +3 -3
  398. package/icon-sources/24/editor-headline_h1.svg +3 -3
  399. package/icon-sources/24/editor-headline_h2.svg +3 -3
  400. package/icon-sources/24/editor-headline_h3.svg +3 -3
  401. package/icon-sources/24/editor-image.svg +3 -3
  402. package/icon-sources/24/editor-issue.svg +3 -3
  403. package/icon-sources/24/editor-list_bullet.svg +3 -3
  404. package/icon-sources/24/editor-list_checkbox.svg +3 -3
  405. package/icon-sources/24/editor-list_number.svg +3 -3
  406. package/icon-sources/24/editor-mention.svg +3 -3
  407. package/icon-sources/24/editor-outline.svg +3 -3
  408. package/icon-sources/24/editor-quote.svg +3 -3
  409. package/icon-sources/24/editor-risk.svg +3 -3
  410. package/icon-sources/24/editor-stats.svg +3 -3
  411. package/icon-sources/24/editor-table_merge_cells.svg +3 -3
  412. package/icon-sources/24/editor-table_split_cells.svg +3 -3
  413. package/icon-sources/24/editor-title.svg +3 -3
  414. package/icon-sources/24/editor-video.svg +3 -3
  415. package/icon-sources/24/empty.svg +3 -3
  416. package/icon-sources/24/fav & rates-favorite-outline.svg +3 -3
  417. package/icon-sources/24/fav & rates-favorite.svg +3 -3
  418. package/icon-sources/24/fav & rates-star-outline.svg +3 -3
  419. package/icon-sources/24/fav & rates-star.svg +3 -3
  420. package/icon-sources/24/fav & rates-star_half.svg +3 -3
  421. package/icon-sources/24/file-attachment.svg +3 -3
  422. package/icon-sources/24/file-cloud_download.svg +3 -3
  423. package/icon-sources/24/file-cloud_upload.svg +3 -3
  424. package/icon-sources/24/file-download.svg +3 -3
  425. package/icon-sources/24/file-export.svg +3 -3
  426. package/icon-sources/24/file-file.svg +3 -3
  427. package/icon-sources/24/file-file_archive.svg +3 -3
  428. package/icon-sources/24/file-file_chart.svg +3 -3
  429. package/icon-sources/24/file-file_eml.svg +3 -3
  430. package/icon-sources/24/file-file_excel.svg +3 -3
  431. package/icon-sources/24/file-file_image.svg +3 -3
  432. package/icon-sources/24/file-file_pdf.svg +3 -3
  433. package/icon-sources/24/file-file_table.svg +3 -3
  434. package/icon-sources/24/file-file_text.svg +3 -3
  435. package/icon-sources/24/file-file_video.svg +4 -4
  436. package/icon-sources/24/file-file_word.svg +3 -3
  437. package/icon-sources/24/file-import.svg +3 -3
  438. package/icon-sources/24/file-upload.svg +3 -3
  439. package/icon-sources/24/folder.svg +4 -4
  440. package/icon-sources/24/global_menu.svg +3 -3
  441. package/icon-sources/24/grow.svg +4 -4
  442. package/icon-sources/24/interest.svg +3 -3
  443. package/icon-sources/24/linkedin.svg +3 -3
  444. package/icon-sources/24/medal.svg +4 -4
  445. package/icon-sources/24/media-fullscreen.svg +3 -3
  446. package/icon-sources/24/media-fullscreen_exit.svg +3 -3
  447. package/icon-sources/24/media-pause-fill.svg +3 -3
  448. package/icon-sources/24/media-pause-outline.svg +3 -3
  449. package/icon-sources/24/media-pause.svg +3 -3
  450. package/icon-sources/24/media-play-fill.svg +3 -3
  451. package/icon-sources/24/media-play-outline.svg +3 -3
  452. package/icon-sources/24/media-play.svg +3 -3
  453. package/icon-sources/24/media-play_pause.svg +3 -3
  454. package/icon-sources/24/media-playlist-check.svg +3 -3
  455. package/icon-sources/24/media-playlist-minus.svg +3 -3
  456. package/icon-sources/24/media-playlist-play.svg +3 -3
  457. package/icon-sources/24/media-playlist-plus.svg +3 -3
  458. package/icon-sources/24/media-playlist.remove.svg +3 -3
  459. package/icon-sources/24/media-replay.svg +3 -3
  460. package/icon-sources/24/media-skip_backward.svg +3 -3
  461. package/icon-sources/24/media-skip_forward.svg +3 -3
  462. package/icon-sources/24/media-skip_next.svg +3 -3
  463. package/icon-sources/24/media-skip_previous.svg +3 -3
  464. package/icon-sources/24/media-stop-fill.svg +3 -3
  465. package/icon-sources/24/media-stop-outline.svg +3 -3
  466. package/icon-sources/24/media-stop.svg +3 -3
  467. package/icon-sources/24/microsoft-teams-outline.svg +3 -3
  468. package/icon-sources/24/microsoft-teams.svg +7 -7
  469. package/icon-sources/24/na.svg +6 -6
  470. package/icon-sources/24/navigation-arrow-down.svg +3 -3
  471. package/icon-sources/24/navigation-arrow-left.svg +3 -3
  472. package/icon-sources/24/navigation-arrow-right.svg +3 -3
  473. package/icon-sources/24/navigation-arrow-up.svg +3 -3
  474. package/icon-sources/24/navigation-arrows_collapse.svg +3 -3
  475. package/icon-sources/24/navigation-arrows_expand.svg +3 -3
  476. package/icon-sources/24/navigation-back.svg +3 -3
  477. package/icon-sources/24/navigation-chevron-down.svg +3 -3
  478. package/icon-sources/24/navigation-chevron-left.svg +3 -3
  479. package/icon-sources/24/navigation-chevron-left_left.svg +4 -4
  480. package/icon-sources/24/navigation-chevron-right.svg +3 -3
  481. package/icon-sources/24/navigation-chevron-right_right.svg +3 -3
  482. package/icon-sources/24/navigation-chevron-up.svg +3 -3
  483. package/icon-sources/24/navigation-close.svg +3 -3
  484. package/icon-sources/24/navigation-close_popup-(/342/233/224/357/270/217outdated).svg +4 -4
  485. package/icon-sources/24/navigation-dependency.svg +3 -3
  486. package/icon-sources/24/navigation-first.svg +3 -3
  487. package/icon-sources/24/navigation-hide.svg +3 -3
  488. package/icon-sources/24/navigation-last.svg +3 -3
  489. package/icon-sources/24/navigation-login.svg +3 -3
  490. package/icon-sources/24/navigation-logout.svg +3 -3
  491. package/icon-sources/24/navigation-menu.svg +3 -3
  492. package/icon-sources/24/navigation-more_horiz.svg +3 -3
  493. package/icon-sources/24/navigation-more_vert.svg +3 -3
  494. package/icon-sources/24/navigation-refresh.svg +3 -3
  495. package/icon-sources/24/navigation-show.svg +3 -3
  496. package/icon-sources/24/navigation-structure.svg +3 -3
  497. package/icon-sources/24/navigation-structure_alt.svg +3 -3
  498. package/icon-sources/24/navigation-today.svg +3 -3
  499. package/icon-sources/24/navigation-unfold-less.svg +3 -3
  500. package/icon-sources/24/navigation-unfold-more.svg +3 -3
  501. package/icon-sources/24/none.svg +4 -4
  502. package/icon-sources/24/not-reccomended.svg +3 -3
  503. package/icon-sources/24/notification-check-fill.svg +3 -3
  504. package/icon-sources/24/notification-check-outline.svg +3 -3
  505. package/icon-sources/24/notification-done.svg +3 -3
  506. package/icon-sources/24/notification-error-fill.svg +3 -3
  507. package/icon-sources/24/notification-error-outline.svg +3 -3
  508. package/icon-sources/24/notification-help-fill.svg +3 -3
  509. package/icon-sources/24/notification-help-outline.svg +3 -3
  510. package/icon-sources/24/notification-info-fill.svg +3 -3
  511. package/icon-sources/24/notification-info-outline.svg +3 -3
  512. package/icon-sources/24/notification-warning-fill.svg +3 -3
  513. package/icon-sources/24/notification-warning-outline.svg +3 -3
  514. package/icon-sources/24/optional-skills.svg +3 -3
  515. package/icon-sources/24/people.svg +6 -6
  516. package/icon-sources/24/radar.svg +4 -4
  517. package/icon-sources/24/ready-to.svg +3 -3
  518. package/icon-sources/24/save-outline.svg +3 -3
  519. package/icon-sources/24/save.svg +3 -3
  520. package/icon-sources/24/social-group.svg +3 -3
  521. package/icon-sources/24/social-hot.svg +3 -3
  522. package/icon-sources/24/social-hot_off.svg +4 -4
  523. package/icon-sources/24/social-network-facebook.svg +3 -3
  524. package/icon-sources/24/social-network-github.svg +3 -3
  525. package/icon-sources/24/social-network-instagram.svg +3 -3
  526. package/icon-sources/24/social-network-linkedin.svg +3 -3
  527. package/icon-sources/24/social-network-pinterest.svg +3 -3
  528. package/icon-sources/24/social-network-telegram.svg +3 -3
  529. package/icon-sources/24/social-network-twitter.svg +3 -3
  530. package/icon-sources/24/social-network-vk.svg +3 -3
  531. package/icon-sources/24/social-network-yammer.svg +3 -3
  532. package/icon-sources/24/social-network-youtube.svg +3 -3
  533. package/icon-sources/24/social-person.svg +3 -3
  534. package/icon-sources/24/social-share.svg +3 -3
  535. package/icon-sources/24/social-thumb-down.svg +3 -3
  536. package/icon-sources/24/social-thumb-up.svg +3 -3
  537. package/icon-sources/24/table-column.svg +3 -3
  538. package/icon-sources/24/table-column_plus_after.svg +3 -3
  539. package/icon-sources/24/table-column_plus_before.svg +3 -3
  540. package/icon-sources/24/table-column_remove.svg +3 -3
  541. package/icon-sources/24/table-row.svg +3 -3
  542. package/icon-sources/24/table-row_plus_after.svg +3 -3
  543. package/icon-sources/24/table-row_plus_before.svg +3 -3
  544. package/icon-sources/24/table-row_remove.svg +3 -3
  545. package/icon-sources/24/table-table.svg +3 -3
  546. package/icon-sources/24/table-table_edit.svg +3 -3
  547. package/icon-sources/24/table-table_plus.svg +3 -3
  548. package/icon-sources/24/table-table_remove.svg +3 -3
  549. package/icon-sources/24/table-table_search.svg +3 -3
  550. package/icon-sources/24/text-format.svg +3 -3
  551. package/icon-sources/24/view-grid.svg +6 -6
  552. package/icon-sources/36/action-delete light.svg +3 -3
  553. package/icon-sources/36/action-eye-off.svg +4 -4
  554. package/icon-sources/36/action-eye.svg +4 -4
  555. package/icon-sources/36/add-above.svg +4 -4
  556. package/icon-sources/36/add-below.svg +4 -4
  557. package/icon-sources/36/blacklist.svg +3 -3
  558. package/icon-sources/36/certificate.svg +3 -3
  559. package/icon-sources/36/chart-multiline.svg +3 -3
  560. package/icon-sources/36/core-skill.svg +3 -3
  561. package/icon-sources/36/cv.svg +3 -3
  562. package/icon-sources/36/empty.svg +3 -3
  563. package/icon-sources/36/folder.svg +4 -4
  564. package/icon-sources/36/grow.svg +4 -4
  565. package/icon-sources/36/interest.svg +3 -3
  566. package/icon-sources/36/linkedin.svg +3 -3
  567. package/icon-sources/36/medal.svg +4 -4
  568. package/icon-sources/36/na.svg +6 -6
  569. package/icon-sources/36/navigation-close.svg +3 -3
  570. package/icon-sources/36/none.svg +4 -4
  571. package/icon-sources/36/not-reccomended.svg +3 -3
  572. package/icon-sources/36/notification-help-outline.svg +3 -3
  573. package/icon-sources/36/optional-skills.svg +3 -3
  574. package/icon-sources/36/ready-to.svg +3 -3
  575. package/icon-sources/36/text-format.svg +4 -4
  576. package/icon-sources/36/view-grid.svg +6 -6
  577. package/icon-sources/36/view-table.svg +3 -3
  578. package/icons/common/action-deleteforever-12.svg +1 -1
  579. package/icons/common/radio-point-10.svg +13 -13
  580. package/icons/legacy/btn_cross.svg +22 -22
  581. package/icons/legacy/btn_tick.svg +22 -22
  582. package/icons/legacy/calendar-30.svg +12 -12
  583. package/icons/legacy/calendar-36.svg +14 -14
  584. package/icons/legacy/excel.svg +12 -12
  585. package/icons/legacy/filter-24.svg +11 -11
  586. package/icons/legacy/filter.svg +12 -12
  587. package/icons/legacy/folding-arrow.svg +14 -14
  588. package/icons/legacy/gear.svg +14 -14
  589. package/icons/legacy/help-24.svg +11 -11
  590. package/icons/legacy/help.svg +21 -21
  591. package/icons/legacy/label_info.svg +14 -14
  592. package/icons/legacy/lens.svg +17 -17
  593. package/icons/legacy/modal-close-cross.svg +22 -22
  594. package/icons/legacy/more.svg +20 -20
  595. package/icons/legacy/pencil.svg +12 -12
  596. package/icons/legacy/plus.svg +12 -12
  597. package/icons/legacy/sliders.svg +12 -12
  598. package/icons/legacy/sort-24.svg +15 -15
  599. package/icons/legacy/sort-desc-24.svg +15 -15
  600. package/icons/legacy/sort.svg +4 -4
  601. package/icons/legacy/trash.svg +12 -12
  602. package/icons/loaders/circle_loader_30.svg +69 -69
  603. package/icons/loaders/dots_loader_30.svg +22 -22
  604. package/icons/templates/generic-24.svg +40 -40
  605. package/icons/templates/generic-30.svg +43 -43
  606. package/icons/templates/generic.svg +40 -40
  607. package/icons/templates/tall.svg +69 -69
  608. package/package.json +2 -2
  609. package/readme.md +6 -6
  610. package/scss/font-faces.scss +3 -3
  611. package/scss/fonts.scss +2 -2
  612. package/scss/index.scss +4 -4
  613. package/scss/loveship/colors.scss +121 -121
  614. package/scss/loveship/font-faces.scss +66 -66
  615. package/scss/loveship/fonts.scss +7 -7
  616. package/scss/loveship/typography.scss +153 -153
  617. package/scss/loveship-colors.scss +2 -2
  618. package/scss/promo/colors.scss +116 -116
  619. package/scss/promo/font-faces.scss +53 -53
  620. package/scss/promo/fonts.scss +7 -7
  621. package/scss/promo/typography.scss +170 -170
  622. package/scss/typography.scss +2 -2
  623. package/theme/theme_loveship.scss +1490 -1490
  624. package/theme/theme_promo.scss +1195 -1195
  625. package/theme/theme_vanilla_thunder.scss +1019 -1019
package/theme/theme_loveship.scss CHANGED
@@ -1,1490 +1,1490 @@
1
- /* Name convention */
2
- /* --uui-'component name or group of components name'-'styled part name'-'states(optional)'-'hover/active/focus(optional)' */
3
- // refactor indentions for this page using co-pilot
4
-
5
- .uui-theme-loveship {
6
- --font-regular: 'Sans Regular', Arial, sans-serif;
7
- --font-semibold: 'Sans Semibold', Arial, sans-serif;
8
- --font-italic: 'Sans Italic', Arial, sans-serif;
9
- --font-primary: 'Sans Semibold', Arial, sans-serif;
10
- --font-promo: 'Sans Semibold', Arial, sans-serif;
11
- --font-mono: monospace;
12
- --font-redacted: 'Redacted';
13
- --font-light: 'Sans Light', Arial, sans-serif;
14
-
15
- --night50: #FAFAFC;
16
- --night100: #F5F6FA;
17
- --night200: #EBEDF5;
18
- --night300: #E1E3EB;
19
- --night400: #CED0DB;
20
- --night500: #ACAFBF;
21
- --night600: #6C6F80;
22
- --night700: #474A59;
23
- --night800: #303240;
24
- --night900: #1D1E26;
25
-
26
- --sky-soft: #F5FDFF;
27
- --sky-lightest: #E1F4FA;
28
- --sky-light: #A0DDEE;
29
- --sky: #009ECC;
30
- --sky-dark: #0086AD;
31
- --sky-darkest: #006B8A;
32
-
33
- --grass-soft: #FCFFF5;
34
- --grass-lightest: #EBF3D8;
35
- --grass-light: #C1E288;
36
- --grass: #67A300;
37
- --grass-dark: #528500;
38
- --grass-darkest: #396F1F;
39
-
40
- --sun-soft: #FFFCF5;
41
- --sun-lightest: #FFEDC9;
42
- --sun-light: #FFD785;
43
- --sun: #FCAA00;
44
- --sun-dark: #FF9000;
45
- --sun-darkest: #BD5800;
46
-
47
- --fire-soft: #FEF6F6;
48
- --fire-lightest: #FDE1E1;
49
- --fire-light: #FBB6B6;
50
- --fire: #FF4242;
51
- --fire-dark: #E22A2A;
52
- --fire-darkest: #AD0000;
53
-
54
- --white: #FFFFFF;
55
-
56
- --yellow-5: #FFFFF0;
57
- --yellow-10: #FFFECC;
58
- --yellow-20: #FFFCA4;
59
- --yellow-30: #FDD63B;
60
- --yellow-40: #F9B71D;
61
- --yellow-50: #D3910C;
62
-
63
- --orange-5: #FEF8F4;
64
- --orange-10: #FFE8D7;
65
- --orange-20: #FFCCA7;
66
- --orange-30: #FF8B3E;
67
- --orange-40: #F76B0D;
68
- --orange-50: #BD4B00;
69
-
70
- --fuchia-5: #FFF7FB;
71
- --fuchia-10: #F9D8E7;
72
- --fuchia-20: #EDADC8;
73
- --fuchia-30: #EA4386;
74
- --fuchia-40: #D61E68;
75
- --fuchia-50: #AE1955;
76
-
77
- --purple-5: #FDF6FE;
78
- --purple-10: #F2CCFA;
79
- --purple-20: #E79DF5;
80
- --purple-30: #B114D1;
81
- --purple-40: #860F9E;
82
- --purple-50: #5E0B6F;
83
-
84
- --lavanda-5: #F8F6FE;
85
- --lavanda-10: #DBCCFA;
86
- --lavanda-20: #BB9DF5;
87
- --lavanda-30: #773CEC;
88
- --lavanda-40: #5514D6;
89
- --lavanda-50: #40109E;
90
-
91
- --cobalt-5: #F8FAFF;
92
- --cobalt-10: #D9E2FC;
93
- --cobalt-20: #AEC0F5;
94
- --cobalt-30: #0F98FF;
95
- --cobalt-40: #006FE5;
96
- --cobalt-50: #0954A5;
97
-
98
- --cyan-5: #F5FBFF;
99
- --cyan-10: #D1FAFA;
100
- --cyan-20: #AAEEEE;
101
- --cyan-30: #14CCCC;
102
- --cyan-40: #0F9E9E;
103
- --cyan-50: #0B6F6F;
104
-
105
- --mint-5: #F2FCF5;
106
- --mint-10: #DDF3E4;
107
- --mint-20: #B4DFC4;
108
- --mint-30: #4FC48C;
109
- --mint-40: #2E9E68;
110
- --mint-50: #236E4A;
111
-
112
- /* Loveship old colors */
113
- --uui-color-white-800: #E6E6E6;
114
- --uui-color-white-900: #CCCCCC;
115
-
116
- --uui-color-night50-800: #DADAE9;
117
- --uui-color-night50-900: #BABAD6;
118
-
119
- --uui-color-night100-800: #D3D7E9;
120
- --uui-color-night100-900: #B1B9D8;
121
-
122
- --uui-color-night200-700: #E6E8F2;
123
- --uui-color-night200-800: #C9CEE4;
124
- --uui-color-night200-900: #A7B0D3;
125
-
126
- --uui-color-night300-700: #D9DCE6;
127
- --uui-color-night300-800: #C2C6D7;
128
- --uui-color-night300-900: #A4AAC2;
129
-
130
- --uui-color-night400-700: #C3C5D2;
131
- --uui-color-night400-800: #B1B4C5;
132
- --uui-color-night400-900: #9398B0;
133
-
134
- --uui-color-night500-700: #9D9FB2;
135
- --uui-color-night500-800: #8F93A9;
136
- --uui-color-night500-900: #727793;
137
-
138
- --uui-color-night600-700: #595B6D;
139
- --uui-color-night600-800: #555764;
140
-
141
- --uui-color-night700-800: #30323D;
142
- --uui-color-night700-900: #1A1B20;
143
-
144
- --uui-color-night800-800: #1A1B23;
145
- --uui-color-night800-900: #040406;
146
-
147
- --uui-color-night900-800: #070709;
148
- --uui-color-night900-900: #000000;
149
- /* end Loveship old colors */
150
-
151
- /* core variables start */
152
-
153
- --uui-accent: var(--grass);
154
- --uui-accent-light: var(--grass-light);
155
- --uui-accent-lightest: var(--grass-lightest);
156
- --uui-accent-dark: var(--grass-dark);
157
- --uui-accent-darkest: var(--grass-darkest);
158
-
159
- --uui-primary: var(--sky);
160
- --uui-primary-light: var(--sky-light);
161
- --uui-primary-lightest: var(--sky-lightest);
162
- --uui-primary-halftone: var(--night200);
163
- --uui-primary-dark: var(--sky-dark);
164
- --uui-primary-darkest: var(--sky-darkest);
165
-
166
- --uui-secondary: var(--night600);
167
- --uui-secondary-light: var(--night300);
168
- --uui-secondary-lightest: var(--night200);
169
- --uui-secondary-dark: var(--night700);
170
- --uui-secondary-darkest: var(--night800);
171
-
172
- --uui-negative: var(--fire);
173
- --uui-negative-light: var(--fire-light);
174
- --uui-negative-lightest: var(--fire-lightest);
175
- --uui-negative-dark: var(--fire-dark);
176
- --uui-negative-darkest: var(--fire-darkest);
177
-
178
- --uui-link: var(--sky);
179
- --uui-link-hover: var(--sky-dark);
180
- --uui-link-visited: #8018A0;
181
- --uui-link-disabled: var(--night500);
182
- --uui-visited: #5214CC;
183
-
184
- --uui-info: var(--sky);
185
- --uui-info-lightest: var(--sky-lightest);
186
- --uui-info-light: var(--sky-light);
187
- --uui-info-dark: var(--sky-dark);
188
- --uui-info-darkest: var(--sky-darkest);
189
- --uui-info-hover: var(--sky-dark);
190
- --uui-info-active: var(--sky-darkest);
191
-
192
- --uui-success: var(--grass);
193
- --uui-success-lightest: var(--grass-lightest);
194
- --uui-success-light: var(--grass-light);
195
- --uui-success-dark: var(--grass-dark);
196
- --uui-success-darkest: var(--grass-darkest);
197
- --uui-success-hover: var(--grass-dark);
198
- --uui-success-active: var(--grass-darkest);
199
-
200
- --uui-warning: var(--sun);
201
- --uui-warning-lightest: var(--sun-lightest);
202
- --uui-warning-light: var(--sun-light);
203
- --uui-warning-dark: var(--sun-dark);
204
- --uui-warning-darkest: var(--sun-darkest);
205
- --uui-warning-hover: var(--sun-dark);
206
- --uui-warning-active: var(--sun-darkest);
207
-
208
- --uui-error: var(--fire);
209
- --uui-error-lightest: var(--fire-lightest);
210
- --uui-error-light: var(--fire-light);
211
- --uui-error-dark: var(--fire-dark);
212
- --uui-error-darkest: var(--fire-darkest);
213
- --uui-error-hover: var(--fire-dark);
214
- --uui-error-active: var(--fire-darkest);
215
-
216
- --uui-icon: var(--night600);
217
- --uui-icon-hover: var(--night700);
218
- --uui-icon-active: var(--night800);
219
- --uui-icon-disabled: var(--night500);
220
-
221
- --uui-surface: var(--white);
222
- --uui-surface-hover: var(--night200);
223
- --uui-surface-inverted: var(--night900);
224
- /* new start */
225
- --uui-surface-light: var(--night50);
226
- --uui-surface-light-hover: var(--night100);
227
- --uui-surface-contrast: var(--night800);
228
- --uui-surface-contrast-hover: var(--night900);
229
- --uui-surface-contrast-active: var(--night900);
230
- /* new end */
231
-
232
- --uui-background: var(--night100);
233
- --uui-divider: var(--night400);
234
- --uui-divider-light: var(--night300);
235
- --uui-contrast: var(--white);
236
- --uui-disabled: var(--night300);
237
-
238
- --uui-scroll-bars-bg: var(--night400);
239
- --uui-scroll-bars-bg-active: var(--night600);
240
-
241
- --uui-button-bg-halftone: var(--white);
242
- --uui-button-caption-disabled: var(--night500);
243
-
244
- --uui-text-info: var(--uui-info);
245
- --uui-text-warning: var(--uui-warning);
246
- --uui-text-error: var(--uui-error);
247
- --uui-text-success: var(--uui-success);
248
- --uui-text-brand: var(--night900);
249
- --uui-text-primary: var(--night800);
250
- --uui-text-secondary: var(--night600);
251
- --uui-text-disabled: var(--night500);
252
- --uui-text-contrast: var(--night50);
253
- --uui-text-white: var(--white);
254
-
255
- --uui-control-bg: var(--white);
256
- --uui-control-bg-checked: var(--uui-primary);
257
- --uui-control-bg-checked-hover: var(--uui-primary-dark);
258
- --uui-control-bg-checked-disabled: var(--uui-primary-light);
259
- --uui-control-bg-hover: var(--night600);
260
- --uui-control-bg-disabled: var(--night50);
261
- --uui-control-bg-readonly: var(--night50);
262
- --uui-control_switch-bg: var(--night400);
263
- --uui-control_switch_toggler-bg: var(--white);
264
-
265
- --uui-control-border-checked-disabled: var(--uui-primary-light);
266
- --uui-control-border: var(--night400);
267
- --uui-control-border-checked: var(--uui-primary);
268
- --uui-control-border-checked-hover: var(--uui-primary-dark);
269
- --uui-control-border-hover: var(--uui-primary-dark);
270
- --uui-control-border-disabled: var(--uui-disabled);
271
- --uui-control-border-readonly: var(--uui-disabled);
272
-
273
- --uui-control_switch-border-hover: var(--night600);
274
- --uui-control_textinput-border-hover: var(--night600);
275
-
276
- --uui-control-label: var(--uui-text-primary);
277
- --uui-control-label-disabled: var(--uui-text-disabled);
278
- --uui-control-label-error: var(--uui-error);
279
- --uui-control-label-fill: var(--uui-icon);
280
- --uui-control-label-optional-text: var(--uui-text-secondary);
281
- --uui-control-label-asterisk: var(--uui-error);
282
-
283
- --uui-control-placeholder: var(--night600);
284
- --uui-control-placeholder-disabled: var(--night500);
285
-
286
- --uui-control-text: var(--night800);
287
- --uui-control-text-disabled: var(--night500);
288
-
289
- --uui-control-icon: var(--night500);
290
- --uui-control-icon-disabled: var(--night500);
291
-
292
- --uui-control-checkbox-icon: var(--white);
293
-
294
- --uui-tag-bg: var(--night300);
295
- --uui-tag-bg-hover: var(--night400);
296
-
297
- --uui-skeleton: var(--night400);
298
- --uui-skeleton-gradient: linear-gradient(90deg, var(--night400) 0%, var(--night100) 50%, var(--night400) 100%);
299
-
300
- --uui-overlay: rgba(29, 30, 38, 0.8);
301
- --uui-border-radius: 3px;
302
- --uui-shadow-level-1: 0 0 3px rgba(29, 30, 38, 0.15), 0 3px 6px rgba(29, 30, 38, 0.1);
303
- --uui-shadow-level-2: 0 6px 12px rgba(29, 30, 38, 0.1), 0 3px 12px rgba(29, 30, 38, 0.1), 0 0 6px rgba(29, 30, 38, 0.05);
304
- --uui-shadow-level-3: 0 0 10px rgba(29, 30, 38, 0.05), 0 6px 24px rgba(29, 30, 38, 0.12), 0 9px 15px rgba(29, 30, 38, 0.1);
305
-
306
- /* core variables end */
307
-
308
- /* find below the not core variables that are used and highlight them in the code */
309
-
310
- /* TextInput vars */
311
- --uui-text-input-bg: var(--uui-control-bg);
312
- --uui-text-input-bg-disabled: var(--uui-control-bg-disabled);
313
- --uui-text-input-bg-readonly: var(--uui-control-bg-readonly);
314
- --uui-text-input-border: var(--uui-control-border);
315
- --uui-text-input-border-hover: var(--uui-control_textinput-border-hover);
316
- --uui-text-input-border-active: var(--uui-control-border-checked);
317
- --uui-text-input-border-error: var(--uui-negative);
318
- --uui-text-input-border-disabled: var(--uui-control-border-disabled);
319
- --uui-text-input-border-readonly: var(--uui-control-border-readonly);
320
- --uui-text-input-placeholder: var(--uui-control-placeholder);
321
- --uui-text-input-placeholder-disabled: var(--uui-control-placeholder-disabled);
322
- --uui-text-input-text: var(--uui-control-text);
323
- --uui-text-input-text-disabled: var(--uui-control-text-disabled);
324
- --uui-text-input-icon: var(--uui-control-icon);
325
- --uui-text-input-icon-disabled: var(--uui-control-icon-disabled);
326
- --uui-text-input-icon-clickable: var(--uui-icon);
327
- --uui-text-input-icon-clickable-hover: var(--uui-icon-hover);
328
- --uui-text-input-border-radius: var(--uui-border-radius);
329
-
330
- --uui-text-input-font: var(--font-regular);
331
-
332
- /* Button vars */
333
- --uui-btn-border-radius: var(--uui-border-radius);
334
-
335
- --uui-btn-font: var(--font-semibold);
336
-
337
- /* LinkButton vars */
338
- --uui-link-button-font: var(--font-semibold);
339
-
340
- /* DatePicker vars */
341
- --uui-dtp-title-bg: var(--uui-control-bg);
342
- --uui-dtp-title-bg-hover: var(--uui-primary-halftone);
343
- --uui-dtp-text-selected: var(--uui-control-border-checked);
344
- --uui-dtp-text: var(--uui-control-text);
345
- --uui-dtp-next-prev-icon: var(--uui-icon);
346
- --uui-dtp-next-prev-icon-bg-hover: var(--uui-secondary-lightest);
347
-
348
- --uui-dtp_header-font: var(--font-semibold);
349
- --uui-dtp_body-content-font: var(--font-regular);
350
-
351
- /* RangeDatePicker vars */
352
- --uui-rdtp-bg: var(--uui-control-bg);
353
- --uui-rdtp-bg-selected-date: var(--uui-primary-lightest);
354
-
355
- /* Calendar vars */
356
- --uui-calendar-selected-hover: var(--uui-control-bg);
357
- --uui-calendar-start-end-selected-hover: var(--uui-primary-dark);
358
- --uui-calendar-start-end-selected: var(--uui-control-border-checked);
359
- --uui-calendar-weekends-weekdates: var(--uui-control-placeholder);
360
- --uui-calendar-text: var(--uui-control-text);
361
- --uui-calendar-text-filtered: var(--uui-control-text-disabled);
362
-
363
- --uui-calendar-content-font: var(--font-regular);
364
- --uui-calendar-weekday-font: var(--font-regular);
365
- --uui-calendar-selected_day-font: var(--font-semibold);
366
-
367
- /* tab-button-vars */
368
- --uui-tab-button-text: var(--uui-text-primary);
369
- --uui-tab-button-text-hover: var(--uui-primary);
370
- --uui-tab-button-text-active: var(--uui-primary);
371
- --uui-tab-button-text-disabled: var(--uui-text-disabled);
372
- --uui-tab-button-font: var(--font-semibold);
373
-
374
- /* radio-input-vars */
375
- --uui-radio-input-bg: var(--uui-control-bg);
376
- --uui-radio-input-bg-disabled: var(--uui-control-bg-disabled);
377
- --uui-radio-input-border: var(--uui-control-border);
378
- --uui-radio-input-border-checked: var(--uui-control-border-checked);
379
- --uui-radio-input-border-hover: var(--uui-control-border-hover);
380
- --uui-radio-input-border-disabled: var(--uui-control-border-disabled);
381
- --uui-radio-input-border-checked-disabled: var(--uui-control-border-checked-disabled);
382
- --uui-radio-input-label: var(--uui-control-label);
383
- --uui-radio-input-label-disabled: var(--uui-control-label-disabled);
384
- --uui-radio-input-fill-checked: var(--uui-control-border-checked);
385
- --uui-radio-input-fill-hover: var(--uui-control-border-hover);
386
- --uui-radio-input-fill-checked-disabled: var(--uui-control-border-checked-disabled);
387
- --uui-radio-input-error: var(--uui-negative);
388
-
389
- --uui-radio-input-font: var(--font-regular);
390
-
391
- /* Checkbox vars */
392
- --uui-checkbox-border: var(--uui-control-border);
393
- --uui-checkbox-border-hover: var(--uui-control-border-hover);
394
- --uui-checkbox-border-disabled: var(--uui-control-border-disabled);
395
- --uui-checkbox-border-checked: var(--uui-control-border-checked);
396
- --uui-checkbox-border-checked-disabled: var(--uui-control-border-checked-disabled);
397
- --uui-checkbox-bg: var(--uui-control-bg);
398
- --uui-checkbox-bg-checked: var(--uui-control-bg-checked);
399
- --uui-checkbox-bg-disabled: var(--uui-control-bg-disabled);
400
- --uui-checkbox-bg-checked-hover: var(--uui-control-bg-checked-hover);
401
- --uui-checkbox-bg-checked-disabled: var(--uui-control-bg-checked-disabled);
402
- --uui-checkbox-error: var(--uui-negative);
403
- --uui-checkbox-fill: var(--uui-control-checkbox-icon);
404
- --uui-checkbox-label: var(--uui-control-label);
405
- --uui-checkbox-label-disabled: var(--uui-control-label-disabled);
406
- --uui-checkbox-border-radius: var(--uui-border-radius);
407
-
408
- --uui-checkbox-font: var(--font-regular);
409
-
410
- /* Tag vars */
411
- --uui-tag-caption: var(--uui-text-primary);
412
- --uui-tag-fill: var(--uui-icon);
413
- --uui-tag-fill-hover: var(--uui-icon-hover);
414
- --uui-tag-count-bg: var(--uui-surface);
415
- --uui-tag-count: var(--uui-text-secondary);
416
- --uui-tag-label: var(--uui-text-secondary);
417
- --uui-tag-border-radius: 30px;
418
-
419
- --uui-tag-font: var(--font-regular);
420
- --uui-tag-count-font: var(--font-semibold);
421
-
422
- /* TextArea vars */
423
- --uui-text-area-bg: var(--uui-control-bg);
424
- --uui-text-area-bg-disabled: var(--uui-control-bg-disabled);
425
- --uui-text-area-border: var(--uui-control-border);
426
- --uui-text-area-border-disabled: var(--uui-control-border-disabled);
427
- --uui-text-area-border-hover: var(--uui-control_textinput-border-hover);
428
- --uui-text-area-border-active: var(--uui-control-border-checked);
429
- --uui-text-area-border-error: var(--uui-negative);
430
- --uui-text-area-placeholder: var(--uui-control-placeholder);
431
- --uui-text-area-text: var(--uui-control-text);
432
- --uui-text-area-text-disabled: var(--uui-control-text-disabled);
433
- --uui-text-area-icon: var(--uui-icon);
434
- --uui-text-area-border-radius: var(--uui-border-radius);
435
-
436
- --uui-text-area-font: var(--font-regular);
437
- --uui-text-area-counter-font: var(--font-regular);
438
-
439
- /* DropMarker vars */
440
- --uui-drop-marker: var(--uui-primary);
441
- --uui-drop-marker-blocked: var(--uui-error);
442
-
443
- /* Tooltip vars */
444
- --uui-tooltip-shadow: var(--uui-shadow-level-2, 0 2px 18px 0 rgba(44, 47, 60, 0.3), 0 1px 4px 0 rgba(44, 47, 60, 0.5)); /* WebStorm Bag Report https://youtrack.jetbrains.com/issue/WEB-54442 */
445
- --uui-tooltip-arrow-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.2);
446
- --uui-tooltip-border-radius: var(--uui-border-radius);
447
-
448
- --uui-tooltip-font: var(--font-regular);
449
-
450
- /* PickerInput vars */
451
- --uui-picker_input-bg: var(--uui-surface);
452
-
453
- /* PickerToggler vars */
454
- --uui-picker-toggler-bg: var(--uui-control-bg);
455
- --uui-picker-toggler-bg-disabled: var(--uui-control-bg-disabled);
456
- --uui-picker-toggler-border: var(--uui-control-border);
457
- --uui-picker-toggler-border-disabled: var(--uui-control-border-disabled);
458
- --uui-picker-toggler-border-hover: var(--uui-control_textinput-border-hover);
459
- --uui-picker-toggler-border-active: var(--uui-control-border-checked);
460
- --uui-picker-toggler-border-error: var(--uui-negative);
461
- --uui-picker-toggler-placeholder: var(--uui-control-placeholder);
462
- --uui-picker-toggler-text: var(--uui-control-text);
463
- --uui-picker-toggler-text-disabled: var(--uui-control-text-disabled);
464
- --uui-picker-toggler-icon: var(--uui-control-icon);
465
- --uui-picker-toggler-icon-disabled: var(--uui-control-icon-disabled);
466
- --uui-picker-toggler-icon-clickable: var(--uui-icon);
467
- --uui-picker-toggler-icon-clickable-hover: var(--uui-icon-hover);
468
- --uui-picker-toggler-border-radius: var(--uui-border-radius);
469
-
470
- --uui-picker-toggler-font: var(--font-regular);
471
-
472
- /* Panel */
473
- --uui-panel-border-radius: var(--uui-border-radius);
474
- --uui-panel-shadow: var(--uui-shadow-level-1);
475
-
476
- /* Modals */
477
- --uui-modals-border-radius: var(--uui-border-radius);
478
- --uui-modals-overlay: rgba(29, 30, 38, 0.8);
479
- --uui-modals-shadow: var(--uui-shadow-level-3);
480
- --uui-modals-bg: var(--uui-surface);
481
-
482
- /* TextPlaceholder */
483
- --uui-text-placeholder-gradient: var(--uui-skeleton-gradient);
484
- --uui-text-placeholder: var(--uui-skeleton);
485
-
486
- /* LabeledInput */
487
- --uui-labeled-input: var(--uui-text-primary);
488
- --uui-labeled-input-disabled: var(--uui-text-disabled);
489
- --uui-labeled-input-error: var(--uui-error);
490
- --uui-labeled-input-fill: var(--uui-icon);
491
- --uui-labeled-input-info-fill: var(--uui-icon);
492
- --uui-labeled-input-optional-text: var(--uui-text-secondary);
493
- --uui-labeled-input-asterisk: var(--uui-error);
494
-
495
- --uui-labeled-input-font: var(--font-semibold);
496
- --uui-labeled-input-optional-font: var(--font-italic);
497
- --uui-labeled-input-invalid-msg-font: var(--font-regular);
498
-
499
- /* Accordion */
500
- --uui-accordion-bg: var(--uui-surface);
501
- --uui-accordion-border: var(--uui-divider);
502
- --uui-accordion-border-radius: 6px;
503
- --uui-accordion-text: var(--uui-text-primary);
504
- --uui-accordion-text-disabled: var(--uui-text-disabled);
505
- --uui-accordion-icon: var(--uui-icon);
506
- --uui-accordion-icon-disabled: var(--uui-text-input-icon-disabled);
507
- --uui-accordion-focus: var(--uui-primary);
508
- --uui-accordion-shadow: var(--uui-shadow-level-1);
509
- --uui-accordion-shadow-hovered: var(--uui-shadow-level-2);
510
-
511
- --uui-accordion-toggler-font: var(--font-semibold);
512
- --uui-accordion-body-font: var(--font-regular);
513
-
514
- /* Switch */
515
- --uui-switch-bg: var(--uui-control_switch-bg);
516
- --uui-switch-border-hover: var(--uui-control_switch-border-hover);
517
- --uui-switch-bg-checked: var(--uui-control-bg-checked);
518
- --uui-switch-bg-hover: var(--uui-control-bg-hover);
519
- --uui-switch-bg-disabled: var(--uui-control-bg-disabled);
520
- --uui-switch-bg-checked-hover: var(--uui-control-bg-checked-hover);
521
- --uui-switch-bg-checked-disabled: var(--uui-control-bg-checked-disabled);
522
- --uui-switch-border: var(--uui-control-border);
523
- --uui-switch-border-checked: var(--uui-control-border-checked);
524
- --uui-switch-border-disabled: var(--uui-control-border-disabled);
525
- --uui-switch-border-checked-hover: var(--uui-control-border-checked-hover);
526
- --uui-switch-border-checked-hover-copy: var(--uui-control-border-checked-hover);
527
- --uui-switch-border-checked-disabled: var(--uui-control-border-checked-disabled);
528
- --uui-switch-label: var(--uui-control-label);
529
- --uui-switch-label-disabled: var(--uui-control-label-disabled);
530
- --uui-switch-toggler-bg: var(--uui-control_switch_toggler-bg);
531
- --uui-switch-toggler-bg-disabled: var(--uui-control-bg-disabled);
532
- --uui-switch-toggler-border-checked: var(--uui-control-bg-checked);
533
- --uui-switch-toggler-border-hover: var(--uui-control-bg-hover);
534
- --uui-switch-toggler-border-disabled: var(--uui-control-border-disabled);
535
- --uui-switch-toggler-border-checked-hover: var(--uui-control-bg-checked-hover);
536
- --uui-switch-toggler-border-checked-disabled: var(--uui-control-bg-checked-disabled);
537
-
538
- --uui-switch-font: var(--font-regular);
539
-
540
- /* DropdownContainer */
541
- --uui-dropdown-container-border-radius: 6px;
542
- --uui-dropdown-container-shadow: var(--uui-shadow-level-2);
543
- --uui-dropdown-container-bg: var(--uui-surface);
544
-
545
- /* DropdownMenu */
546
- // TODO: update tokens
547
- --uui-dropdown-menu-bg: var(--uui-surface);
548
- --uui-dropdown-menu-shadow: var(--uui-shadow-level-2);
549
- --uui-dropdown-menu-splitter: var(--uui-divider);
550
- --uui-dropdown-menu-item-hover: var(--uui-surface-hover);
551
- --uui-dropdown-menu-item-active: var(--uui-surface-hover);
552
- --uui-dropdown-menu-item-text: var(--uui-text-primary);
553
-
554
- --uui-dropdown-menu-body-font: var(--font-regular);
555
- --uui-dropdown-menu-item-font: var(--font-regular);
556
-
557
- /* MainMenu */
558
- --uui-main_menu-text: var(--uui-text-contrast);
559
- --uui-main_menu-text-active: var(--uui-text-contrast);
560
- --uui-main_menu-bg: var(--uui-surface-contrast);
561
- --uui-main_menu-hover: var(--uui-surface-contrast-hover);
562
- --uui-main_menu-active: var(--uui-surface-contrast-active);
563
- --uui-main_menu-border-active: var(--uui-primary);
564
-
565
- --uui-main_menu-dropdown-bg: var(--uui-surface-inverted);
566
- --uui-main_menu-dropdown-hover: var(--uui-primary);
567
- --uui-main_menu-dropdown-shadow: none;
568
- --uui-main_menu-dropdown-border-radius: none;
569
-
570
- --uui-main_menu-search-bg: var(--uui-secondary-darkest);
571
- --uui-main_menu-search-border: var(--uui-secondary-darkest);
572
- --uui-main_menu-search-placeholder: var(--uui-text-disabled);
573
- --uui-main_menu-search-text: var(--uui-contrast);
574
- --uui-main_menu-search-icon: var(--uui-icon-disabled);
575
-
576
- --uui-main_menu-icon: var(--uui-text-contrast);
577
- --uui-main_menu-icon-hover: var(--uui-text-contrast);
578
- --uui-main_menu-icon-active: var(--uui-text-contrast);
579
-
580
- --uui-main_menu-font: var(--font-semibold);
581
- --uui-main_menu-search-font: var(--font-regular);
582
-
583
- /* BurgerMenu */
584
- --uui-burger_menu-bg: var(--uui-surface-inverted);
585
- --uui-burger_menu-bg-hover: var(--uui-primary-dark);
586
- --uui-burger_menu-caption: var(--uui-text-contrast);
587
- --uui-burger_menu-caption-hover: var(--uui-primary);
588
- --uui-burger_menu-overlay: var(--uui-overlay);
589
- --uui-burger_icon: var(--uui-text-contrast);
590
- --uui-burger_item: var(--uui-text-brand);
591
-
592
- /* BurgerGroupHeader */
593
- --uui-burger_group-text: var(--uui-text-disabled);
594
- --uui-burger_group-bg: var(--uui-surface-contrast);
595
- --uui-burger_group-line: var(--uui-text-secondary);
596
-
597
- --uui-burger_group-font: var(--font-regular);
598
-
599
- /* BurgerButton */
600
- --uui-burger_btn_caption: var(--uui-text-contrast);
601
- --uui-burger_btn_caption-hover: var(--uui-primary);
602
- --uui-burger_btn_caption-active: var(--uui-primary);
603
- --uui-burger_btn-border: var(--uui-disabled);
604
-
605
- --uui-burger_btn-font: var(--font-regular);
606
-
607
- /* BurgerSearch */
608
- --uui-burger_search: var(--uui-text-contrast);
609
- --uui-burger_search-fill: var(--uui-text-disabled);
610
- --uui-burger_search-bg: var(--uui-surface-contrast);
611
- --uui-burger_search-placeholder: var(--uui-text-disabled);
612
-
613
- --uui-burger_search-font: var(--font-regular);
614
-
615
- /* NumericInput */
616
- --uui-numeric-input-bg: var(--uui-control-bg);
617
- --uui-numeric-input-bg-disabled: var(--uui-control-bg-disabled);
618
- --uui-numeric-input-border: var(--uui-control-border);
619
- --uui-numeric-input-border-disabled: var(--uui-control-border-disabled);
620
- --uui-numeric-input-border-hover: var(--uui-control_textinput-border-hover);
621
- --uui-numeric-input-border-active: var(--uui-control-border-checked);
622
- --uui-numeric-input-border-error: var(--uui-negative);
623
- --uui-numeric-input-placeholder: var(--uui-control-placeholder);
624
- --uui-numeric-input-text: var(--uui-control-text);
625
- --uui-numeric-input-text-disabled: var(--uui-control-text-disabled);
626
- --uui-numeric-input-icon-clickable: var(--uui-icon);
627
- --uui-numeric-input-icon-clickable-hover: var(--uui-icon-hover);
628
- --uui-numeric-input-border-radius: var(--uui-border-radius);
629
-
630
- /* TimePicker */
631
- --uui-time-picker-bg: var(--uui-control-bg);
632
- --uui-time-picker-bg-disabled: var(--uui-control-bg-disabled);
633
- --uui-time-picker-border: var(--uui-control-border);
634
- --uui-time-picker-border-disabled: var(--uui-control-border-disabled);
635
- --uui-time-picker-border-hover: var(--uui-control_textinput-border-hover);
636
- --uui-time-picker-border-active: var(--uui-control-border-checked);
637
- --uui-time-picker-border-error: var(--uui-negative);
638
- --uui-time-picker-placeholder: var(--uui-control-placeholder);
639
- --uui-time-picker-text: var(--uui-control-text);
640
- --uui-time-picker-text-disabled: var(--uui-control-text-disabled);
641
- --uui-time-picker-icon-clickable: var(--uui-icon);
642
- --uui-time-picker-icon-clickable-hover: var(--uui-icon-hover);
643
- --uui-time-picker-border-radius: var(--uui-border-radius);
644
-
645
- /* SearchPicker */
646
- --uui-search-input-bg: var(--uui-control-bg);
647
- --uui-search-input-bg-disabled: var(--uui-control-bg-disabled);
648
- --uui-search-input-border: var(--uui-control-border);
649
- --uui-search-input-border-disabled: var(--uui-control-border-disabled);
650
- --uui-search-input-border-hover: var(--uui-control_textinput-border-hover);
651
- --uui-search-input-border-active: var(--uui-control-border-checked);
652
- --uui-search-input-border-error: var(--uui-negative);
653
- --uui-search-input-placeholder: var(--uui-control-placeholder);
654
- --uui-search-input-text: var(--uui-control-text);
655
- --uui-search-input-text-disabled: var(--uui-control-text-disabled);
656
- --uui-search-input-icon-clickable: var(--uui-icon);
657
- --uui-search-input-icon-clickable-hover: var(--uui-icon-hover);
658
- --uui-search-input-icon-disabled: var(--uui-icon-disabled);
659
- --uui-search-input-border-radius: var(--uui-border-radius);
660
-
661
- /* Popover */
662
- --uui-popover-shadow: var(--uui-shadow-level-2);
663
-
664
- /* Footer */
665
- --uui-footer-bg: var(--uui-surface-contrast);
666
-
667
- /* FilterPanelItemToggler vars */
668
- --uui-filters-toggler-border: var(--uui-text-input-border);
669
- --uui-filters-toggler-border-hover: var(--uui-text-input-border-hover);
670
- --uui-filters-toggler-border-radius: var(--uui-border-radius);
671
- --uui-filters-toggler-bg: var(--uui-surface);
672
- --uui-filters-toggler-bg-hover: var(--uui-surface-light-hover);
673
- --uui-filters-toggler-text: var(--uui-text-brand);
674
- --uui-filters-toggler-label: var(--uui-text-secondary);
675
- --uui-filters-toggler-icon: var(--uui-text-input-icon-clickable);
676
- --uui-filters-toggler-shadow: none;
677
-
678
- --uui-filters-toggler-font: var(--font-regular);
679
- --uui-filters-panel-header-font: var(--font-regular);
680
-
681
- /* NotificationCard */
682
- --uui-notification-card-border-radius: var(--uui-border-radius);
683
- --uui-notification-card-border-width: 0;
684
- --uui-notification-card-border-top-width: 6px;
685
- --uui-notification-card-shadow: var(--uui-shadow-level-2); //TODO: may change in the future
686
-
687
- /* Alert */
688
- --uui-alert-border-radius: 6px;
689
-
690
- /* Panel */
691
-
692
- --uui-panel-bg: var(--uui-surface);
693
-
694
- /* Spinner */
695
- --uui-spinner: var(--uui-primary);
696
-
697
- /* Blocker */
698
- --uui-blocker-bg: var(--uui-background);
699
- --uui-blocker-bg-with-opacity: #F5F6FA80;
700
-
701
- /* FlexRow */
702
- --uui-flex-row-border-bottom: 1px solid var(--uui-divider);
703
-
704
- /* DataTable vars */
705
- --uui-dt-border: var(--uui-divider-light);
706
-
707
- --uui-dt-cell-bg: transparent;
708
- --uui-dt-cell-bg-resize: #EF55331F;
709
- --uui-dt-cell-bg-invalid: var(--uui-negative-lightest);
710
- --uui-dt-cell-border-hover: var(--uui-control_textinput-border-hover);
711
- --uui-dt-cell-border-focus: var(--uui-control-border-checked);
712
-
713
- --uui-dt-row-bg: var(--uui-surface);
714
- --uui-dt-row-bg-hover: var(--uui-surface-light-hover);
715
- --uui-dt-row-bg-invalid: #FEF7F6;
716
- --uui-dt-row-bg-selected: #EBF7FF;
717
-
718
- --uui-dt-header-row-bg: var(--uui-surface-light);
719
- --uui-dt-header-row-bg-hover: var(--uui-surface-hover);
720
-
721
- --uui-dt-top-shadow: linear-gradient(to bottom, rgba(0, 0, 0, 0.05) 0%, rgba(0, 0, 0, 0) 100%);
722
- --uui-dt-left-shadow: linear-gradient(to left, rgba(0, 0, 0, 0.05) 0%, rgba(0, 0, 0, 0) 100%);
723
- --uui-dt-right-shadow: linear-gradient(to right, rgba(0, 0, 0, 0.05) 0%, rgba(0, 0, 0, 0) 100%);
724
- --uui-dt_header-drop_marker: var(--uui-primary);
725
-
726
- --uui-dt-header-cell-font: var(--font-semibold);
727
-
728
- /* AvatarStack */
729
-
730
- --uui-avatar-stack-font: var(--font-semibold);
731
-
732
- /* Badge */
733
-
734
- --uui-badge-font: var(--font-regular);
735
- --uui-badge-count-font: var(--font-semibold);
736
-
737
- /* Pagination */
738
-
739
- --uui-pagination-font: var(--font-regular);
740
-
741
-
742
- /* ------------------------------------ */
743
-
744
- .tooltip-contrast,
745
- .tooltip-gray {
746
- --uui-tooltip-bg: var(--uui-surface-contrast);
747
- --uui-tooltip-text: var(--uui-contrast);
748
- }
749
-
750
- .tooltip-default,
751
- .tooltip-white {
752
- --uui-tooltip-bg: var(--uui-surface);
753
- --uui-tooltip-text: var(--uui-text-primary);
754
- }
755
-
756
- .tooltip-critical,
757
- .tooltip-fire {
758
- --uui-tooltip-bg: var(--uui-error-dark);
759
- --uui-tooltip-text: var(--uui-contrast);
760
- }
761
-
762
- .button-sky, .button-primary {
763
- --uui-btn-bg: var(--uui-primary);
764
- --uui-btn-bg-hover: var(--uui-primary-dark);
765
- --uui-btn-bg-active: var(--uui-primary-darkest);
766
- --uui-btn-bg-halftone: var(--uui-button-bg-halftone);
767
- --uui-btn-bg-halftone-hover: var(--uui-primary-lightest);
768
- --uui-btn-bg-halftone-active: var(--uui-primary-light);
769
- --uui-btn-border: var(--uui-primary);
770
- --uui-btn-border-hover: var(--uui-primary-dark);
771
- --uui-btn-border-active: var(--uui-primary-darkest);
772
- --uui-btn-bg-disabled: var(--uui-disabled);
773
- --uui-btn-border-disabled: var(--uui-disabled);
774
- --uui-btn-caption: var(--uui-contrast);
775
- --uui-btn-caption-halftone: var(--uui-primary);
776
- --uui-btn-caption-disabled: var(--uui-button-caption-disabled);
777
- }
778
-
779
- .button-accent, .button-grass {
780
- --uui-btn-bg: var(--uui-accent);
781
- --uui-btn-bg-hover: var(--uui-accent-dark);
782
- --uui-btn-bg-active: var(--uui-accent-darkest);
783
- --uui-btn-bg-halftone: var(--uui-button-bg-halftone);
784
- --uui-btn-bg-halftone-hover: var(--uui-accent-lightest);
785
- --uui-btn-bg-halftone-active: var(--uui-accent-light);
786
- --uui-btn-border: var(--uui-accent);
787
- --uui-btn-border-hover: var(--uui-accent-dark);
788
- --uui-btn-border-active: var(--uui-accent-darkest);
789
- --uui-btn-bg-disabled: var(--uui-disabled);
790
- --uui-btn-border-disabled: var(--uui-disabled);
791
- --uui-btn-caption: var(--uui-contrast);
792
- --uui-btn-caption-halftone: var(--uui-accent);
793
- --uui-btn-caption-disabled: var(--uui-button-caption-disabled);
794
- }
795
-
796
- .button-fire, .button-negative {
797
- --uui-btn-bg: var(--uui-negative);
798
- --uui-btn-bg-hover: var(--uui-negative-dark);
799
- --uui-btn-bg-active: var(--uui-negative-darkest);
800
- --uui-btn-bg-halftone: var(--uui-button-bg-halftone);
801
- --uui-btn-bg-halftone-hover: var(--uui-negative-lightest);
802
- --uui-btn-bg-halftone-active: var(--uui-negative-light);
803
- --uui-btn-border: var(--uui-negative);
804
- --uui-btn-border-hover: var(--uui-negative-dark);
805
- --uui-btn-border-active: var(--uui-negative-darkest);
806
- --uui-btn-bg-disabled: var(--uui-disabled);
807
- --uui-btn-border-disabled: var(--uui-disabled);
808
- --uui-btn-caption: var(--uui-contrast);
809
- --uui-btn-caption-halftone: var(--uui-negative);
810
- --uui-btn-caption-disabled: var(--uui-button-caption-disabled);
811
- }
812
-
813
- .button-night500,
814
- .button-night600,
815
- .button-gray,
816
- .button-secondary {
817
- --uui-btn-bg: var(--uui-secondary);
818
- --uui-btn-bg-hover: var(--uui-secondary-dark);
819
- --uui-btn-bg-active: var(--uui-secondary-darkest);
820
- --uui-btn-bg-halftone: var(--uui-button-bg-halftone);
821
- --uui-btn-bg-halftone-hover: var(--uui-secondary-lightest);
822
- --uui-btn-bg-halftone-active: var(--uui-secondary-light);
823
- --uui-btn-border: var(--uui-secondary);
824
- --uui-btn-border-hover: var(--uui-secondary-dark);
825
- --uui-btn-border-active: var(--uui-secondary-darkest);
826
- --uui-btn-bg-disabled: var(--uui-disabled);
827
- --uui-btn-border-disabled: var(--uui-disabled);
828
- --uui-btn-caption: var(--uui-contrast);
829
- --uui-btn-caption-halftone: var(--uui-secondary-dark);
830
- --uui-btn-caption-disabled: var(--uui-button-caption-disabled);
831
- }
832
-
833
- .button-white {
834
- --uui-btn-bg: var(--uui-contrast);
835
- --uui-btn-bg-hover: var(--uui-color-white-800);
836
- --uui-btn-bg-active: var(--uui-color-white-900);
837
- --uui-btn-bg-halftone: var(--uui-button-bg-halftone);
838
- --uui-btn-bg-halftone-hover: var(--uui-secondary-lightest);
839
- --uui-btn-bg-halftone-active: var(--uui-secondary-light);
840
- --uui-btn-border: var(--uui-contrast);
841
- --uui-btn-border-hover: var(--uui-color-white-800);
842
- --uui-btn-border-active: var(--uui-color-white-900);
843
- --uui-btn-bg-disabled: var(--uui-disabled);
844
- --uui-btn-border-disabled: var(--uui-disabled);
845
- --uui-btn-caption: var(--night800);
846
- --uui-btn-caption-halftone: var(--uui-secondary-dark);
847
- --uui-btn-caption-disabled: var(--uui-button-caption-disabled);
848
- }
849
-
850
- .link-button-primary,
851
- .link-button-sky {
852
- --uui-link-button-text: var(--uui-primary);
853
- --uui-link-button-text-hover: var(--uui-primary-dark);
854
- --uui-link-button-text-active: var(--uui-primary-darkest);
855
- --uui-link-button-text-disabled: var(--uui-button-caption-disabled);
856
- }
857
-
858
- .link-button-secondary,
859
- .link-button-night600 {
860
- --uui-link-button-text: var(--uui-secondary);
861
- --uui-link-button-text-hover: var(--uui-secondary-dark);
862
- --uui-link-button-text-active: var(--uui-secondary-darkest);
863
- --uui-link-button-text-disabled: var(--uui-button-caption-disabled);
864
- }
865
-
866
- .link-button-contrast,
867
- .link-button-night100 {
868
- --uui-link-button-text: var(--night100);
869
- --uui-link-button-text-hover: var(--uui-color-night100-800);
870
- --uui-link-button-text-active: var(--uui-color-night100-900);
871
- --uui-link-button-text-disabled: var(--uui-button-caption-disabled);
872
- }
873
-
874
- .link-button-grass {
875
- --uui-link-button-text: var(--grass);
876
- --uui-link-button-text-hover: var(--grass-dark);
877
- --uui-link-button-text-active: var(--grass-darkest);
878
- --uui-link-button-text-disabled: var(--uui-button-caption-disabled);
879
- }
880
-
881
- .link-button-sun {
882
- --uui-link-button-text: var(--sun);
883
- --uui-link-button-text-hover: var(--sun-dark);
884
- --uui-link-button-text-active: var(--sun-darkest);
885
- --uui-link-button-text-disabled: var(--uui-button-caption-disabled);
886
- }
887
-
888
- .link-button-fire {
889
- --uui-link-button-text: var(--fire);
890
- --uui-link-button-text-hover: var(--fire-dark);
891
- --uui-link-button-text-active: var(--fire-darkest);
892
- --uui-link-button-text-disabled: var(--uui-button-caption-disabled);
893
- }
894
-
895
- .link-button-cobalt {
896
- --uui-link-button-text: var(--cobalt-30);
897
- --uui-link-button-text-hover: var(--cobalt-40);
898
- --uui-link-button-text-active: var(--cobalt-50);
899
- --uui-link-button-text-disabled: var(--uui-button-caption-disabled);
900
- }
901
-
902
- .link-button-lavanda {
903
- --uui-link-button-text: var(--lavanda-30);
904
- --uui-link-button-text-hover: var(--lavanda-40);
905
- --uui-link-button-text-active: var(--lavanda-50);
906
- --uui-link-button-text-disabled: var(--uui-button-caption-disabled);
907
- }
908
-
909
- .link-button-fuchsia {
910
- --uui-link-button-text: var(--fuchia-30);
911
- --uui-link-button-text-hover: var(--fuchia-40);
912
- --uui-link-button-text-active: var(--fuchia-50);
913
- --uui-link-button-text-disabled: var(--uui-button-caption-disabled);
914
- }
915
-
916
- .link-button-white {
917
- --uui-link-button-text: var(--white);
918
- --uui-link-button-text-hover: var(--uui-color-white-800);
919
- --uui-link-button-text-active: var(--uui-color-white-900);
920
- --uui-link-button-text-disabled: var(--uui-button-caption-disabled);
921
- }
922
-
923
- .link-button-night50 {
924
- --uui-link-button-text: var(--night50);
925
- --uui-link-button-text-hover: var(--uui-color-night50-800);
926
- --uui-link-button-text-active: var(--uui-color-night50-900);
927
- --uui-link-button-text-disabled: var(--uui-button-caption-disabled);
928
- }
929
-
930
- .link-button-night200 {
931
- --uui-link-button-text: var(--night200);
932
- --uui-link-button-text-hover: var(--uui-color-night200-800);
933
- --uui-link-button-text-active: var(--uui-color-night200-900);
934
- --uui-link-button-text-disabled: var(--uui-icon-disabled);
935
- }
936
-
937
- .link-button-night300 {
938
- --uui-link-button-text: var(--night300);
939
- --uui-link-button-text-hover: var(--uui-color-night300-800);
940
- --uui-link-button-text-active: var(--uui-color-night300-900);
941
- --uui-link-button-text-disabled: var(--uui-icon-disabled);
942
- }
943
-
944
- .link-button-night400 {
945
- --uui-link-button-text: var(--night400);
946
- --uui-link-button-text-hover: var(--uui-color-night400-800);
947
- --uui-link-button-text-active: var(--uui-color-night400-900);
948
- --uui-link-button-text-disabled: var(--uui-icon-disabled);
949
- }
950
-
951
- .link-button-night500 {
952
- --uui-link-button-text: var(--night500);
953
- --uui-link-button-text-hover: var(--uui-color-night500-800);
954
- --uui-link-button-text-active: var(--uui-color-night500-900);
955
- --uui-link-button-text-disabled: var(--uui-icon-disabled);
956
- }
957
-
958
- .link-button-night700 {
959
- --uui-link-button-text: var(--night700);
960
- --uui-link-button-text-hover: var(--uui-color-night700-800);
961
- --uui-link-button-text-active: var(--uui-color-night700-900);
962
- --uui-link-button-text-disabled: var(--uui-icon-disabled);
963
- }
964
-
965
- .link-button-night800 {
966
- --uui-link-button-text: var(--night800);
967
- --uui-link-button-text-hover: var(--uui-color-night800-800);
968
- --uui-link-button-text-active: var(--uui-color-night800-900);
969
- --uui-link-button-text-disabled: var(--uui-icon-disabled);
970
- }
971
-
972
- .link-button-night900 {
973
- --uui-link-button-text: var(--night900);
974
- --uui-link-button-text-hover: var(--uui-color-night900-800);
975
- --uui-link-button-text-active: var(--uui-color-night900-900);
976
- --uui-link-button-text-disabled: var(--uui-icon-disabled);
977
- }
978
-
979
- .icon-button-sky,
980
- .icon-button-info {
981
- --uui-icon-btn: var(--uui-info);
982
- --uui-icon-btn-hover: var(--uui-info-dark);
983
- --uui-icon-btn-active: var(--uui-info-darkest);
984
- --uui-icon-btn-disabled: var(--uui-icon-disabled);
985
- }
986
-
987
- .icon-button-grass,
988
- .icon-button-success {
989
- --uui-icon-btn: var(--uui-success);
990
- --uui-icon-btn-hover: var(--uui-success-dark);
991
- --uui-icon-btn-active: var(--uui-success-darkest);
992
- --uui-icon-btn-disabled: var(--uui-icon-disabled);
993
- }
994
-
995
- .icon-button-sun,
996
- .icon-button-warning {
997
- --uui-icon-btn: var(--uui-warning);
998
- --uui-icon-btn-hover: var(--uui-warning-dark);
999
- --uui-icon-btn-active: var(--uui-warning-darkest);
1000
- --uui-icon-btn-disabled: var(--uui-icon-disabled);
1001
- }
1002
-
1003
- .icon-button-fire,
1004
- .icon-button-error {
1005
- --uui-icon-btn: var(--uui-error);
1006
- --uui-icon-btn-hover: var(--uui-error-dark);
1007
- --uui-icon-btn-active: var(--uui-error-darkest);
1008
- --uui-icon-btn-disabled: var(--uui-icon-disabled);
1009
- }
1010
-
1011
- .icon-button-cobalt {
1012
- --uui-icon-btn: var(--cobalt-30);
1013
- --uui-icon-btn-hover: var(--cobalt-40);
1014
- --uui-icon-btn-active: var(--cobalt-50);
1015
- --uui-icon-btn-disabled: var(--uui-icon-disabled);
1016
- }
1017
-
1018
- .icon-button-lavanda {
1019
- --uui-icon-btn: var(--lavanda-30);
1020
- --uui-icon-btn-hover: var(--lavanda-40);
1021
- --uui-icon-btn-active: var(--lavanda-50);
1022
- --uui-icon-btn-disabled: var(--uui-icon-disabled);
1023
- }
1024
-
1025
- .icon-button-fuchsia {
1026
- --uui-icon-btn: var(--fuchia-30);
1027
- --uui-icon-btn-hover: var(--fuchia-40);
1028
- --uui-icon-btn-active: var(--fuchia-50);
1029
- --uui-icon-btn-disabled: var(--uui-icon-disabled);
1030
- }
1031
-
1032
- .icon-button-white {
1033
- --uui-icon-btn: var(--white);
1034
- --uui-icon-btn-hover: var(--uui-color-white-800);
1035
- --uui-icon-btn-active: var(--uui-color-white-900);
1036
- --uui-icon-btn-disabled: var(--uui-icon-disabled);
1037
- }
1038
-
1039
- .icon-button-night200 {
1040
- --uui-icon-btn: var(--night200);
1041
- --uui-icon-btn-hover: var(--uui-color-night200-800);
1042
- --uui-icon-btn-active: var(--uui-color-night200-900);
1043
- --uui-icon-btn-disabled: var(--uui-icon-disabled);
1044
- }
1045
-
1046
- .icon-button-night300 {
1047
- --uui-icon-btn: var(--night300);
1048
- --uui-icon-btn-hover: var(--uui-color-night300-800);
1049
- --uui-icon-btn-active: var(--uui-color-night300-900);
1050
- --uui-icon-btn-disabled: var(--uui-icon-disabled);
1051
- }
1052
-
1053
- .icon-button-night400 {
1054
- --uui-icon-btn: var(--night400);
1055
- --uui-icon-btn-hover: var(--uui-color-night400-800);
1056
- --uui-icon-btn-active: var(--uui-color-night400-900);
1057
- --uui-icon-btn-disabled: var(--uui-icon-disabled);
1058
- }
1059
-
1060
- .icon-button-night500 {
1061
- --uui-icon-btn: var(--night500);
1062
- --uui-icon-btn-hover: var(--uui-color-night500-800);
1063
- --uui-icon-btn-active: var(--uui-color-night500-900);
1064
- --uui-icon-btn-disabled: var(--uui-icon-disabled);
1065
- }
1066
-
1067
- .icon-button-night600,
1068
- .icon-button-secondary,
1069
- .icon-button-default {
1070
- --uui-icon-btn: var(--night600);
1071
- --uui-icon-btn-hover: var(--uui-icon-hover);
1072
- --uui-icon-btn-active: var(--uui-icon-active);
1073
- --uui-icon-btn-disabled: var(--uui-icon-disabled);
1074
- }
1075
-
1076
- .notification-card-sun,
1077
- .notification-card-warning {
1078
- --uui-notification-card-fill: var(--uui-warning);
1079
- --uui-notification-card-border: var(--uui-warning);
1080
- --uui-notification-card-bg: var(--uui-surface);
1081
- --uui-notification-card-text: var(--uui-text-primary);
1082
- }
1083
-
1084
- .notification-card-success,
1085
- .notification-card-grass {
1086
- --uui-notification-card-fill: var(--uui-success);
1087
- --uui-notification-card-border: var(--uui-success);
1088
- --uui-notification-card-bg: var(--uui-surface);
1089
- --uui-notification-card-text: var(--uui-text-primary);
1090
- }
1091
-
1092
- .notification-card-info,
1093
- .notification-card-sky {
1094
- --uui-notification-card-fill: var(--uui-info);
1095
- --uui-notification-card-border: var(--uui-info);
1096
- --uui-notification-card-bg: var(--uui-surface);
1097
- --uui-notification-card-text: var(--uui-text-primary);
1098
- }
1099
-
1100
- .notification-card-error,
1101
- .notification-card-fire {
1102
- --uui-notification-card-fill: var(--uui-error);
1103
- --uui-notification-card-border: var(--uui-error);
1104
- --uui-notification-card-bg: var(--uui-surface);
1105
- --uui-notification-card-text: var(--uui-text-primary);
1106
- }
1107
-
1108
- .notification-card-night600 {
1109
- --uui-notification-card-fill: var(--night600);
1110
- --uui-notification-card-border: var(--night600);
1111
- --uui-notification-card-bg: var(--uui-surface);
1112
- --uui-notification-card-text: var(--uui-text-primary);
1113
- }
1114
-
1115
- .alert-error,
1116
- .alert-fire {
1117
- --uui-alert-text: var(--uui-text-primary);
1118
- --uui-alert-bg: #F5E5E9;
1119
- --uui-alert-border: var(--uui-error);
1120
- --uui-alert-icon: var(--uui-error);
1121
- }
1122
-
1123
- .alert-warning,
1124
- .alert-sun {
1125
- --uui-alert-text: var(--uui-text-primary);
1126
- --uui-alert-bg: #F6EEE1;
1127
- --uui-alert-border: var(--uui-warning);
1128
- --uui-alert-icon: var(--uui-warning);
1129
- }
1130
-
1131
-
1132
- .alert-success,
1133
- .alert-grass {
1134
- --uui-alert-text: var(--uui-text-primary);
1135
- --uui-alert-bg: #E7EEE1;
1136
- --uui-alert-border: var(--uui-success);
1137
- --uui-alert-icon: var(--uui-success);
1138
- }
1139
-
1140
- .alert-info,
1141
- .alert-sky {
1142
- --uui-alert-text: var(--uui-text-primary);
1143
- --uui-alert-bg: #DCEDF6;
1144
- --uui-alert-border: var(--uui-info);
1145
- --uui-alert-icon: var(--uui-info);
1146
- }
1147
-
1148
- .badge-default, .badge-night300 {
1149
- --uui-badge-bg: var(--night300);
1150
- --uui-badge-bg-hover: var(--night400);
1151
- --uui-badge-caption-solid: var(--uui-text-primary);
1152
- --uui-badge-count-bg: var(--white);
1153
- --uui-badge-count: var(--uui-text-secondary);
1154
- --uui-badge-bg-halftone: var(--night200);
1155
- --uui-badge-bg-halftone-hover: var(--night300);
1156
- --uui-badge-border-halftone: var(--night400);
1157
- --uui-badge-border-halftone-hover: var(--night500);
1158
- --uui-badge-caption-halftone: var(--uui-text-primary);
1159
- }
1160
-
1161
- .badge-info, .badge-sky {
1162
- --uui-badge-bg: var(--uui-info);
1163
- --uui-badge-bg-hover: var(--uui-info-dark);
1164
- --uui-badge-caption-solid: var(--uui-text-contrast);
1165
- --uui-badge-count-bg: var(--white);
1166
- --uui-badge-count: var(--uui-text-secondary);
1167
- --uui-badge-bg-halftone: var(--uui-info-lightest);
1168
- --uui-badge-bg-halftone-hover: var(--uui-info-light);
1169
- --uui-badge-border-halftone: var(--uui-info-light);
1170
- --uui-badge-border-halftone-hover: var(--uui-info);
1171
- --uui-badge-caption-halftone: var(--uui-info-darkest);
1172
- }
1173
-
1174
- .badge-success, .badge-grass {
1175
- --uui-badge-bg: var(--uui-success);
1176
- --uui-badge-bg-hover: var(--uui-success-dark);
1177
- --uui-badge-caption-solid: var(--uui-text-contrast);
1178
- --uui-badge-count-bg: var(--white);
1179
- --uui-badge-count: var(--uui-text-secondary);
1180
- --uui-badge-bg-halftone: var(--uui-success-lightest);
1181
- --uui-badge-bg-halftone-hover: var(--uui-success-light);
1182
- --uui-badge-border-halftone: var(--uui-success-light);
1183
- --uui-badge-border-halftone-hover: var(--uui-success);
1184
- --uui-badge-caption-halftone: var(--uui-success-darkest);
1185
- }
1186
-
1187
- .badge-warning, .badge-sun {
1188
- --uui-badge-bg: var(--uui-warning);
1189
- --uui-badge-bg-hover: var(--uui-warning-dark);
1190
- --uui-badge-caption-solid: var(--uui-text-primary);
1191
- --uui-badge-count-bg: var(--white);
1192
- --uui-badge-count: var(--uui-text-secondary);
1193
- --uui-badge-bg-halftone: var(--uui-warning-lightest);
1194
- --uui-badge-bg-halftone-hover: var(--uui-warning-light);
1195
- --uui-badge-border-halftone: var(--uui-warning-light);
1196
- --uui-badge-border-halftone-hover: var(--uui-warning);
1197
- --uui-badge-caption-halftone: var(--uui-warning-darkest);
1198
- }
1199
-
1200
- .badge-error, .badge-fire {
1201
- --uui-badge-bg: var(--uui-error);
1202
- --uui-badge-bg-hover: var(--uui-error-dark);
1203
- --uui-badge-caption-solid: var(--white);
1204
- --uui-badge-count-bg: var(--white);
1205
- --uui-badge-count: var(--uui-text-secondary);
1206
- --uui-badge-bg-halftone: var(--uui-error-lightest);
1207
- --uui-badge-bg-halftone-hover: var(--uui-error-light);
1208
- --uui-badge-border-halftone: var(--uui-error-light);
1209
- --uui-badge-border-halftone-hover: var(--uui-error);
1210
- --uui-badge-caption-halftone: var(--uui-error-darkest);
1211
- }
1212
-
1213
- .badge-cobalt {
1214
- --uui-badge-bg: var(--cobalt-30);
1215
- --uui-badge-bg-hover: var(--cobalt-40);
1216
- --uui-badge-caption-solid: var(--uui-text-contrast);
1217
- --uui-badge-count-bg: var(--white);
1218
- --uui-badge-count: var(--uui-text-secondary);
1219
- --uui-badge-bg-halftone: var(--cobalt-10);
1220
- --uui-badge-bg-halftone-hover: var(--cobalt-20);
1221
- --uui-badge-border-halftone: var(--cobalt-30);
1222
- --uui-badge-border-halftone-hover: var(--cobalt-40);
1223
- --uui-badge-caption-halftone: var(--cobalt-50);
1224
- }
1225
-
1226
- .badge-lavanda {
1227
- --uui-badge-bg: var(--lavanda-30);
1228
- --uui-badge-bg-hover: var(--lavanda-40);
1229
- --uui-badge-caption-solid: var(--white);
1230
- --uui-badge-count-bg: var(--white);
1231
- --uui-badge-count: var(--uui-text-secondary);
1232
- --uui-badge-bg-halftone: var(--lavanda-10);
1233
- --uui-badge-bg-halftone-hover: var(--lavanda-20);
1234
- --uui-badge-border-halftone: var(--lavanda-30);
1235
- --uui-badge-border-halftone-hover: var(--lavanda-40);
1236
- --uui-badge-caption-halftone: var(--lavanda-50);
1237
- }
1238
-
1239
- .badge-fuchsia {
1240
- --uui-badge-bg: var(--fuchia-30);
1241
- --uui-badge-bg-hover: var(--fuchia-40);
1242
- --uui-badge-caption-solid: var(--uui-text-contrast);
1243
- --uui-badge-count-bg: var(--white);
1244
- --uui-badge-count: var(--uui-text-secondary);
1245
- --uui-badge-bg-halftone: var(--fuchia-10);
1246
- --uui-badge-bg-halftone-hover: var(--fuchia-20);
1247
- --uui-badge-border-halftone: var(--fuchia-30);
1248
- --uui-badge-border-halftone-hover: var(--fuchia-40);
1249
- --uui-badge-caption-halftone: var(--fuchia-50);
1250
- }
1251
-
1252
- .badge-white {
1253
- --uui-badge-bg: var(--white);
1254
- --uui-badge-bg-hover: var(--gray5);
1255
- --uui-badge-caption-solid: var(--night800);
1256
- --uui-badge-count-bg: var(--white);
1257
- --uui-badge-count: var(--uui-text-secondary);
1258
- --uui-badge-bg-halftone: var(--white);
1259
- --uui-badge-bg-halftone-hover: var(--gray5);
1260
- --uui-badge-border-halftone: var(--white);
1261
- --uui-badge-border-halftone-hover: var(--gray5);
1262
- --uui-badge-caption-halftone: var(--uui-text-secondary);
1263
- }
1264
-
1265
- .badge-night200 {
1266
- --uui-badge-bg: var(--uui-color-night200-700);
1267
- --uui-badge-bg-hover: var(--uui-color-night200-800);
1268
- --uui-badge-caption-solid: var(--night800);
1269
- --uui-badge-count-bg: var(--white);
1270
- --uui-badge-count: var(--uui-text-secondary);
1271
- --uui-badge-bg-halftone: var(--white);
1272
- --uui-badge-bg-halftone-hover: var(--gray5);
1273
- --uui-badge-border-halftone: var(--white);
1274
- --uui-badge-border-halftone-hover: var(--gray5);
1275
- --uui-badge-caption-halftone: var(--uui-text-secondary);
1276
- }
1277
-
1278
- .badge-night300 {
1279
- --uui-badge-bg: var(--uui-color-night300-700);
1280
- --uui-badge-bg-hover: var(--uui-color-night300-800);
1281
- --uui-badge-caption-solid: var(--night800);
1282
- --uui-badge-count-bg: var(--white);
1283
- --uui-badge-count: var(--uui-text-secondary);
1284
- --uui-badge-bg-halftone: var(--white);
1285
- --uui-badge-bg-halftone-hover: var(--gray5);
1286
- --uui-badge-border-halftone: var(--white);
1287
- --uui-badge-border-halftone-hover: var(--gray5);
1288
- --uui-badge-caption-halftone: var(--uui-text-secondary);
1289
- }
1290
-
1291
- .badge-night400 {
1292
- --uui-badge-bg: var(--uui-color-night400-700);
1293
- --uui-badge-bg-hover: var(--uui-color-night400-800);
1294
- --uui-badge-caption-solid: var(--night800);
1295
- --uui-badge-count-bg: var(--white);
1296
- --uui-badge-count: var(--uui-text-secondary);
1297
- --uui-badge-bg-halftone: var(--white);
1298
- --uui-badge-bg-halftone-hover: var(--gray5);
1299
- --uui-badge-border-halftone: var(--white);
1300
- --uui-badge-border-halftone-hover: var(--gray5);
1301
- --uui-badge-caption-halftone: var(--uui-text-secondary);
1302
- }
1303
-
1304
- .badge-night500 {
1305
- --uui-badge-bg: var(--uui-color-night500-700);
1306
- --uui-badge-bg-hover: var(--uui-color-night500-800);
1307
- --uui-badge-caption-solid: var(--uui-text-contrast);
1308
- --uui-badge-count-bg: var(--white);
1309
- --uui-badge-count: var(--uui-text-secondary);
1310
- --uui-badge-bg-halftone: var(--white);
1311
- --uui-badge-bg-halftone-hover: var(--gray5);
1312
- --uui-badge-border-halftone: var(--white);
1313
- --uui-badge-border-halftone-hover: var(--gray5);
1314
- --uui-badge-caption-halftone: var(--uui-text-secondary);
1315
- }
1316
-
1317
- .badge-night600 {
1318
- --uui-badge-bg: var(--uui-color-night600-700);
1319
- --uui-badge-bg-hover: var(--uui-color-night600-800);
1320
- --uui-badge-caption-solid: var(--uui-text-contrast);
1321
- --uui-badge-count-bg: var(--white);
1322
- --uui-badge-count: var(--uui-text-secondary);
1323
- --uui-badge-bg-halftone: var(--white);
1324
- --uui-badge-bg-halftone-hover: var(--gray5);
1325
- --uui-badge-border-halftone: var(--white);
1326
- --uui-badge-border-halftone-hover: var(--gray5);
1327
- --uui-badge-caption-halftone: var(--uui-text-secondary);
1328
- }
1329
-
1330
- .badge-violet {
1331
- --uui-badge-bg: var(--lavanda-30);
1332
- --uui-badge-bg-hover: var(--lavanda-40);
1333
- --uui-badge-caption-solid: var(--uui-text-contrast);
1334
- --uui-badge-count-bg: var(--white);
1335
- --uui-badge-count: var(--uui-text-secondary);
1336
- --uui-badge-bg-halftone: var(--lavanda-10);
1337
- --uui-badge-bg-halftone-hover: var(--lavanda-20);
1338
- --uui-badge-border-halftone: var(--lavanda-20);
1339
- --uui-badge-border-halftone-hover: var(--lavanda-30);
1340
- --uui-badge-caption-halftone: var(--lavanda-50);
1341
- }
1342
-
1343
- .badge-orange {
1344
- --uui-badge-bg: var(--orange-30);
1345
- --uui-badge-bg-hover: var(--orange-40);
1346
- --uui-badge-caption-solid: var(--uui-text-contrast);
1347
- --uui-badge-count-bg: var(--white);
1348
- --uui-badge-count: var(--uui-text-secondary);
1349
- --uui-badge-bg-halftone: var(--orange-10);
1350
- --uui-badge-bg-halftone-hover: var(--orange-20);
1351
- --uui-badge-border-halftone: var(--orange-20);
1352
- --uui-badge-border-halftone-hover: var(--orange-30);
1353
- --uui-badge-caption-halftone: var(--orange-50);
1354
- }
1355
-
1356
- .badge-purple {
1357
- --uui-badge-bg: var(--purple-30);
1358
- --uui-badge-bg-hover: var(--purple-40);
1359
- --uui-badge-caption-solid: var(--uui-text-contrast);
1360
- --uui-badge-count-bg: var(--white);
1361
- --uui-badge-count: var(--uui-text-secondary);
1362
- --uui-badge-bg-halftone: var(--purple-10);
1363
- --uui-badge-bg-halftone-hover: var(--purple-20);
1364
- --uui-badge-border-halftone: var(--purple-20);
1365
- --uui-badge-border-halftone-hover: var(--purple-30);
1366
- --uui-badge-caption-halftone: var(--purple-50);
1367
- }
1368
-
1369
- .informer-default {
1370
- --uui-informer-bg: var(--night300);
1371
- --uui-informer-caption: var(--night600);
1372
- }
1373
-
1374
- .informer-focus {
1375
- --uui-informer-bg: var(--fire);
1376
- --uui-informer-caption: var(--uui-contrast);
1377
- }
1378
-
1379
- .informer-white {
1380
- --uui-informer-bg: var(--uui-surface);
1381
- --uui-informer-caption: var(--uui-text-secondary);
1382
- }
1383
-
1384
- .uui-text-info,
1385
- .uui-text-sky {
1386
- --uui-text: var(--uui-text-info);
1387
- }
1388
-
1389
- .uui-text-success,
1390
- .uui-text-grass {
1391
- --uui-text: var(--uui-text-success);
1392
- }
1393
-
1394
- .uui-text-warning,
1395
- .uui-text-sun {
1396
- --uui-text: var(--uui-text-warning);
1397
- }
1398
-
1399
- .uui-text-error,
1400
- .uui-text-fire {
1401
- --uui-text: var(--uui-text-error);
1402
- }
1403
-
1404
- .uui-text-brand,
1405
- .uui-text-night900 {
1406
- --uui-text: var(--uui-text-brand);
1407
- }
1408
-
1409
- .uui-text-primary,
1410
- .uui-text-night800 {
1411
- --uui-text: var(--uui-text-primary);
1412
- }
1413
-
1414
- .uui-text-night700 {
1415
- --uui-text: var(--night700);
1416
- }
1417
-
1418
- .uui-text-secondary,
1419
- .uui-text-night600 {
1420
- --uui-text: var(--uui-text-secondary);
1421
- }
1422
-
1423
- .uui-text-disabled,
1424
- .uui-text-night500 {
1425
- --uui-text: var(--uui-text-disabled);
1426
- }
1427
-
1428
- .uui-text-night400 {
1429
- --uui-text: var(--night400);
1430
- }
1431
-
1432
- .uui-text-night300 {
1433
- --uui-text: var(--night300);
1434
- }
1435
-
1436
- .uui-text-contrast,
1437
- .uui-text-night50 {
1438
- --uui-text: var(--uui-text-contrast);
1439
- }
1440
-
1441
- .uui-text-white {
1442
- --uui-text: var(--uui-text-white);
1443
- }
1444
-
1445
- .uui-font-regular,
1446
- .uui-font-sans {
1447
- --uui-text-font: var(--font-regular);
1448
- }
1449
-
1450
- .uui-font-semibold,
1451
- .uui-font-sans-semibold {
1452
- --uui-text-font: var(--font-semibold);
1453
- }
1454
-
1455
- .uui-font-sans-light {
1456
- --uui-text-font: var(--font-light);
1457
- }
1458
-
1459
- .dropdown-container-white {
1460
- --uui-dropdown-container-bg: var(--white);
1461
- }
1462
-
1463
- .dropdown-container-night700 {
1464
- --uui-dropdown-container-bg: var(--night700);
1465
- }
1466
-
1467
- .flex-row-background-white {
1468
- --uui-flex-row-bg: var(--uui-surface);
1469
- }
1470
-
1471
- .flex-row-background-night50 {
1472
- --uui-flex-row-bg: var(--night50);
1473
- }
1474
-
1475
- .flex-row-background-night100 {
1476
- --uui-flex-row-bg: var(--night100);
1477
- }
1478
-
1479
- .flex-row-background-none {
1480
- --uui-flex-row-bg: transparent;
1481
- }
1482
-
1483
- .panel-white {
1484
- --uui-panel-bg: var(--uui-surface);
1485
- }
1486
-
1487
- .panel-night50 {
1488
- --uui-panel-bg: var(--night50);
1489
- }
1490
- }
1
+ /* Name convention */
2
+ /* --uui-'component name or group of components name'-'styled part name'-'states(optional)'-'hover/active/focus(optional)' */
3
+ // refactor indentions for this page using co-pilot
4
+
5
+ .uui-theme-loveship {
6
+ --font-regular: 'Sans Regular', Arial, sans-serif;
7
+ --font-semibold: 'Sans Semibold', Arial, sans-serif;
8
+ --font-italic: 'Sans Italic', Arial, sans-serif;
9
+ --font-primary: 'Sans Semibold', Arial, sans-serif;
10
+ --font-promo: 'Sans Semibold', Arial, sans-serif;
11
+ --font-mono: monospace;
12
+ --font-redacted: 'Redacted';
13
+ --font-light: 'Sans Light', Arial, sans-serif;
14
+
15
+ --night50: #FAFAFC;
16
+ --night100: #F5F6FA;
17
+ --night200: #EBEDF5;
18
+ --night300: #E1E3EB;
19
+ --night400: #CED0DB;
20
+ --night500: #ACAFBF;
21
+ --night600: #6C6F80;
22
+ --night700: #474A59;
23
+ --night800: #303240;
24
+ --night900: #1D1E26;
25
+
26
+ --sky-soft: #F5FDFF;
27
+ --sky-lightest: #E1F4FA;
28
+ --sky-light: #A0DDEE;
29
+ --sky: #009ECC;
30
+ --sky-dark: #0086AD;
31
+ --sky-darkest: #006B8A;
32
+
33
+ --grass-soft: #FCFFF5;
34
+ --grass-lightest: #EBF3D8;
35
+ --grass-light: #C1E288;
36
+ --grass: #67A300;
37
+ --grass-dark: #528500;
38
+ --grass-darkest: #396F1F;
39
+
40
+ --sun-soft: #FFFCF5;
41
+ --sun-lightest: #FFEDC9;
42
+ --sun-light: #FFD785;
43
+ --sun: #FCAA00;
44
+ --sun-dark: #FF9000;
45
+ --sun-darkest: #BD5800;
46
+
47
+ --fire-soft: #FEF6F6;
48
+ --fire-lightest: #FDE1E1;
49
+ --fire-light: #FBB6B6;
50
+ --fire: #FF4242;
51
+ --fire-dark: #E22A2A;
52
+ --fire-darkest: #AD0000;
53
+
54
+ --white: #FFFFFF;
55
+
56
+ --yellow-5: #FFFFF0;
57
+ --yellow-10: #FFFECC;
58
+ --yellow-20: #FFFCA4;
59
+ --yellow-30: #FDD63B;
60
+ --yellow-40: #F9B71D;
61
+ --yellow-50: #D3910C;
62
+
63
+ --orange-5: #FEF8F4;
64
+ --orange-10: #FFE8D7;
65
+ --orange-20: #FFCCA7;
66
+ --orange-30: #FF8B3E;
67
+ --orange-40: #F76B0D;
68
+ --orange-50: #BD4B00;
69
+
70
+ --fuchia-5: #FFF7FB;
71
+ --fuchia-10: #F9D8E7;
72
+ --fuchia-20: #EDADC8;
73
+ --fuchia-30: #EA4386;
74
+ --fuchia-40: #D61E68;
75
+ --fuchia-50: #AE1955;
76
+
77
+ --purple-5: #FDF6FE;
78
+ --purple-10: #F2CCFA;
79
+ --purple-20: #E79DF5;
80
+ --purple-30: #B114D1;
81
+ --purple-40: #860F9E;
82
+ --purple-50: #5E0B6F;
83
+
84
+ --lavanda-5: #F8F6FE;
85
+ --lavanda-10: #DBCCFA;
86
+ --lavanda-20: #BB9DF5;
87
+ --lavanda-30: #773CEC;
88
+ --lavanda-40: #5514D6;
89
+ --lavanda-50: #40109E;
90
+
91
+ --cobalt-5: #F8FAFF;
92
+ --cobalt-10: #D9E2FC;
93
+ --cobalt-20: #AEC0F5;
94
+ --cobalt-30: #0F98FF;
95
+ --cobalt-40: #006FE5;
96
+ --cobalt-50: #0954A5;
97
+
98
+ --cyan-5: #F5FBFF;
99
+ --cyan-10: #D1FAFA;
100
+ --cyan-20: #AAEEEE;
101
+ --cyan-30: #14CCCC;
102
+ --cyan-40: #0F9E9E;
103
+ --cyan-50: #0B6F6F;
104
+
105
+ --mint-5: #F2FCF5;
106
+ --mint-10: #DDF3E4;
107
+ --mint-20: #B4DFC4;
108
+ --mint-30: #4FC48C;
109
+ --mint-40: #2E9E68;
110
+ --mint-50: #236E4A;
111
+
112
+ /* Loveship old colors */
113
+ --uui-color-white-800: #E6E6E6;
114
+ --uui-color-white-900: #CCCCCC;
115
+
116
+ --uui-color-night50-800: #DADAE9;
117
+ --uui-color-night50-900: #BABAD6;
118
+
119
+ --uui-color-night100-800: #D3D7E9;
120
+ --uui-color-night100-900: #B1B9D8;
121
+
122
+ --uui-color-night200-700: #E6E8F2;
123
+ --uui-color-night200-800: #C9CEE4;
124
+ --uui-color-night200-900: #A7B0D3;
125
+
126
+ --uui-color-night300-700: #D9DCE6;
127
+ --uui-color-night300-800: #C2C6D7;
128
+ --uui-color-night300-900: #A4AAC2;
129
+
130
+ --uui-color-night400-700: #C3C5D2;
131
+ --uui-color-night400-800: #B1B4C5;
132
+ --uui-color-night400-900: #9398B0;
133
+
134
+ --uui-color-night500-700: #9D9FB2;
135
+ --uui-color-night500-800: #8F93A9;
136
+ --uui-color-night500-900: #727793;
137
+
138
+ --uui-color-night600-700: #595B6D;
139
+ --uui-color-night600-800: #555764;
140
+
141
+ --uui-color-night700-800: #30323D;
142
+ --uui-color-night700-900: #1A1B20;
143
+
144
+ --uui-color-night800-800: #1A1B23;
145
+ --uui-color-night800-900: #040406;
146
+
147
+ --uui-color-night900-800: #070709;
148
+ --uui-color-night900-900: #000000;
149
+ /* end Loveship old colors */
150
+
151
+ /* core variables start */
152
+
153
+ --uui-accent: var(--grass);
154
+ --uui-accent-light: var(--grass-light);
155
+ --uui-accent-lightest: var(--grass-lightest);
156
+ --uui-accent-dark: var(--grass-dark);
157
+ --uui-accent-darkest: var(--grass-darkest);
158
+
159
+ --uui-primary: var(--sky);
160
+ --uui-primary-light: var(--sky-light);
161
+ --uui-primary-lightest: var(--sky-lightest);
162
+ --uui-primary-halftone: var(--night200);
163
+ --uui-primary-dark: var(--sky-dark);
164
+ --uui-primary-darkest: var(--sky-darkest);
165
+
166
+ --uui-secondary: var(--night600);
167
+ --uui-secondary-light: var(--night300);
168
+ --uui-secondary-lightest: var(--night200);
169
+ --uui-secondary-dark: var(--night700);
170
+ --uui-secondary-darkest: var(--night800);
171
+
172
+ --uui-negative: var(--fire);
173
+ --uui-negative-light: var(--fire-light);
174
+ --uui-negative-lightest: var(--fire-lightest);
175
+ --uui-negative-dark: var(--fire-dark);
176
+ --uui-negative-darkest: var(--fire-darkest);
177
+
178
+ --uui-link: var(--sky);
179
+ --uui-link-hover: var(--sky-dark);
180
+ --uui-link-visited: #8018A0;
181
+ --uui-link-disabled: var(--night500);
182
+ --uui-visited: #5214CC;
183
+
184
+ --uui-info: var(--sky);
185
+ --uui-info-lightest: var(--sky-lightest);
186
+ --uui-info-light: var(--sky-light);
187
+ --uui-info-dark: var(--sky-dark);
188
+ --uui-info-darkest: var(--sky-darkest);
189
+ --uui-info-hover: var(--sky-dark);
190
+ --uui-info-active: var(--sky-darkest);
191
+
192
+ --uui-success: var(--grass);
193
+ --uui-success-lightest: var(--grass-lightest);
194
+ --uui-success-light: var(--grass-light);
195
+ --uui-success-dark: var(--grass-dark);
196
+ --uui-success-darkest: var(--grass-darkest);
197
+ --uui-success-hover: var(--grass-dark);
198
+ --uui-success-active: var(--grass-darkest);
199
+
200
+ --uui-warning: var(--sun);
201
+ --uui-warning-lightest: var(--sun-lightest);
202
+ --uui-warning-light: var(--sun-light);
203
+ --uui-warning-dark: var(--sun-dark);
204
+ --uui-warning-darkest: var(--sun-darkest);
205
+ --uui-warning-hover: var(--sun-dark);
206
+ --uui-warning-active: var(--sun-darkest);
207
+
208
+ --uui-error: var(--fire);
209
+ --uui-error-lightest: var(--fire-lightest);
210
+ --uui-error-light: var(--fire-light);
211
+ --uui-error-dark: var(--fire-dark);
212
+ --uui-error-darkest: var(--fire-darkest);
213
+ --uui-error-hover: var(--fire-dark);
214
+ --uui-error-active: var(--fire-darkest);
215
+
216
+ --uui-icon: var(--night600);
217
+ --uui-icon-hover: var(--night700);
218
+ --uui-icon-active: var(--night800);
219
+ --uui-icon-disabled: var(--night500);
220
+
221
+ --uui-surface: var(--white);
222
+ --uui-surface-hover: var(--night200);
223
+ --uui-surface-inverted: var(--night900);
224
+ /* new start */
225
+ --uui-surface-light: var(--night50);
226
+ --uui-surface-light-hover: var(--night100);
227
+ --uui-surface-contrast: var(--night800);
228
+ --uui-surface-contrast-hover: var(--night900);
229
+ --uui-surface-contrast-active: var(--night900);
230
+ /* new end */
231
+
232
+ --uui-background: var(--night100);
233
+ --uui-divider: var(--night400);
234
+ --uui-divider-light: var(--night300);
235
+ --uui-contrast: var(--white);
236
+ --uui-disabled: var(--night300);
237
+
238
+ --uui-scroll-bars-bg: var(--night400);
239
+ --uui-scroll-bars-bg-active: var(--night600);
240
+
241
+ --uui-button-bg-halftone: var(--white);
242
+ --uui-button-caption-disabled: var(--night500);
243
+
244
+ --uui-text-info: var(--uui-info);
245
+ --uui-text-warning: var(--uui-warning);
246
+ --uui-text-error: var(--uui-error);
247
+ --uui-text-success: var(--uui-success);
248
+ --uui-text-brand: var(--night900);
249
+ --uui-text-primary: var(--night800);
250
+ --uui-text-secondary: var(--night600);
251
+ --uui-text-disabled: var(--night500);
252
+ --uui-text-contrast: var(--night50);
253
+ --uui-text-white: var(--white);
254
+
255
+ --uui-control-bg: var(--white);
256
+ --uui-control-bg-checked: var(--uui-primary);
257
+ --uui-control-bg-checked-hover: var(--uui-primary-dark);
258
+ --uui-control-bg-checked-disabled: var(--uui-primary-light);
259
+ --uui-control-bg-hover: var(--night600);
260
+ --uui-control-bg-disabled: var(--night50);
261
+ --uui-control-bg-readonly: var(--night50);
262
+ --uui-control_switch-bg: var(--night400);
263
+ --uui-control_switch_toggler-bg: var(--white);
264
+
265
+ --uui-control-border-checked-disabled: var(--uui-primary-light);
266
+ --uui-control-border: var(--night400);
267
+ --uui-control-border-checked: var(--uui-primary);
268
+ --uui-control-border-checked-hover: var(--uui-primary-dark);
269
+ --uui-control-border-hover: var(--uui-primary-dark);
270
+ --uui-control-border-disabled: var(--uui-disabled);
271
+ --uui-control-border-readonly: var(--uui-disabled);
272
+
273
+ --uui-control_switch-border-hover: var(--night600);
274
+ --uui-control_textinput-border-hover: var(--night600);
275
+
276
+ --uui-control-label: var(--uui-text-primary);
277
+ --uui-control-label-disabled: var(--uui-text-disabled);
278
+ --uui-control-label-error: var(--uui-error);
279
+ --uui-control-label-fill: var(--uui-icon);
280
+ --uui-control-label-optional-text: var(--uui-text-secondary);
281
+ --uui-control-label-asterisk: var(--uui-error);
282
+
283
+ --uui-control-placeholder: var(--night600);
284
+ --uui-control-placeholder-disabled: var(--night500);
285
+
286
+ --uui-control-text: var(--night800);
287
+ --uui-control-text-disabled: var(--night500);
288
+
289
+ --uui-control-icon: var(--night500);
290
+ --uui-control-icon-disabled: var(--night500);
291
+
292
+ --uui-control-checkbox-icon: var(--white);
293
+
294
+ --uui-tag-bg: var(--night300);
295
+ --uui-tag-bg-hover: var(--night400);
296
+
297
+ --uui-skeleton: var(--night400);
298
+ --uui-skeleton-gradient: linear-gradient(90deg, var(--night400) 0%, var(--night100) 50%, var(--night400) 100%);
299
+
300
+ --uui-overlay: rgba(29, 30, 38, 0.8);
301
+ --uui-border-radius: 3px;
302
+ --uui-shadow-level-1: 0 0 3px rgba(29, 30, 38, 0.15), 0 3px 6px rgba(29, 30, 38, 0.1);
303
+ --uui-shadow-level-2: 0 6px 12px rgba(29, 30, 38, 0.1), 0 3px 12px rgba(29, 30, 38, 0.1), 0 0 6px rgba(29, 30, 38, 0.05);
304
+ --uui-shadow-level-3: 0 0 10px rgba(29, 30, 38, 0.05), 0 6px 24px rgba(29, 30, 38, 0.12), 0 9px 15px rgba(29, 30, 38, 0.1);
305
+
306
+ /* core variables end */
307
+
308
+ /* find below the not core variables that are used and highlight them in the code */
309
+
310
+ /* TextInput vars */
311
+ --uui-text-input-bg: var(--uui-control-bg);
312
+ --uui-text-input-bg-disabled: var(--uui-control-bg-disabled);
313
+ --uui-text-input-bg-readonly: var(--uui-control-bg-readonly);
314
+ --uui-text-input-border: var(--uui-control-border);
315
+ --uui-text-input-border-hover: var(--uui-control_textinput-border-hover);
316
+ --uui-text-input-border-active: var(--uui-control-border-checked);
317
+ --uui-text-input-border-error: var(--uui-negative);
318
+ --uui-text-input-border-disabled: var(--uui-control-border-disabled);
319
+ --uui-text-input-border-readonly: var(--uui-control-border-readonly);
320
+ --uui-text-input-placeholder: var(--uui-control-placeholder);
321
+ --uui-text-input-placeholder-disabled: var(--uui-control-placeholder-disabled);
322
+ --uui-text-input-text: var(--uui-control-text);
323
+ --uui-text-input-text-disabled: var(--uui-control-text-disabled);
324
+ --uui-text-input-icon: var(--uui-control-icon);
325
+ --uui-text-input-icon-disabled: var(--uui-control-icon-disabled);
326
+ --uui-text-input-icon-clickable: var(--uui-icon);
327
+ --uui-text-input-icon-clickable-hover: var(--uui-icon-hover);
328
+ --uui-text-input-border-radius: var(--uui-border-radius);
329
+
330
+ --uui-text-input-font: var(--font-regular);
331
+
332
+ /* Button vars */
333
+ --uui-btn-border-radius: var(--uui-border-radius);
334
+
335
+ --uui-btn-font: var(--font-semibold);
336
+
337
+ /* LinkButton vars */
338
+ --uui-link-button-font: var(--font-semibold);
339
+
340
+ /* DatePicker vars */
341
+ --uui-dtp-title-bg: var(--uui-control-bg);
342
+ --uui-dtp-title-bg-hover: var(--uui-primary-halftone);
343
+ --uui-dtp-text-selected: var(--uui-control-border-checked);
344
+ --uui-dtp-text: var(--uui-control-text);
345
+ --uui-dtp-next-prev-icon: var(--uui-icon);
346
+ --uui-dtp-next-prev-icon-bg-hover: var(--uui-secondary-lightest);
347
+
348
+ --uui-dtp_header-font: var(--font-semibold);
349
+ --uui-dtp_body-content-font: var(--font-regular);
350
+
351
+ /* RangeDatePicker vars */
352
+ --uui-rdtp-bg: var(--uui-control-bg);
353
+ --uui-rdtp-bg-selected-date: var(--uui-primary-lightest);
354
+
355
+ /* Calendar vars */
356
+ --uui-calendar-selected-hover: var(--uui-control-bg);
357
+ --uui-calendar-start-end-selected-hover: var(--uui-primary-dark);
358
+ --uui-calendar-start-end-selected: var(--uui-control-border-checked);
359
+ --uui-calendar-weekends-weekdates: var(--uui-control-placeholder);
360
+ --uui-calendar-text: var(--uui-control-text);
361
+ --uui-calendar-text-filtered: var(--uui-control-text-disabled);
362
+
363
+ --uui-calendar-content-font: var(--font-regular);
364
+ --uui-calendar-weekday-font: var(--font-regular);
365
+ --uui-calendar-selected_day-font: var(--font-semibold);
366
+
367
+ /* tab-button-vars */
368
+ --uui-tab-button-text: var(--uui-text-primary);
369
+ --uui-tab-button-text-hover: var(--uui-primary);
370
+ --uui-tab-button-text-active: var(--uui-primary);
371
+ --uui-tab-button-text-disabled: var(--uui-text-disabled);
372
+ --uui-tab-button-font: var(--font-semibold);
373
+
374
+ /* radio-input-vars */
375
+ --uui-radio-input-bg: var(--uui-control-bg);
376
+ --uui-radio-input-bg-disabled: var(--uui-control-bg-disabled);
377
+ --uui-radio-input-border: var(--uui-control-border);
378
+ --uui-radio-input-border-checked: var(--uui-control-border-checked);
379
+ --uui-radio-input-border-hover: var(--uui-control-border-hover);
380
+ --uui-radio-input-border-disabled: var(--uui-control-border-disabled);
381
+ --uui-radio-input-border-checked-disabled: var(--uui-control-border-checked-disabled);
382
+ --uui-radio-input-label: var(--uui-control-label);
383
+ --uui-radio-input-label-disabled: var(--uui-control-label-disabled);
384
+ --uui-radio-input-fill-checked: var(--uui-control-border-checked);
385
+ --uui-radio-input-fill-hover: var(--uui-control-border-hover);
386
+ --uui-radio-input-fill-checked-disabled: var(--uui-control-border-checked-disabled);
387
+ --uui-radio-input-error: var(--uui-negative);
388
+
389
+ --uui-radio-input-font: var(--font-regular);
390
+
391
+ /* Checkbox vars */
392
+ --uui-checkbox-border: var(--uui-control-border);
393
+ --uui-checkbox-border-hover: var(--uui-control-border-hover);
394
+ --uui-checkbox-border-disabled: var(--uui-control-border-disabled);
395
+ --uui-checkbox-border-checked: var(--uui-control-border-checked);
396
+ --uui-checkbox-border-checked-disabled: var(--uui-control-border-checked-disabled);
397
+ --uui-checkbox-bg: var(--uui-control-bg);
398
+ --uui-checkbox-bg-checked: var(--uui-control-bg-checked);
399
+ --uui-checkbox-bg-disabled: var(--uui-control-bg-disabled);
400
+ --uui-checkbox-bg-checked-hover: var(--uui-control-bg-checked-hover);
401
+ --uui-checkbox-bg-checked-disabled: var(--uui-control-bg-checked-disabled);
402
+ --uui-checkbox-error: var(--uui-negative);
403
+ --uui-checkbox-fill: var(--uui-control-checkbox-icon);
404
+ --uui-checkbox-label: var(--uui-control-label);
405
+ --uui-checkbox-label-disabled: var(--uui-control-label-disabled);
406
+ --uui-checkbox-border-radius: var(--uui-border-radius);
407
+
408
+ --uui-checkbox-font: var(--font-regular);
409
+
410
+ /* Tag vars */
411
+ --uui-tag-caption: var(--uui-text-primary);
412
+ --uui-tag-fill: var(--uui-icon);
413
+ --uui-tag-fill-hover: var(--uui-icon-hover);
414
+ --uui-tag-count-bg: var(--uui-surface);
415
+ --uui-tag-count: var(--uui-text-secondary);
416
+ --uui-tag-label: var(--uui-text-secondary);
417
+ --uui-tag-border-radius: 30px;
418
+
419
+ --uui-tag-font: var(--font-regular);
420
+ --uui-tag-count-font: var(--font-semibold);
421
+
422
+ /* TextArea vars */
423
+ --uui-text-area-bg: var(--uui-control-bg);
424
+ --uui-text-area-bg-disabled: var(--uui-control-bg-disabled);
425
+ --uui-text-area-border: var(--uui-control-border);
426
+ --uui-text-area-border-disabled: var(--uui-control-border-disabled);
427
+ --uui-text-area-border-hover: var(--uui-control_textinput-border-hover);
428
+ --uui-text-area-border-active: var(--uui-control-border-checked);
429
+ --uui-text-area-border-error: var(--uui-negative);
430
+ --uui-text-area-placeholder: var(--uui-control-placeholder);
431
+ --uui-text-area-text: var(--uui-control-text);
432
+ --uui-text-area-text-disabled: var(--uui-control-text-disabled);
433
+ --uui-text-area-icon: var(--uui-icon);
434
+ --uui-text-area-border-radius: var(--uui-border-radius);
435
+
436
+ --uui-text-area-font: var(--font-regular);
437
+ --uui-text-area-counter-font: var(--font-regular);
438
+
439
+ /* DropMarker vars */
440
+ --uui-drop-marker: var(--uui-primary);
441
+ --uui-drop-marker-blocked: var(--uui-error);
442
+
443
+ /* Tooltip vars */
444
+ --uui-tooltip-shadow: var(--uui-shadow-level-2, 0 2px 18px 0 rgba(44, 47, 60, 0.3), 0 1px 4px 0 rgba(44, 47, 60, 0.5)); /* WebStorm Bag Report https://youtrack.jetbrains.com/issue/WEB-54442 */
445
+ --uui-tooltip-arrow-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.2);
446
+ --uui-tooltip-border-radius: var(--uui-border-radius);
447
+
448
+ --uui-tooltip-font: var(--font-regular);
449
+
450
+ /* PickerInput vars */
451
+ --uui-picker_input-bg: var(--uui-surface);
452
+
453
+ /* PickerToggler vars */
454
+ --uui-picker-toggler-bg: var(--uui-control-bg);
455
+ --uui-picker-toggler-bg-disabled: var(--uui-control-bg-disabled);
456
+ --uui-picker-toggler-border: var(--uui-control-border);
457
+ --uui-picker-toggler-border-disabled: var(--uui-control-border-disabled);
458
+ --uui-picker-toggler-border-hover: var(--uui-control_textinput-border-hover);
459
+ --uui-picker-toggler-border-active: var(--uui-control-border-checked);
460
+ --uui-picker-toggler-border-error: var(--uui-negative);
461
+ --uui-picker-toggler-placeholder: var(--uui-control-placeholder);
462
+ --uui-picker-toggler-text: var(--uui-control-text);
463
+ --uui-picker-toggler-text-disabled: var(--uui-control-text-disabled);
464
+ --uui-picker-toggler-icon: var(--uui-control-icon);
465
+ --uui-picker-toggler-icon-disabled: var(--uui-control-icon-disabled);
466
+ --uui-picker-toggler-icon-clickable: var(--uui-icon);
467
+ --uui-picker-toggler-icon-clickable-hover: var(--uui-icon-hover);
468
+ --uui-picker-toggler-border-radius: var(--uui-border-radius);
469
+
470
+ --uui-picker-toggler-font: var(--font-regular);
471
+
472
+ /* Panel */
473
+ --uui-panel-border-radius: var(--uui-border-radius);
474
+ --uui-panel-shadow: var(--uui-shadow-level-1);
475
+
476
+ /* Modals */
477
+ --uui-modals-border-radius: var(--uui-border-radius);
478
+ --uui-modals-overlay: rgba(29, 30, 38, 0.8);
479
+ --uui-modals-shadow: var(--uui-shadow-level-3);
480
+ --uui-modals-bg: var(--uui-surface);
481
+
482
+ /* TextPlaceholder */
483
+ --uui-text-placeholder-gradient: var(--uui-skeleton-gradient);
484
+ --uui-text-placeholder: var(--uui-skeleton);
485
+
486
+ /* LabeledInput */
487
+ --uui-labeled-input: var(--uui-text-primary);
488
+ --uui-labeled-input-disabled: var(--uui-text-disabled);
489
+ --uui-labeled-input-error: var(--uui-error);
490
+ --uui-labeled-input-fill: var(--uui-icon);
491
+ --uui-labeled-input-info-fill: var(--uui-icon);
492
+ --uui-labeled-input-optional-text: var(--uui-text-secondary);
493
+ --uui-labeled-input-asterisk: var(--uui-error);
494
+
495
+ --uui-labeled-input-font: var(--font-semibold);
496
+ --uui-labeled-input-optional-font: var(--font-italic);
497
+ --uui-labeled-input-invalid-msg-font: var(--font-regular);
498
+
499
+ /* Accordion */
500
+ --uui-accordion-bg: var(--uui-surface);
501
+ --uui-accordion-border: var(--uui-divider);
502
+ --uui-accordion-border-radius: 6px;
503
+ --uui-accordion-text: var(--uui-text-primary);
504
+ --uui-accordion-text-disabled: var(--uui-text-disabled);
505
+ --uui-accordion-icon: var(--uui-icon);
506
+ --uui-accordion-icon-disabled: var(--uui-text-input-icon-disabled);
507
+ --uui-accordion-focus: var(--uui-primary);
508
+ --uui-accordion-shadow: var(--uui-shadow-level-1);
509
+ --uui-accordion-shadow-hovered: var(--uui-shadow-level-2);
510
+
511
+ --uui-accordion-toggler-font: var(--font-semibold);
512
+ --uui-accordion-body-font: var(--font-regular);
513
+
514
+ /* Switch */
515
+ --uui-switch-bg: var(--uui-control_switch-bg);
516
+ --uui-switch-border-hover: var(--uui-control_switch-border-hover);
517
+ --uui-switch-bg-checked: var(--uui-control-bg-checked);
518
+ --uui-switch-bg-hover: var(--uui-control-bg-hover);
519
+ --uui-switch-bg-disabled: var(--uui-control-bg-disabled);
520
+ --uui-switch-bg-checked-hover: var(--uui-control-bg-checked-hover);
521
+ --uui-switch-bg-checked-disabled: var(--uui-control-bg-checked-disabled);
522
+ --uui-switch-border: var(--uui-control-border);
523
+ --uui-switch-border-checked: var(--uui-control-border-checked);
524
+ --uui-switch-border-disabled: var(--uui-control-border-disabled);
525
+ --uui-switch-border-checked-hover: var(--uui-control-border-checked-hover);
526
+ --uui-switch-border-checked-hover-copy: var(--uui-control-border-checked-hover);
527
+ --uui-switch-border-checked-disabled: var(--uui-control-border-checked-disabled);
528
+ --uui-switch-label: var(--uui-control-label);
529
+ --uui-switch-label-disabled: var(--uui-control-label-disabled);
530
+ --uui-switch-toggler-bg: var(--uui-control_switch_toggler-bg);
531
+ --uui-switch-toggler-bg-disabled: var(--uui-control-bg-disabled);
532
+ --uui-switch-toggler-border-checked: var(--uui-control-bg-checked);
533
+ --uui-switch-toggler-border-hover: var(--uui-control-bg-hover);
534
+ --uui-switch-toggler-border-disabled: var(--uui-control-border-disabled);
535
+ --uui-switch-toggler-border-checked-hover: var(--uui-control-bg-checked-hover);
536
+ --uui-switch-toggler-border-checked-disabled: var(--uui-control-bg-checked-disabled);
537
+
538
+ --uui-switch-font: var(--font-regular);
539
+
540
+ /* DropdownContainer */
541
+ --uui-dropdown-container-border-radius: 6px;
542
+ --uui-dropdown-container-shadow: var(--uui-shadow-level-2);
543
+ --uui-dropdown-container-bg: var(--uui-surface);
544
+
545
+ /* DropdownMenu */
546
+ // TODO: update tokens
547
+ --uui-dropdown-menu-bg: var(--uui-surface);
548
+ --uui-dropdown-menu-shadow: var(--uui-shadow-level-2);
549
+ --uui-dropdown-menu-splitter: var(--uui-divider);
550
+ --uui-dropdown-menu-item-hover: var(--uui-surface-hover);
551
+ --uui-dropdown-menu-item-active: var(--uui-surface-hover);
552
+ --uui-dropdown-menu-item-text: var(--uui-text-primary);
553
+
554
+ --uui-dropdown-menu-body-font: var(--font-regular);
555
+ --uui-dropdown-menu-item-font: var(--font-regular);
556
+
557
+ /* MainMenu */
558
+ --uui-main_menu-text: var(--uui-text-contrast);
559
+ --uui-main_menu-text-active: var(--uui-text-contrast);
560
+ --uui-main_menu-bg: var(--uui-surface-contrast);
561
+ --uui-main_menu-hover: var(--uui-surface-contrast-hover);
562
+ --uui-main_menu-active: var(--uui-surface-contrast-active);
563
+ --uui-main_menu-border-active: var(--uui-primary);
564
+
565
+ --uui-main_menu-dropdown-bg: var(--uui-surface-inverted);
566
+ --uui-main_menu-dropdown-hover: var(--uui-primary);
567
+ --uui-main_menu-dropdown-shadow: none;
568
+ --uui-main_menu-dropdown-border-radius: none;
569
+
570
+ --uui-main_menu-search-bg: var(--uui-secondary-darkest);
571
+ --uui-main_menu-search-border: var(--uui-secondary-darkest);
572
+ --uui-main_menu-search-placeholder: var(--uui-text-disabled);
573
+ --uui-main_menu-search-text: var(--uui-contrast);
574
+ --uui-main_menu-search-icon: var(--uui-icon-disabled);
575
+
576
+ --uui-main_menu-icon: var(--uui-text-contrast);
577
+ --uui-main_menu-icon-hover: var(--uui-text-contrast);
578
+ --uui-main_menu-icon-active: var(--uui-text-contrast);
579
+
580
+ --uui-main_menu-font: var(--font-semibold);
581
+ --uui-main_menu-search-font: var(--font-regular);
582
+
583
+ /* BurgerMenu */
584
+ --uui-burger_menu-bg: var(--uui-surface-inverted);
585
+ --uui-burger_menu-bg-hover: var(--uui-primary-dark);
586
+ --uui-burger_menu-caption: var(--uui-text-contrast);
587
+ --uui-burger_menu-caption-hover: var(--uui-primary);
588
+ --uui-burger_menu-overlay: var(--uui-overlay);
589
+ --uui-burger_icon: var(--uui-text-contrast);
590
+ --uui-burger_item: var(--uui-text-brand);
591
+
592
+ /* BurgerGroupHeader */
593
+ --uui-burger_group-text: var(--uui-text-disabled);
594
+ --uui-burger_group-bg: var(--uui-surface-contrast);
595
+ --uui-burger_group-line: var(--uui-text-secondary);
596
+
597
+ --uui-burger_group-font: var(--font-regular);
598
+
599
+ /* BurgerButton */
600
+ --uui-burger_btn_caption: var(--uui-text-contrast);
601
+ --uui-burger_btn_caption-hover: var(--uui-primary);
602
+ --uui-burger_btn_caption-active: var(--uui-primary);
603
+ --uui-burger_btn-border: var(--uui-disabled);
604
+
605
+ --uui-burger_btn-font: var(--font-regular);
606
+
607
+ /* BurgerSearch */
608
+ --uui-burger_search: var(--uui-text-contrast);
609
+ --uui-burger_search-fill: var(--uui-text-disabled);
610
+ --uui-burger_search-bg: var(--uui-surface-contrast);
611
+ --uui-burger_search-placeholder: var(--uui-text-disabled);
612
+
613
+ --uui-burger_search-font: var(--font-regular);
614
+
615
+ /* NumericInput */
616
+ --uui-numeric-input-bg: var(--uui-control-bg);
617
+ --uui-numeric-input-bg-disabled: var(--uui-control-bg-disabled);
618
+ --uui-numeric-input-border: var(--uui-control-border);
619
+ --uui-numeric-input-border-disabled: var(--uui-control-border-disabled);
620
+ --uui-numeric-input-border-hover: var(--uui-control_textinput-border-hover);
621
+ --uui-numeric-input-border-active: var(--uui-control-border-checked);
622
+ --uui-numeric-input-border-error: var(--uui-negative);
623
+ --uui-numeric-input-placeholder: var(--uui-control-placeholder);
624
+ --uui-numeric-input-text: var(--uui-control-text);
625
+ --uui-numeric-input-text-disabled: var(--uui-control-text-disabled);
626
+ --uui-numeric-input-icon-clickable: var(--uui-icon);
627
+ --uui-numeric-input-icon-clickable-hover: var(--uui-icon-hover);
628
+ --uui-numeric-input-border-radius: var(--uui-border-radius);
629
+
630
+ /* TimePicker */
631
+ --uui-time-picker-bg: var(--uui-control-bg);
632
+ --uui-time-picker-bg-disabled: var(--uui-control-bg-disabled);
633
+ --uui-time-picker-border: var(--uui-control-border);
634
+ --uui-time-picker-border-disabled: var(--uui-control-border-disabled);
635
+ --uui-time-picker-border-hover: var(--uui-control_textinput-border-hover);
636
+ --uui-time-picker-border-active: var(--uui-control-border-checked);
637
+ --uui-time-picker-border-error: var(--uui-negative);
638
+ --uui-time-picker-placeholder: var(--uui-control-placeholder);
639
+ --uui-time-picker-text: var(--uui-control-text);
640
+ --uui-time-picker-text-disabled: var(--uui-control-text-disabled);
641
+ --uui-time-picker-icon-clickable: var(--uui-icon);
642
+ --uui-time-picker-icon-clickable-hover: var(--uui-icon-hover);
643
+ --uui-time-picker-border-radius: var(--uui-border-radius);
644
+
645
+ /* SearchPicker */
646
+ --uui-search-input-bg: var(--uui-control-bg);
647
+ --uui-search-input-bg-disabled: var(--uui-control-bg-disabled);
648
+ --uui-search-input-border: var(--uui-control-border);
649
+ --uui-search-input-border-disabled: var(--uui-control-border-disabled);
650
+ --uui-search-input-border-hover: var(--uui-control_textinput-border-hover);
651
+ --uui-search-input-border-active: var(--uui-control-border-checked);
652
+ --uui-search-input-border-error: var(--uui-negative);
653
+ --uui-search-input-placeholder: var(--uui-control-placeholder);
654
+ --uui-search-input-text: var(--uui-control-text);
655
+ --uui-search-input-text-disabled: var(--uui-control-text-disabled);
656
+ --uui-search-input-icon-clickable: var(--uui-icon);
657
+ --uui-search-input-icon-clickable-hover: var(--uui-icon-hover);
658
+ --uui-search-input-icon-disabled: var(--uui-icon-disabled);
659
+ --uui-search-input-border-radius: var(--uui-border-radius);
660
+
661
+ /* Popover */
662
+ --uui-popover-shadow: var(--uui-shadow-level-2);
663
+
664
+ /* Footer */
665
+ --uui-footer-bg: var(--uui-surface-contrast);
666
+
667
+ /* FilterPanelItemToggler vars */
668
+ --uui-filters-toggler-border: var(--uui-text-input-border);
669
+ --uui-filters-toggler-border-hover: var(--uui-text-input-border-hover);
670
+ --uui-filters-toggler-border-radius: var(--uui-border-radius);
671
+ --uui-filters-toggler-bg: var(--uui-surface);
672
+ --uui-filters-toggler-bg-hover: var(--uui-surface-light-hover);
673
+ --uui-filters-toggler-text: var(--uui-text-brand);
674
+ --uui-filters-toggler-label: var(--uui-text-secondary);
675
+ --uui-filters-toggler-icon: var(--uui-text-input-icon-clickable);
676
+ --uui-filters-toggler-shadow: none;
677
+
678
+ --uui-filters-toggler-font: var(--font-regular);
679
+ --uui-filters-panel-header-font: var(--font-regular);
680
+
681
+ /* NotificationCard */
682
+ --uui-notification-card-border-radius: var(--uui-border-radius);
683
+ --uui-notification-card-border-width: 0;
684
+ --uui-notification-card-border-top-width: 6px;
685
+ --uui-notification-card-shadow: var(--uui-shadow-level-2); //TODO: may change in the future
686
+
687
+ /* Alert */
688
+ --uui-alert-border-radius: 6px;
689
+
690
+ /* Panel */
691
+
692
+ --uui-panel-bg: var(--uui-surface);
693
+
694
+ /* Spinner */
695
+ --uui-spinner: var(--uui-primary);
696
+
697
+ /* Blocker */
698
+ --uui-blocker-bg: var(--uui-background);
699
+ --uui-blocker-bg-with-opacity: #F5F6FA80;
700
+
701
+ /* FlexRow */
702
+ --uui-flex-row-border-bottom: 1px solid var(--uui-divider);
703
+
704
+ /* DataTable vars */
705
+ --uui-dt-border: var(--uui-divider-light);
706
+
707
+ --uui-dt-cell-bg: transparent;
708
+ --uui-dt-cell-bg-resize: #EF55331F;
709
+ --uui-dt-cell-bg-invalid: var(--uui-negative-lightest);
710
+ --uui-dt-cell-border-hover: var(--uui-control_textinput-border-hover);
711
+ --uui-dt-cell-border-focus: var(--uui-control-border-checked);
712
+
713
+ --uui-dt-row-bg: var(--uui-surface);
714
+ --uui-dt-row-bg-hover: var(--uui-surface-light-hover);
715
+ --uui-dt-row-bg-invalid: #FEF7F6;
716
+ --uui-dt-row-bg-selected: #EBF7FF;
717
+
718
+ --uui-dt-header-row-bg: var(--uui-surface-light);
719
+ --uui-dt-header-row-bg-hover: var(--uui-surface-hover);
720
+
721
+ --uui-dt-top-shadow: linear-gradient(to bottom, rgba(0, 0, 0, 0.05) 0%, rgba(0, 0, 0, 0) 100%);
722
+ --uui-dt-left-shadow: linear-gradient(to left, rgba(0, 0, 0, 0.05) 0%, rgba(0, 0, 0, 0) 100%);
723
+ --uui-dt-right-shadow: linear-gradient(to right, rgba(0, 0, 0, 0.05) 0%, rgba(0, 0, 0, 0) 100%);
724
+ --uui-dt_header-drop_marker: var(--uui-primary);
725
+
726
+ --uui-dt-header-cell-font: var(--font-semibold);
727
+
728
+ /* AvatarStack */
729
+
730
+ --uui-avatar-stack-font: var(--font-semibold);
731
+
732
+ /* Badge */
733
+
734
+ --uui-badge-font: var(--font-regular);
735
+ --uui-badge-count-font: var(--font-semibold);
736
+
737
+ /* Pagination */
738
+
739
+ --uui-pagination-font: var(--font-regular);
740
+
741
+
742
+ /* ------------------------------------ */
743
+
744
+ .tooltip-contrast,
745
+ .tooltip-gray {
746
+ --uui-tooltip-bg: var(--uui-surface-contrast);
747
+ --uui-tooltip-text: var(--uui-contrast);
748
+ }
749
+
750
+ .tooltip-default,
751
+ .tooltip-white {
752
+ --uui-tooltip-bg: var(--uui-surface);
753
+ --uui-tooltip-text: var(--uui-text-primary);
754
+ }
755
+
756
+ .tooltip-critical,
757
+ .tooltip-fire {
758
+ --uui-tooltip-bg: var(--uui-error-dark);
759
+ --uui-tooltip-text: var(--uui-contrast);
760
+ }
761
+
762
+ .button-sky, .button-primary {
763
+ --uui-btn-bg: var(--uui-primary);
764
+ --uui-btn-bg-hover: var(--uui-primary-dark);
765
+ --uui-btn-bg-active: var(--uui-primary-darkest);
766
+ --uui-btn-bg-halftone: var(--uui-button-bg-halftone);
767
+ --uui-btn-bg-halftone-hover: var(--uui-primary-lightest);
768
+ --uui-btn-bg-halftone-active: var(--uui-primary-light);
769
+ --uui-btn-border: var(--uui-primary);
770
+ --uui-btn-border-hover: var(--uui-primary-dark);
771
+ --uui-btn-border-active: var(--uui-primary-darkest);
772
+ --uui-btn-bg-disabled: var(--uui-disabled);
773
+ --uui-btn-border-disabled: var(--uui-disabled);
774
+ --uui-btn-caption: var(--uui-contrast);
775
+ --uui-btn-caption-halftone: var(--uui-primary);
776
+ --uui-btn-caption-disabled: var(--uui-button-caption-disabled);
777
+ }
778
+
779
+ .button-accent, .button-grass {
780
+ --uui-btn-bg: var(--uui-accent);
781
+ --uui-btn-bg-hover: var(--uui-accent-dark);
782
+ --uui-btn-bg-active: var(--uui-accent-darkest);
783
+ --uui-btn-bg-halftone: var(--uui-button-bg-halftone);
784
+ --uui-btn-bg-halftone-hover: var(--uui-accent-lightest);
785
+ --uui-btn-bg-halftone-active: var(--uui-accent-light);
786
+ --uui-btn-border: var(--uui-accent);
787
+ --uui-btn-border-hover: var(--uui-accent-dark);
788
+ --uui-btn-border-active: var(--uui-accent-darkest);
789
+ --uui-btn-bg-disabled: var(--uui-disabled);
790
+ --uui-btn-border-disabled: var(--uui-disabled);
791
+ --uui-btn-caption: var(--uui-contrast);
792
+ --uui-btn-caption-halftone: var(--uui-accent);
793
+ --uui-btn-caption-disabled: var(--uui-button-caption-disabled);
794
+ }
795
+
796
+ .button-fire, .button-negative {
797
+ --uui-btn-bg: var(--uui-negative);
798
+ --uui-btn-bg-hover: var(--uui-negative-dark);
799
+ --uui-btn-bg-active: var(--uui-negative-darkest);
800
+ --uui-btn-bg-halftone: var(--uui-button-bg-halftone);
801
+ --uui-btn-bg-halftone-hover: var(--uui-negative-lightest);
802
+ --uui-btn-bg-halftone-active: var(--uui-negative-light);
803
+ --uui-btn-border: var(--uui-negative);
804
+ --uui-btn-border-hover: var(--uui-negative-dark);
805
+ --uui-btn-border-active: var(--uui-negative-darkest);
806
+ --uui-btn-bg-disabled: var(--uui-disabled);
807
+ --uui-btn-border-disabled: var(--uui-disabled);
808
+ --uui-btn-caption: var(--uui-contrast);
809
+ --uui-btn-caption-halftone: var(--uui-negative);
810
+ --uui-btn-caption-disabled: var(--uui-button-caption-disabled);
811
+ }
812
+
813
+ .button-night500,
814
+ .button-night600,
815
+ .button-gray,
816
+ .button-secondary {
817
+ --uui-btn-bg: var(--uui-secondary);
818
+ --uui-btn-bg-hover: var(--uui-secondary-dark);
819
+ --uui-btn-bg-active: var(--uui-secondary-darkest);
820
+ --uui-btn-bg-halftone: var(--uui-button-bg-halftone);
821
+ --uui-btn-bg-halftone-hover: var(--uui-secondary-lightest);
822
+ --uui-btn-bg-halftone-active: var(--uui-secondary-light);
823
+ --uui-btn-border: var(--uui-secondary);
824
+ --uui-btn-border-hover: var(--uui-secondary-dark);
825
+ --uui-btn-border-active: var(--uui-secondary-darkest);
826
+ --uui-btn-bg-disabled: var(--uui-disabled);
827
+ --uui-btn-border-disabled: var(--uui-disabled);
828
+ --uui-btn-caption: var(--uui-contrast);
829
+ --uui-btn-caption-halftone: var(--uui-secondary-dark);
830
+ --uui-btn-caption-disabled: var(--uui-button-caption-disabled);
831
+ }
832
+
833
+ .button-white {
834
+ --uui-btn-bg: var(--uui-contrast);
835
+ --uui-btn-bg-hover: var(--uui-color-white-800);
836
+ --uui-btn-bg-active: var(--uui-color-white-900);
837
+ --uui-btn-bg-halftone: var(--uui-button-bg-halftone);
838
+ --uui-btn-bg-halftone-hover: var(--uui-secondary-lightest);
839
+ --uui-btn-bg-halftone-active: var(--uui-secondary-light);
840
+ --uui-btn-border: var(--uui-contrast);
841
+ --uui-btn-border-hover: var(--uui-color-white-800);
842
+ --uui-btn-border-active: var(--uui-color-white-900);
843
+ --uui-btn-bg-disabled: var(--uui-disabled);
844
+ --uui-btn-border-disabled: var(--uui-disabled);
845
+ --uui-btn-caption: var(--night800);
846
+ --uui-btn-caption-halftone: var(--uui-secondary-dark);
847
+ --uui-btn-caption-disabled: var(--uui-button-caption-disabled);
848
+ }
849
+
850
+ .link-button-primary,
851
+ .link-button-sky {
852
+ --uui-link-button-text: var(--uui-primary);
853
+ --uui-link-button-text-hover: var(--uui-primary-dark);
854
+ --uui-link-button-text-active: var(--uui-primary-darkest);
855
+ --uui-link-button-text-disabled: var(--uui-button-caption-disabled);
856
+ }
857
+
858
+ .link-button-secondary,
859
+ .link-button-night600 {
860
+ --uui-link-button-text: var(--uui-secondary);
861
+ --uui-link-button-text-hover: var(--uui-secondary-dark);
862
+ --uui-link-button-text-active: var(--uui-secondary-darkest);
863
+ --uui-link-button-text-disabled: var(--uui-button-caption-disabled);
864
+ }
865
+
866
+ .link-button-contrast,
867
+ .link-button-night100 {
868
+ --uui-link-button-text: var(--night100);
869
+ --uui-link-button-text-hover: var(--uui-color-night100-800);
870
+ --uui-link-button-text-active: var(--uui-color-night100-900);
871
+ --uui-link-button-text-disabled: var(--uui-button-caption-disabled);
872
+ }
873
+
874
+ .link-button-grass {
875
+ --uui-link-button-text: var(--grass);
876
+ --uui-link-button-text-hover: var(--grass-dark);
877
+ --uui-link-button-text-active: var(--grass-darkest);
878
+ --uui-link-button-text-disabled: var(--uui-button-caption-disabled);
879
+ }
880
+
881
+ .link-button-sun {
882
+ --uui-link-button-text: var(--sun);
883
+ --uui-link-button-text-hover: var(--sun-dark);
884
+ --uui-link-button-text-active: var(--sun-darkest);
885
+ --uui-link-button-text-disabled: var(--uui-button-caption-disabled);
886
+ }
887
+
888
+ .link-button-fire {
889
+ --uui-link-button-text: var(--fire);
890
+ --uui-link-button-text-hover: var(--fire-dark);
891
+ --uui-link-button-text-active: var(--fire-darkest);
892
+ --uui-link-button-text-disabled: var(--uui-button-caption-disabled);
893
+ }
894
+
895
+ .link-button-cobalt {
896
+ --uui-link-button-text: var(--cobalt-30);
897
+ --uui-link-button-text-hover: var(--cobalt-40);
898
+ --uui-link-button-text-active: var(--cobalt-50);
899
+ --uui-link-button-text-disabled: var(--uui-button-caption-disabled);
900
+ }
901
+
902
+ .link-button-lavanda {
903
+ --uui-link-button-text: var(--lavanda-30);
904
+ --uui-link-button-text-hover: var(--lavanda-40);
905
+ --uui-link-button-text-active: var(--lavanda-50);
906
+ --uui-link-button-text-disabled: var(--uui-button-caption-disabled);
907
+ }
908
+
909
+ .link-button-fuchsia {
910
+ --uui-link-button-text: var(--fuchia-30);
911
+ --uui-link-button-text-hover: var(--fuchia-40);
912
+ --uui-link-button-text-active: var(--fuchia-50);
913
+ --uui-link-button-text-disabled: var(--uui-button-caption-disabled);
914
+ }
915
+
916
+ .link-button-white {
917
+ --uui-link-button-text: var(--white);
918
+ --uui-link-button-text-hover: var(--uui-color-white-800);
919
+ --uui-link-button-text-active: var(--uui-color-white-900);
920
+ --uui-link-button-text-disabled: var(--uui-button-caption-disabled);
921
+ }
922
+
923
+ .link-button-night50 {
924
+ --uui-link-button-text: var(--night50);
925
+ --uui-link-button-text-hover: var(--uui-color-night50-800);
926
+ --uui-link-button-text-active: var(--uui-color-night50-900);
927
+ --uui-link-button-text-disabled: var(--uui-button-caption-disabled);
928
+ }
929
+
930
+ .link-button-night200 {
931
+ --uui-link-button-text: var(--night200);
932
+ --uui-link-button-text-hover: var(--uui-color-night200-800);
933
+ --uui-link-button-text-active: var(--uui-color-night200-900);
934
+ --uui-link-button-text-disabled: var(--uui-icon-disabled);
935
+ }
936
+
937
+ .link-button-night300 {
938
+ --uui-link-button-text: var(--night300);
939
+ --uui-link-button-text-hover: var(--uui-color-night300-800);
940
+ --uui-link-button-text-active: var(--uui-color-night300-900);
941
+ --uui-link-button-text-disabled: var(--uui-icon-disabled);
942
+ }
943
+
944
+ .link-button-night400 {
945
+ --uui-link-button-text: var(--night400);
946
+ --uui-link-button-text-hover: var(--uui-color-night400-800);
947
+ --uui-link-button-text-active: var(--uui-color-night400-900);
948
+ --uui-link-button-text-disabled: var(--uui-icon-disabled);
949
+ }
950
+
951
+ .link-button-night500 {
952
+ --uui-link-button-text: var(--night500);
953
+ --uui-link-button-text-hover: var(--uui-color-night500-800);
954
+ --uui-link-button-text-active: var(--uui-color-night500-900);
955
+ --uui-link-button-text-disabled: var(--uui-icon-disabled);
956
+ }
957
+
958
+ .link-button-night700 {
959
+ --uui-link-button-text: var(--night700);
960
+ --uui-link-button-text-hover: var(--uui-color-night700-800);
961
+ --uui-link-button-text-active: var(--uui-color-night700-900);
962
+ --uui-link-button-text-disabled: var(--uui-icon-disabled);
963
+ }
964
+
965
+ .link-button-night800 {
966
+ --uui-link-button-text: var(--night800);
967
+ --uui-link-button-text-hover: var(--uui-color-night800-800);
968
+ --uui-link-button-text-active: var(--uui-color-night800-900);
969
+ --uui-link-button-text-disabled: var(--uui-icon-disabled);
970
+ }
971
+
972
+ .link-button-night900 {
973
+ --uui-link-button-text: var(--night900);
974
+ --uui-link-button-text-hover: var(--uui-color-night900-800);
975
+ --uui-link-button-text-active: var(--uui-color-night900-900);
976
+ --uui-link-button-text-disabled: var(--uui-icon-disabled);
977
+ }
978
+
979
+ .icon-button-sky,
980
+ .icon-button-info {
981
+ --uui-icon-btn: var(--uui-info);
982
+ --uui-icon-btn-hover: var(--uui-info-dark);
983
+ --uui-icon-btn-active: var(--uui-info-darkest);
984
+ --uui-icon-btn-disabled: var(--uui-icon-disabled);
985
+ }
986
+
987
+ .icon-button-grass,
988
+ .icon-button-success {
989
+ --uui-icon-btn: var(--uui-success);
990
+ --uui-icon-btn-hover: var(--uui-success-dark);
991
+ --uui-icon-btn-active: var(--uui-success-darkest);
992
+ --uui-icon-btn-disabled: var(--uui-icon-disabled);
993
+ }
994
+
995
+ .icon-button-sun,
996
+ .icon-button-warning {
997
+ --uui-icon-btn: var(--uui-warning);
998
+ --uui-icon-btn-hover: var(--uui-warning-dark);
999
+ --uui-icon-btn-active: var(--uui-warning-darkest);
1000
+ --uui-icon-btn-disabled: var(--uui-icon-disabled);
1001
+ }
1002
+
1003
+ .icon-button-fire,
1004
+ .icon-button-error {
1005
+ --uui-icon-btn: var(--uui-error);
1006
+ --uui-icon-btn-hover: var(--uui-error-dark);
1007
+ --uui-icon-btn-active: var(--uui-error-darkest);
1008
+ --uui-icon-btn-disabled: var(--uui-icon-disabled);
1009
+ }
1010
+
1011
+ .icon-button-cobalt {
1012
+ --uui-icon-btn: var(--cobalt-30);
1013
+ --uui-icon-btn-hover: var(--cobalt-40);
1014
+ --uui-icon-btn-active: var(--cobalt-50);
1015
+ --uui-icon-btn-disabled: var(--uui-icon-disabled);
1016
+ }
1017
+
1018
+ .icon-button-lavanda {
1019
+ --uui-icon-btn: var(--lavanda-30);
1020
+ --uui-icon-btn-hover: var(--lavanda-40);
1021
+ --uui-icon-btn-active: var(--lavanda-50);
1022
+ --uui-icon-btn-disabled: var(--uui-icon-disabled);
1023
+ }
1024
+
1025
+ .icon-button-fuchsia {
1026
+ --uui-icon-btn: var(--fuchia-30);
1027
+ --uui-icon-btn-hover: var(--fuchia-40);
1028
+ --uui-icon-btn-active: var(--fuchia-50);
1029
+ --uui-icon-btn-disabled: var(--uui-icon-disabled);
1030
+ }
1031
+
1032
+ .icon-button-white {
1033
+ --uui-icon-btn: var(--white);
1034
+ --uui-icon-btn-hover: var(--uui-color-white-800);
1035
+ --uui-icon-btn-active: var(--uui-color-white-900);
1036
+ --uui-icon-btn-disabled: var(--uui-icon-disabled);
1037
+ }
1038
+
1039
+ .icon-button-night200 {
1040
+ --uui-icon-btn: var(--night200);
1041
+ --uui-icon-btn-hover: var(--uui-color-night200-800);
1042
+ --uui-icon-btn-active: var(--uui-color-night200-900);
1043
+ --uui-icon-btn-disabled: var(--uui-icon-disabled);
1044
+ }
1045
+
1046
+ .icon-button-night300 {
1047
+ --uui-icon-btn: var(--night300);
1048
+ --uui-icon-btn-hover: var(--uui-color-night300-800);
1049
+ --uui-icon-btn-active: var(--uui-color-night300-900);
1050
+ --uui-icon-btn-disabled: var(--uui-icon-disabled);
1051
+ }
1052
+
1053
+ .icon-button-night400 {
1054
+ --uui-icon-btn: var(--night400);
1055
+ --uui-icon-btn-hover: var(--uui-color-night400-800);
1056
+ --uui-icon-btn-active: var(--uui-color-night400-900);
1057
+ --uui-icon-btn-disabled: var(--uui-icon-disabled);
1058
+ }
1059
+
1060
+ .icon-button-night500 {
1061
+ --uui-icon-btn: var(--night500);
1062
+ --uui-icon-btn-hover: var(--uui-color-night500-800);
1063
+ --uui-icon-btn-active: var(--uui-color-night500-900);
1064
+ --uui-icon-btn-disabled: var(--uui-icon-disabled);
1065
+ }
1066
+
1067
+ .icon-button-night600,
1068
+ .icon-button-secondary,
1069
+ .icon-button-default {
1070
+ --uui-icon-btn: var(--night600);
1071
+ --uui-icon-btn-hover: var(--uui-icon-hover);
1072
+ --uui-icon-btn-active: var(--uui-icon-active);
1073
+ --uui-icon-btn-disabled: var(--uui-icon-disabled);
1074
+ }
1075
+
1076
+ .notification-card-sun,
1077
+ .notification-card-warning {
1078
+ --uui-notification-card-fill: var(--uui-warning);
1079
+ --uui-notification-card-border: var(--uui-warning);
1080
+ --uui-notification-card-bg: var(--uui-surface);
1081
+ --uui-notification-card-text: var(--uui-text-primary);
1082
+ }
1083
+
1084
+ .notification-card-success,
1085
+ .notification-card-grass {
1086
+ --uui-notification-card-fill: var(--uui-success);
1087
+ --uui-notification-card-border: var(--uui-success);
1088
+ --uui-notification-card-bg: var(--uui-surface);
1089
+ --uui-notification-card-text: var(--uui-text-primary);
1090
+ }
1091
+
1092
+ .notification-card-info,
1093
+ .notification-card-sky {
1094
+ --uui-notification-card-fill: var(--uui-info);
1095
+ --uui-notification-card-border: var(--uui-info);
1096
+ --uui-notification-card-bg: var(--uui-surface);
1097
+ --uui-notification-card-text: var(--uui-text-primary);
1098
+ }
1099
+
1100
+ .notification-card-error,
1101
+ .notification-card-fire {
1102
+ --uui-notification-card-fill: var(--uui-error);
1103
+ --uui-notification-card-border: var(--uui-error);
1104
+ --uui-notification-card-bg: var(--uui-surface);
1105
+ --uui-notification-card-text: var(--uui-text-primary);
1106
+ }
1107
+
1108
+ .notification-card-night600 {
1109
+ --uui-notification-card-fill: var(--night600);
1110
+ --uui-notification-card-border: var(--night600);
1111
+ --uui-notification-card-bg: var(--uui-surface);
1112
+ --uui-notification-card-text: var(--uui-text-primary);
1113
+ }
1114
+
1115
+ .alert-error,
1116
+ .alert-fire {
1117
+ --uui-alert-text: var(--uui-text-primary);
1118
+ --uui-alert-bg: #F5E5E9;
1119
+ --uui-alert-border: var(--uui-error);
1120
+ --uui-alert-icon: var(--uui-error);
1121
+ }
1122
+
1123
+ .alert-warning,
1124
+ .alert-sun {
1125
+ --uui-alert-text: var(--uui-text-primary);
1126
+ --uui-alert-bg: #F6EEE1;
1127
+ --uui-alert-border: var(--uui-warning);
1128
+ --uui-alert-icon: var(--uui-warning);
1129
+ }
1130
+
1131
+
1132
+ .alert-success,
1133
+ .alert-grass {
1134
+ --uui-alert-text: var(--uui-text-primary);
1135
+ --uui-alert-bg: #E7EEE1;
1136
+ --uui-alert-border: var(--uui-success);
1137
+ --uui-alert-icon: var(--uui-success);
1138
+ }
1139
+
1140
+ .alert-info,
1141
+ .alert-sky {
1142
+ --uui-alert-text: var(--uui-text-primary);
1143
+ --uui-alert-bg: #DCEDF6;
1144
+ --uui-alert-border: var(--uui-info);
1145
+ --uui-alert-icon: var(--uui-info);
1146
+ }
1147
+
1148
+ .badge-default, .badge-night300 {
1149
+ --uui-badge-bg: var(--night300);
1150
+ --uui-badge-bg-hover: var(--night400);
1151
+ --uui-badge-caption-solid: var(--uui-text-primary);
1152
+ --uui-badge-count-bg: var(--white);
1153
+ --uui-badge-count: var(--uui-text-secondary);
1154
+ --uui-badge-bg-halftone: var(--night200);
1155
+ --uui-badge-bg-halftone-hover: var(--night300);
1156
+ --uui-badge-border-halftone: var(--night400);
1157
+ --uui-badge-border-halftone-hover: var(--night500);
1158
+ --uui-badge-caption-halftone: var(--uui-text-primary);
1159
+ }
1160
+
1161
+ .badge-info, .badge-sky {
1162
+ --uui-badge-bg: var(--uui-info);
1163
+ --uui-badge-bg-hover: var(--uui-info-dark);
1164
+ --uui-badge-caption-solid: var(--uui-text-contrast);
1165
+ --uui-badge-count-bg: var(--white);
1166
+ --uui-badge-count: var(--uui-text-secondary);
1167
+ --uui-badge-bg-halftone: var(--uui-info-lightest);
1168
+ --uui-badge-bg-halftone-hover: var(--uui-info-light);
1169
+ --uui-badge-border-halftone: var(--uui-info-light);
1170
+ --uui-badge-border-halftone-hover: var(--uui-info);
1171
+ --uui-badge-caption-halftone: var(--uui-info-darkest);
1172
+ }
1173
+
1174
+ .badge-success, .badge-grass {
1175
+ --uui-badge-bg: var(--uui-success);
1176
+ --uui-badge-bg-hover: var(--uui-success-dark);
1177
+ --uui-badge-caption-solid: var(--uui-text-contrast);
1178
+ --uui-badge-count-bg: var(--white);
1179
+ --uui-badge-count: var(--uui-text-secondary);
1180
+ --uui-badge-bg-halftone: var(--uui-success-lightest);
1181
+ --uui-badge-bg-halftone-hover: var(--uui-success-light);
1182
+ --uui-badge-border-halftone: var(--uui-success-light);
1183
+ --uui-badge-border-halftone-hover: var(--uui-success);
1184
+ --uui-badge-caption-halftone: var(--uui-success-darkest);
1185
+ }
1186
+
1187
+ .badge-warning, .badge-sun {
1188
+ --uui-badge-bg: var(--uui-warning);
1189
+ --uui-badge-bg-hover: var(--uui-warning-dark);
1190
+ --uui-badge-caption-solid: var(--uui-text-primary);
1191
+ --uui-badge-count-bg: var(--white);
1192
+ --uui-badge-count: var(--uui-text-secondary);
1193
+ --uui-badge-bg-halftone: var(--uui-warning-lightest);
1194
+ --uui-badge-bg-halftone-hover: var(--uui-warning-light);
1195
+ --uui-badge-border-halftone: var(--uui-warning-light);
1196
+ --uui-badge-border-halftone-hover: var(--uui-warning);
1197
+ --uui-badge-caption-halftone: var(--uui-warning-darkest);
1198
+ }
1199
+
1200
+ .badge-error, .badge-fire {
1201
+ --uui-badge-bg: var(--uui-error);
1202
+ --uui-badge-bg-hover: var(--uui-error-dark);
1203
+ --uui-badge-caption-solid: var(--white);
1204
+ --uui-badge-count-bg: var(--white);
1205
+ --uui-badge-count: var(--uui-text-secondary);
1206
+ --uui-badge-bg-halftone: var(--uui-error-lightest);
1207
+ --uui-badge-bg-halftone-hover: var(--uui-error-light);
1208
+ --uui-badge-border-halftone: var(--uui-error-light);
1209
+ --uui-badge-border-halftone-hover: var(--uui-error);
1210
+ --uui-badge-caption-halftone: var(--uui-error-darkest);
1211
+ }
1212
+
1213
+ .badge-cobalt {
1214
+ --uui-badge-bg: var(--cobalt-30);
1215
+ --uui-badge-bg-hover: var(--cobalt-40);
1216
+ --uui-badge-caption-solid: var(--uui-text-contrast);
1217
+ --uui-badge-count-bg: var(--white);
1218
+ --uui-badge-count: var(--uui-text-secondary);
1219
+ --uui-badge-bg-halftone: var(--cobalt-10);
1220
+ --uui-badge-bg-halftone-hover: var(--cobalt-20);
1221
+ --uui-badge-border-halftone: var(--cobalt-30);
1222
+ --uui-badge-border-halftone-hover: var(--cobalt-40);
1223
+ --uui-badge-caption-halftone: var(--cobalt-50);
1224
+ }
1225
+
1226
+ .badge-lavanda {
1227
+ --uui-badge-bg: var(--lavanda-30);
1228
+ --uui-badge-bg-hover: var(--lavanda-40);
1229
+ --uui-badge-caption-solid: var(--white);
1230
+ --uui-badge-count-bg: var(--white);
1231
+ --uui-badge-count: var(--uui-text-secondary);
1232
+ --uui-badge-bg-halftone: var(--lavanda-10);
1233
+ --uui-badge-bg-halftone-hover: var(--lavanda-20);
1234
+ --uui-badge-border-halftone: var(--lavanda-30);
1235
+ --uui-badge-border-halftone-hover: var(--lavanda-40);
1236
+ --uui-badge-caption-halftone: var(--lavanda-50);
1237
+ }
1238
+
1239
+ .badge-fuchsia {
1240
+ --uui-badge-bg: var(--fuchia-30);
1241
+ --uui-badge-bg-hover: var(--fuchia-40);
1242
+ --uui-badge-caption-solid: var(--uui-text-contrast);
1243
+ --uui-badge-count-bg: var(--white);
1244
+ --uui-badge-count: var(--uui-text-secondary);
1245
+ --uui-badge-bg-halftone: var(--fuchia-10);
1246
+ --uui-badge-bg-halftone-hover: var(--fuchia-20);
1247
+ --uui-badge-border-halftone: var(--fuchia-30);
1248
+ --uui-badge-border-halftone-hover: var(--fuchia-40);
1249
+ --uui-badge-caption-halftone: var(--fuchia-50);
1250
+ }
1251
+
1252
+ .badge-white {
1253
+ --uui-badge-bg: var(--white);
1254
+ --uui-badge-bg-hover: var(--gray5);
1255
+ --uui-badge-caption-solid: var(--night800);
1256
+ --uui-badge-count-bg: var(--white);
1257
+ --uui-badge-count: var(--uui-text-secondary);
1258
+ --uui-badge-bg-halftone: var(--white);
1259
+ --uui-badge-bg-halftone-hover: var(--gray5);
1260
+ --uui-badge-border-halftone: var(--white);
1261
+ --uui-badge-border-halftone-hover: var(--gray5);
1262
+ --uui-badge-caption-halftone: var(--uui-text-secondary);
1263
+ }
1264
+
1265
+ .badge-night200 {
1266
+ --uui-badge-bg: var(--uui-color-night200-700);
1267
+ --uui-badge-bg-hover: var(--uui-color-night200-800);
1268
+ --uui-badge-caption-solid: var(--night800);
1269
+ --uui-badge-count-bg: var(--white);
1270
+ --uui-badge-count: var(--uui-text-secondary);
1271
+ --uui-badge-bg-halftone: var(--white);
1272
+ --uui-badge-bg-halftone-hover: var(--gray5);
1273
+ --uui-badge-border-halftone: var(--white);
1274
+ --uui-badge-border-halftone-hover: var(--gray5);
1275
+ --uui-badge-caption-halftone: var(--uui-text-secondary);
1276
+ }
1277
+
1278
+ .badge-night300 {
1279
+ --uui-badge-bg: var(--uui-color-night300-700);
1280
+ --uui-badge-bg-hover: var(--uui-color-night300-800);
1281
+ --uui-badge-caption-solid: var(--night800);
1282
+ --uui-badge-count-bg: var(--white);
1283
+ --uui-badge-count: var(--uui-text-secondary);
1284
+ --uui-badge-bg-halftone: var(--white);
1285
+ --uui-badge-bg-halftone-hover: var(--gray5);
1286
+ --uui-badge-border-halftone: var(--white);
1287
+ --uui-badge-border-halftone-hover: var(--gray5);
1288
+ --uui-badge-caption-halftone: var(--uui-text-secondary);
1289
+ }
1290
+
1291
+ .badge-night400 {
1292
+ --uui-badge-bg: var(--uui-color-night400-700);
1293
+ --uui-badge-bg-hover: var(--uui-color-night400-800);
1294
+ --uui-badge-caption-solid: var(--night800);
1295
+ --uui-badge-count-bg: var(--white);
1296
+ --uui-badge-count: var(--uui-text-secondary);
1297
+ --uui-badge-bg-halftone: var(--white);
1298
+ --uui-badge-bg-halftone-hover: var(--gray5);
1299
+ --uui-badge-border-halftone: var(--white);
1300
+ --uui-badge-border-halftone-hover: var(--gray5);
1301
+ --uui-badge-caption-halftone: var(--uui-text-secondary);
1302
+ }
1303
+
1304
+ .badge-night500 {
1305
+ --uui-badge-bg: var(--uui-color-night500-700);
1306
+ --uui-badge-bg-hover: var(--uui-color-night500-800);
1307
+ --uui-badge-caption-solid: var(--uui-text-contrast);
1308
+ --uui-badge-count-bg: var(--white);
1309
+ --uui-badge-count: var(--uui-text-secondary);
1310
+ --uui-badge-bg-halftone: var(--white);
1311
+ --uui-badge-bg-halftone-hover: var(--gray5);
1312
+ --uui-badge-border-halftone: var(--white);
1313
+ --uui-badge-border-halftone-hover: var(--gray5);
1314
+ --uui-badge-caption-halftone: var(--uui-text-secondary);
1315
+ }
1316
+
1317
+ .badge-night600 {
1318
+ --uui-badge-bg: var(--uui-color-night600-700);
1319
+ --uui-badge-bg-hover: var(--uui-color-night600-800);
1320
+ --uui-badge-caption-solid: var(--uui-text-contrast);
1321
+ --uui-badge-count-bg: var(--white);
1322
+ --uui-badge-count: var(--uui-text-secondary);
1323
+ --uui-badge-bg-halftone: var(--white);
1324
+ --uui-badge-bg-halftone-hover: var(--gray5);
1325
+ --uui-badge-border-halftone: var(--white);
1326
+ --uui-badge-border-halftone-hover: var(--gray5);
1327
+ --uui-badge-caption-halftone: var(--uui-text-secondary);
1328
+ }
1329
+
1330
+ .badge-violet {
1331
+ --uui-badge-bg: var(--lavanda-30);
1332
+ --uui-badge-bg-hover: var(--lavanda-40);
1333
+ --uui-badge-caption-solid: var(--uui-text-contrast);
1334
+ --uui-badge-count-bg: var(--white);
1335
+ --uui-badge-count: var(--uui-text-secondary);
1336
+ --uui-badge-bg-halftone: var(--lavanda-10);
1337
+ --uui-badge-bg-halftone-hover: var(--lavanda-20);
1338
+ --uui-badge-border-halftone: var(--lavanda-20);
1339
+ --uui-badge-border-halftone-hover: var(--lavanda-30);
1340
+ --uui-badge-caption-halftone: var(--lavanda-50);
1341
+ }
1342
+
1343
+ .badge-orange {
1344
+ --uui-badge-bg: var(--orange-30);
1345
+ --uui-badge-bg-hover: var(--orange-40);
1346
+ --uui-badge-caption-solid: var(--uui-text-contrast);
1347
+ --uui-badge-count-bg: var(--white);
1348
+ --uui-badge-count: var(--uui-text-secondary);
1349
+ --uui-badge-bg-halftone: var(--orange-10);
1350
+ --uui-badge-bg-halftone-hover: var(--orange-20);
1351
+ --uui-badge-border-halftone: var(--orange-20);
1352
+ --uui-badge-border-halftone-hover: var(--orange-30);
1353
+ --uui-badge-caption-halftone: var(--orange-50);
1354
+ }
1355
+
1356
+ .badge-purple {
1357
+ --uui-badge-bg: var(--purple-30);
1358
+ --uui-badge-bg-hover: var(--purple-40);
1359
+ --uui-badge-caption-solid: var(--uui-text-contrast);
1360
+ --uui-badge-count-bg: var(--white);
1361
+ --uui-badge-count: var(--uui-text-secondary);
1362
+ --uui-badge-bg-halftone: var(--purple-10);
1363
+ --uui-badge-bg-halftone-hover: var(--purple-20);
1364
+ --uui-badge-border-halftone: var(--purple-20);
1365
+ --uui-badge-border-halftone-hover: var(--purple-30);
1366
+ --uui-badge-caption-halftone: var(--purple-50);
1367
+ }
1368
+
1369
+ .informer-default {
1370
+ --uui-informer-bg: var(--night300);
1371
+ --uui-informer-caption: var(--night600);
1372
+ }
1373
+
1374
+ .informer-focus {
1375
+ --uui-informer-bg: var(--fire);
1376
+ --uui-informer-caption: var(--uui-contrast);
1377
+ }
1378
+
1379
+ .informer-white {
1380
+ --uui-informer-bg: var(--uui-surface);
1381
+ --uui-informer-caption: var(--uui-text-secondary);
1382
+ }
1383
+
1384
+ .uui-text-info,
1385
+ .uui-text-sky {
1386
+ --uui-text: var(--uui-text-info);
1387
+ }
1388
+
1389
+ .uui-text-success,
1390
+ .uui-text-grass {
1391
+ --uui-text: var(--uui-text-success);
1392
+ }
1393
+
1394
+ .uui-text-warning,
1395
+ .uui-text-sun {
1396
+ --uui-text: var(--uui-text-warning);
1397
+ }
1398
+
1399
+ .uui-text-error,
1400
+ .uui-text-fire {
1401
+ --uui-text: var(--uui-text-error);
1402
+ }
1403
+
1404
+ .uui-text-brand,
1405
+ .uui-text-night900 {
1406
+ --uui-text: var(--uui-text-brand);
1407
+ }
1408
+
1409
+ .uui-text-primary,
1410
+ .uui-text-night800 {
1411
+ --uui-text: var(--uui-text-primary);
1412
+ }
1413
+
1414
+ .uui-text-night700 {
1415
+ --uui-text: var(--night700);
1416
+ }
1417
+
1418
+ .uui-text-secondary,
1419
+ .uui-text-night600 {
1420
+ --uui-text: var(--uui-text-secondary);
1421
+ }
1422
+
1423
+ .uui-text-disabled,
1424
+ .uui-text-night500 {
1425
+ --uui-text: var(--uui-text-disabled);
1426
+ }
1427
+
1428
+ .uui-text-night400 {
1429
+ --uui-text: var(--night400);
1430
+ }
1431
+
1432
+ .uui-text-night300 {
1433
+ --uui-text: var(--night300);
1434
+ }
1435
+
1436
+ .uui-text-contrast,
1437
+ .uui-text-night50 {
1438
+ --uui-text: var(--uui-text-contrast);
1439
+ }
1440
+
1441
+ .uui-text-white {
1442
+ --uui-text: var(--uui-text-white);
1443
+ }
1444
+
1445
+ .uui-font-regular,
1446
+ .uui-font-sans {
1447
+ --uui-text-font: var(--font-regular);
1448
+ }
1449
+
1450
+ .uui-font-semibold,
1451
+ .uui-font-sans-semibold {
1452
+ --uui-text-font: var(--font-semibold);
1453
+ }
1454
+
1455
+ .uui-font-sans-light {
1456
+ --uui-text-font: var(--font-light);
1457
+ }
1458
+
1459
+ .dropdown-container-white {
1460
+ --uui-dropdown-container-bg: var(--white);
1461
+ }
1462
+
1463
+ .dropdown-container-night700 {
1464
+ --uui-dropdown-container-bg: var(--night700);
1465
+ }
1466
+
1467
+ .flex-row-background-white {
1468
+ --uui-flex-row-bg: var(--uui-surface);
1469
+ }
1470
+
1471
+ .flex-row-background-night50 {
1472
+ --uui-flex-row-bg: var(--night50);
1473
+ }
1474
+
1475
+ .flex-row-background-night100 {
1476
+ --uui-flex-row-bg: var(--night100);
1477
+ }
1478
+
1479
+ .flex-row-background-none {
1480
+ --uui-flex-row-bg: transparent;
1481
+ }
1482
+
1483
+ .panel-white {
1484
+ --uui-panel-bg: var(--uui-surface);
1485
+ }
1486
+
1487
+ .panel-night50 {
1488
+ --uui-panel-bg: var(--night50);
1489
+ }
1490
+ }