@eunomia/elements 1.0.0-beta.5 → 1.0.0-beta.7

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 (516) hide show
  1. package/README.md +2 -2
  2. package/dist/breakpoints.d.ts +37 -10
  3. package/dist/breakpoints.js +38 -10
  4. package/dist/cdn/components/chunks/{chunk-MMLIPCOY.js → chunk-22D3SRFR.js} +1 -1
  5. package/dist/cdn/components/chunks/chunk-36KLGY6U.js +209 -0
  6. package/dist/cdn/components/chunks/chunk-3BMACIDO.js +1 -0
  7. package/dist/cdn/components/chunks/{chunk-IDKZKLJR.js → chunk-3PNGQEG4.js} +24 -11
  8. package/dist/cdn/components/chunks/{chunk-NBIENHLV.js → chunk-5XPOGBPL.js} +18 -18
  9. package/dist/cdn/components/chunks/chunk-624VJYNA.js +1 -0
  10. package/dist/cdn/components/chunks/chunk-62RLISRD.js +1 -0
  11. package/dist/cdn/components/chunks/{chunk-6ETDXUH2.js → chunk-6FYW5TQU.js} +7 -7
  12. package/dist/cdn/components/chunks/chunk-AK2DIJX7.js +1 -0
  13. package/dist/cdn/components/chunks/chunk-B5XMGWM7.js +10 -0
  14. package/dist/cdn/components/chunks/chunk-BKZGTCMF.js +1 -0
  15. package/dist/cdn/components/chunks/{chunk-GW3VP2L7.js → chunk-BO3JOEWM.js} +1 -1
  16. package/dist/cdn/components/chunks/chunk-BVASCT2V.js +109 -0
  17. package/dist/cdn/components/chunks/{chunk-DKOPI7QA.js → chunk-DGI7TKCU.js} +83 -68
  18. package/dist/cdn/components/chunks/chunk-EUWUDCBZ.js +1 -0
  19. package/dist/cdn/components/chunks/{chunk-P32B7BFD.js → chunk-FF3I7C3C.js} +15 -15
  20. package/dist/cdn/components/chunks/{chunk-74AOAB4X.js → chunk-FOILAXLL.js} +6 -5
  21. package/dist/cdn/components/chunks/{chunk-LGLQ36QB.js → chunk-GDBPWZN6.js} +1 -1
  22. package/dist/cdn/components/chunks/chunk-GVS6IUKC.js +1 -0
  23. package/dist/cdn/components/chunks/chunk-GWLD2I3P.js +8 -0
  24. package/dist/cdn/components/chunks/{chunk-JRGM3W7I.js → chunk-I4ERDXSM.js} +9 -4
  25. package/dist/cdn/components/chunks/{chunk-AIS3UICU.js → chunk-J3SZBXM6.js} +11 -7
  26. package/dist/cdn/components/chunks/{chunk-5XJGYXW7.js → chunk-LVKMAHMU.js} +11 -1
  27. package/dist/cdn/components/chunks/{chunk-SD2WHGPF.js → chunk-MQQJ6DID.js} +1 -1
  28. package/dist/cdn/components/chunks/{chunk-A4EQSU36.js → chunk-O7PHBLH2.js} +1 -1
  29. package/dist/cdn/components/chunks/chunk-PD62MBOJ.js +1 -0
  30. package/dist/cdn/components/chunks/{chunk-5EVP7YNE.js → chunk-PPCHQG7P.js} +1 -1
  31. package/dist/cdn/components/chunks/{chunk-MPQP4R54.js → chunk-PXF554MD.js} +10 -9
  32. package/dist/cdn/components/chunks/chunk-QL5GSW2A.js +1 -0
  33. package/dist/cdn/components/chunks/{chunk-5XJLIHAU.js → chunk-QXQ25SQS.js} +24 -20
  34. package/dist/cdn/components/chunks/chunk-SMTIDNGW.js +1 -0
  35. package/dist/cdn/components/chunks/{chunk-PED5ATYN.js → chunk-SVGWCKWT.js} +2 -2
  36. package/dist/cdn/components/chunks/{chunk-2XASWWKR.js → chunk-TFTRCIIK.js} +9 -8
  37. package/dist/cdn/components/chunks/chunk-TLBXTBMM.js +46 -0
  38. package/dist/cdn/components/chunks/chunk-UVHVQRPT.js +1 -0
  39. package/dist/cdn/components/chunks/{chunk-L65WUTXM.js → chunk-UYZR4JXZ.js} +12 -7
  40. package/dist/cdn/components/chunks/chunk-VG6NAAIV.js +1 -0
  41. package/dist/cdn/components/chunks/chunk-VJCNHMQZ.js +10 -0
  42. package/dist/cdn/components/chunks/chunk-WW4BTWMH.js +1 -0
  43. package/dist/cdn/components/chunks/{chunk-XH6NREVZ.js → chunk-YITWLCD3.js} +1 -1
  44. package/dist/cdn/components/chunks/{chunk-OW7XKDCH.js → chunk-Z3OFIE7S.js} +16 -16
  45. package/dist/cdn/components/chunks/{chunk-BQHYZB2W.js → chunk-ZBN4HTWP.js} +1 -1
  46. package/dist/cdn/components/eun-alert.js +33 -18
  47. package/dist/cdn/components/eun-animate.js +14 -10
  48. package/dist/cdn/components/eun-badge.js +2 -2
  49. package/dist/cdn/components/eun-breadcrumb.js +25 -41
  50. package/dist/cdn/components/eun-button.js +1 -1
  51. package/dist/cdn/components/eun-calendar.js +67 -65
  52. package/dist/cdn/components/eun-card.js +34 -19
  53. package/dist/cdn/components/eun-carousel.js +76 -42
  54. package/dist/cdn/components/eun-check-card.js +13 -6
  55. package/dist/cdn/components/eun-checkbox-list.js +11 -8
  56. package/dist/cdn/components/eun-checkbox.js +1 -1
  57. package/dist/cdn/components/eun-chip.js +3 -3
  58. package/dist/cdn/components/eun-collapse.js +56 -27
  59. package/dist/cdn/components/eun-color-picker.js +79 -86
  60. package/dist/cdn/components/eun-counter.js +16 -15
  61. package/dist/cdn/components/eun-date-picker.js +71 -67
  62. package/dist/cdn/components/eun-description-list.js +152 -0
  63. package/dist/cdn/components/eun-divider.js +3 -3
  64. package/dist/cdn/components/eun-drawer.js +34 -20
  65. package/dist/cdn/components/eun-dropdown-button.js +1 -1
  66. package/dist/cdn/components/eun-dropdown-item.js +6 -5
  67. package/dist/cdn/components/eun-fab.js +17 -16
  68. package/dist/cdn/components/eun-icon.js +1 -1
  69. package/dist/cdn/components/eun-image-card.js +79 -22
  70. package/dist/cdn/components/eun-image-carousel.js +92 -47
  71. package/dist/cdn/components/eun-infinite-list.js +23 -11
  72. package/dist/cdn/components/eun-input-file.js +20 -19
  73. package/dist/cdn/components/eun-input-phone.js +17 -16
  74. package/dist/cdn/components/eun-input.js +1 -1
  75. package/dist/cdn/components/eun-label.js +4 -4
  76. package/dist/cdn/components/eun-link.js +78 -29
  77. package/dist/cdn/components/eun-loader.js +1 -1
  78. package/dist/cdn/components/eun-modal.js +27 -20
  79. package/dist/cdn/components/eun-pagination.js +24 -19
  80. package/dist/cdn/components/eun-password-strength.js +19 -11
  81. package/dist/cdn/components/eun-progress-bar.js +13 -5
  82. package/dist/cdn/components/eun-radio-card.js +16 -9
  83. package/dist/cdn/components/eun-radio-list.js +12 -9
  84. package/dist/cdn/components/eun-radio.js +1 -1
  85. package/dist/cdn/components/eun-rating.js +276 -0
  86. package/dist/cdn/components/eun-scheduler-event-editor.js +10 -10
  87. package/dist/cdn/components/eun-scheduler-event.js +1 -1
  88. package/dist/cdn/components/eun-scheduler.js +27 -27
  89. package/dist/cdn/components/eun-search.js +24 -25
  90. package/dist/cdn/components/eun-select.js +32 -31
  91. package/dist/cdn/components/eun-sidebar.js +40 -24
  92. package/dist/cdn/components/eun-skeleton.js +1 -1
  93. package/dist/cdn/components/eun-slider.js +15 -14
  94. package/dist/cdn/components/eun-sliding-card.js +8 -4
  95. package/dist/cdn/components/eun-step.js +22 -10
  96. package/dist/cdn/components/eun-stepper.js +41 -30
  97. package/dist/cdn/components/eun-switch.js +10 -8
  98. package/dist/cdn/components/eun-tab-group.js +24 -19
  99. package/dist/cdn/components/eun-tab-panel.js +11 -3
  100. package/dist/cdn/components/eun-tab.js +1 -1
  101. package/dist/cdn/components/eun-table-action-bar.js +1 -1
  102. package/dist/cdn/components/eun-table.js +572 -31
  103. package/dist/cdn/components/eun-tag.js +13 -7
  104. package/dist/cdn/components/eun-textarea.js +34 -29
  105. package/dist/cdn/components/eun-time-picker.js +24 -21
  106. package/dist/cdn/components/eun-toast.js +51 -22
  107. package/dist/cdn/components/eun-toggle-group.js +57 -36
  108. package/dist/cdn/components/eun-toggle-item.js +16 -15
  109. package/dist/cdn/components/eun-toggle.js +12 -10
  110. package/dist/cdn/components/eun-toolbar.js +64 -54
  111. package/dist/cdn/components/eun-tooltip.js +30 -14
  112. package/dist/cdn/styles/breakpoints.scss +8 -0
  113. package/dist/cdn/styles/eunomia-grid.scss +6 -0
  114. package/dist/cdn/styles/eunomia-themes.css +1 -1
  115. package/dist/cdn/styles/themes/eunomia-theme.css +1 -1
  116. package/dist/cdn/styles/themes/eunomia-theme.scss +4 -3
  117. package/dist/cdn/styles/themes/mixins/eunomia-a11y-color.mixin.scss +34 -1
  118. package/dist/cdn/styles/themes/mixins/eunomia-neutrals.mixin.scss +4 -0
  119. package/dist/cdn/styles/themes/mixins/eunomia-states.mixin.scss +36 -12
  120. package/dist/cdn/styles/themes/prebuilt-themes/eunomia/eunomia-dark.mixin.scss +10 -10
  121. package/dist/cdn/styles/themes/prebuilt-themes/eunomia/eunomia.mixin.scss +10 -10
  122. package/dist/cdn/styles/themes/prebuilt-themes/eunomia/eunomia.theme.css +1 -1
  123. package/dist/cdn/styles/themes/prebuilt-themes/eunomia/eunomia.theme.scss +3 -2
  124. package/dist/cdn/styles/themes/prebuilt-themes/fire/eunomia-fire-dark.mixin.scss +10 -10
  125. package/dist/cdn/styles/themes/prebuilt-themes/fire/eunomia-fire.mixin.scss +10 -10
  126. package/dist/cdn/styles/themes/prebuilt-themes/fire/eunomia-fire.theme.css +1 -1
  127. package/dist/cdn/styles/themes/prebuilt-themes/fire/eunomia-fire.theme.scss +3 -2
  128. package/dist/cdn/styles/themes/prebuilt-themes/forest/eunomia-forest-dark.mixin.scss +10 -10
  129. package/dist/cdn/styles/themes/prebuilt-themes/forest/eunomia-forest.mixin.scss +10 -10
  130. package/dist/cdn/styles/themes/prebuilt-themes/forest/eunomia-forest.theme.css +1 -1
  131. package/dist/cdn/styles/themes/prebuilt-themes/forest/eunomia-forest.theme.scss +3 -2
  132. package/dist/cdn/styles/themes/prebuilt-themes/gold/eunomia-gold-dark.mixin.scss +10 -10
  133. package/dist/cdn/styles/themes/prebuilt-themes/gold/eunomia-gold.mixin.scss +10 -10
  134. package/dist/cdn/styles/themes/prebuilt-themes/gold/eunomia-gold.theme.css +1 -1
  135. package/dist/cdn/styles/themes/prebuilt-themes/gold/eunomia-gold.theme.scss +3 -2
  136. package/dist/cdn/styles/themes/prebuilt-themes/ocean/eunomia-ocean-dark.mixin.scss +10 -10
  137. package/dist/cdn/styles/themes/prebuilt-themes/ocean/eunomia-ocean.mixin.scss +10 -10
  138. package/dist/cdn/styles/themes/prebuilt-themes/ocean/eunomia-ocean.theme.css +1 -1
  139. package/dist/cdn/styles/themes/prebuilt-themes/ocean/eunomia-ocean.theme.scss +3 -2
  140. package/dist/cdn/styles/themes/prebuilt-themes/salmon/eunomia-salmon-dark.mixin.scss +10 -10
  141. package/dist/cdn/styles/themes/prebuilt-themes/salmon/eunomia-salmon.mixin.scss +10 -10
  142. package/dist/cdn/styles/themes/prebuilt-themes/salmon/eunomia-salmon.theme.css +1 -1
  143. package/dist/cdn/styles/themes/prebuilt-themes/salmon/eunomia-salmon.theme.scss +3 -2
  144. package/dist/cdn/styles/themes/prebuilt-themes/violet/eunomia-violet-dark.mixin.scss +10 -10
  145. package/dist/cdn/styles/themes/prebuilt-themes/violet/eunomia-violet.mixin.scss +10 -10
  146. package/dist/cdn/styles/themes/prebuilt-themes/violet/eunomia-violet.theme.css +1 -1
  147. package/dist/cdn/styles/themes/prebuilt-themes/violet/eunomia-violet.theme.scss +3 -2
  148. package/dist/cdn/styles/tools/indexes/eunomia-media-queries.index.scss +1 -3
  149. package/dist/cdn/styles/tools/indexes/eunomia-tools.index.scss +1 -0
  150. package/dist/cdn/styles/tools/mixins/layout/eunomia-grid.mixin.scss +117 -53
  151. package/dist/cdn/styles/tools/mixins/media-queries/eunomia-media-queries.mixin.scss +69 -0
  152. package/dist/cdn/styles/tools/mixins/settings/eunomia-alpha.mixin.scss +28 -4
  153. package/dist/cdn/styles/tools/mixins/settings/eunomia-motion.mixin.scss +9 -0
  154. package/dist/cdn/styles/tools/variables/eunomia.breakpoints.scss +4 -0
  155. package/dist/components/action/button/button.d.ts +9 -3
  156. package/dist/components/action/button/button.js +10 -4
  157. package/dist/components/action/button/button.styles.js +61 -41
  158. package/dist/components/action/dropdown-button/dropdown-button.d.ts +2 -2
  159. package/dist/components/action/dropdown-button/dropdown-button.js +21 -15
  160. package/dist/components/action/dropdown-button/dropdown-button.styles.js +3 -2
  161. package/dist/components/action/dropdown-button/dropdown-item.js +5 -6
  162. package/dist/components/action/dropdown-button/dropdown-item.styles.js +3 -2
  163. package/dist/components/action/fab/fab.styles.js +14 -13
  164. package/dist/components/action/link/link.d.ts +7 -3
  165. package/dist/components/action/link/link.js +11 -7
  166. package/dist/components/action/link/link.styles.js +66 -15
  167. package/dist/components/action/shared-styles/button-palette.styles.js +15 -15
  168. package/dist/components/action/toggle/toggle-group.d.ts +2 -0
  169. package/dist/components/action/toggle/toggle-group.js +6 -4
  170. package/dist/components/action/toggle/toggle-group.styles.d.ts +2 -0
  171. package/dist/components/action/toggle/toggle-group.styles.js +46 -23
  172. package/dist/components/action/toggle/toggle-item.styles.js +13 -12
  173. package/dist/components/action/toggle/toggle.d.ts +2 -0
  174. package/dist/components/action/toggle/toggle.js +3 -1
  175. package/dist/components/action/toggle/toggle.styles.d.ts +2 -0
  176. package/dist/components/action/toggle/toggle.styles.js +12 -8
  177. package/dist/components/alert/alert/alert.d.ts +11 -7
  178. package/dist/components/alert/alert/alert.js +13 -14
  179. package/dist/components/alert/alert/alert.styles.js +32 -15
  180. package/dist/components/alert/drawer/drawer.d.ts +8 -6
  181. package/dist/components/alert/drawer/drawer.js +12 -14
  182. package/dist/components/alert/drawer/drawer.styles.js +26 -10
  183. package/dist/components/alert/modal/modal.d.ts +13 -11
  184. package/dist/components/alert/modal/modal.js +17 -27
  185. package/dist/components/alert/modal/modal.styles.js +16 -7
  186. package/dist/components/alert/toast/toast.d.ts +9 -5
  187. package/dist/components/alert/toast/toast.js +11 -13
  188. package/dist/components/alert/toast/toast.styles.js +49 -18
  189. package/dist/components/content/badge/badge.js +2 -2
  190. package/dist/components/content/card/card.d.ts +7 -3
  191. package/dist/components/content/card/card.js +8 -4
  192. package/dist/components/content/card/card.styles.js +28 -13
  193. package/dist/components/content/card/image-card.d.ts +60 -6
  194. package/dist/components/content/card/image-card.js +120 -11
  195. package/dist/components/content/card/image-card.styles.js +66 -15
  196. package/dist/components/content/card/sliding-card.d.ts +2 -0
  197. package/dist/components/content/card/sliding-card.js +2 -0
  198. package/dist/components/content/card/sliding-card.styles.js +5 -1
  199. package/dist/components/content/chip/chip.d.ts +4 -4
  200. package/dist/components/content/chip/chip.js +8 -8
  201. package/dist/components/content/collapse/collapse.d.ts +10 -1
  202. package/dist/components/content/collapse/collapse.js +12 -2
  203. package/dist/components/content/collapse/collapse.styles.d.ts +10 -1
  204. package/dist/components/content/collapse/collapse.styles.js +56 -18
  205. package/dist/components/content/description-list/description-list.d.ts +87 -0
  206. package/dist/components/content/description-list/description-list.js +107 -0
  207. package/dist/components/content/description-list/description-list.styles.d.ts +1 -0
  208. package/dist/components/content/description-list/description-list.styles.js +185 -0
  209. package/dist/components/content/icon/icon.d.ts +5 -0
  210. package/dist/components/content/icon/icon.js +5 -0
  211. package/dist/components/content/icon/icon.style.d.ts +2 -0
  212. package/dist/components/content/icon/icon.style.js +8 -1
  213. package/dist/components/content/image-carousel/image-carousel.d.ts +30 -19
  214. package/dist/components/content/image-carousel/image-carousel.js +58 -55
  215. package/dist/components/content/image-carousel/image-carousel.styles.js +69 -30
  216. package/dist/components/content/password-strength/password-strength.d.ts +21 -6
  217. package/dist/components/content/password-strength/password-strength.js +37 -16
  218. package/dist/components/content/password-strength/password-strength.styles.js +9 -1
  219. package/dist/components/content/progress-bar/progress-bar.styles.js +12 -4
  220. package/dist/components/content/shared-styles/card-link.styles.js +4 -3
  221. package/dist/components/content/shared-styles/tone-surface.styles.d.ts +5 -0
  222. package/dist/components/content/shared-styles/tone-surface.styles.js +19 -14
  223. package/dist/components/content/tag/tag.d.ts +4 -0
  224. package/dist/components/content/tag/tag.js +6 -2
  225. package/dist/components/content/tag/tag.styles.js +14 -4
  226. package/dist/components/content/tooltip/tooltip.d.ts +3 -2
  227. package/dist/components/content/tooltip/tooltip.js +12 -19
  228. package/dist/components/content/tooltip/tooltip.styles.js +25 -7
  229. package/dist/components/form/checkbox/check-card.d.ts +5 -1
  230. package/dist/components/form/checkbox/check-card.js +5 -1
  231. package/dist/components/form/checkbox/check-card.styles.js +13 -4
  232. package/dist/components/form/checkbox/checkbox-list.d.ts +21 -1
  233. package/dist/components/form/checkbox/checkbox-list.js +50 -17
  234. package/dist/components/form/checkbox/checkbox.d.ts +5 -1
  235. package/dist/components/form/checkbox/checkbox.js +7 -2
  236. package/dist/components/form/checkbox/checkbox.styles.js +5 -4
  237. package/dist/components/form/color-picker/color-picker.d.ts +48 -29
  238. package/dist/components/form/color-picker/color-picker.js +85 -71
  239. package/dist/components/form/color-picker/color-picker.styles.js +7 -6
  240. package/dist/components/form/counter/counter.d.ts +26 -19
  241. package/dist/components/form/counter/counter.js +64 -63
  242. package/dist/components/form/counter/counter.styles.js +5 -4
  243. package/dist/components/form/date-picker/date-picker.d.ts +64 -39
  244. package/dist/components/form/date-picker/date-picker.js +107 -96
  245. package/dist/components/form/date-picker/date-picker.styles.js +8 -5
  246. package/dist/components/form/input/input.d.ts +45 -40
  247. package/dist/components/form/input/input.js +93 -111
  248. package/dist/components/form/input-file/input-file.d.ts +30 -14
  249. package/dist/components/form/input-file/input-file.js +43 -40
  250. package/dist/components/form/input-file/input-file.styles.js +7 -6
  251. package/dist/components/form/input-phone/input-phone.d.ts +30 -7
  252. package/dist/components/form/input-phone/input-phone.js +54 -30
  253. package/dist/components/form/input-phone/input-phone.styles.js +4 -4
  254. package/dist/components/form/label/label.styles.js +3 -3
  255. package/dist/components/form/radio/radio-card.d.ts +6 -2
  256. package/dist/components/form/radio/radio-card.js +6 -2
  257. package/dist/components/form/radio/radio-card.styles.js +14 -5
  258. package/dist/components/form/radio/radio-list.d.ts +28 -9
  259. package/dist/components/form/radio/radio-list.js +61 -32
  260. package/dist/components/form/radio/radio.d.ts +6 -2
  261. package/dist/components/form/radio/radio.js +6 -2
  262. package/dist/components/form/radio/radio.styles.js +4 -4
  263. package/dist/components/form/rating/rating.d.ts +349 -0
  264. package/dist/components/form/rating/rating.js +665 -0
  265. package/dist/components/form/rating/rating.styles.d.ts +1 -0
  266. package/dist/components/form/rating/rating.styles.js +213 -0
  267. package/dist/components/form/search/search.d.ts +10 -9
  268. package/dist/components/form/search/search.js +29 -56
  269. package/dist/components/form/search/search.styles.js +5 -4
  270. package/dist/components/form/select/select.d.ts +32 -12
  271. package/dist/components/form/select/select.js +74 -59
  272. package/dist/components/form/select/select.styles.js +3 -2
  273. package/dist/components/form/shared-styles/card.styles.js +5 -4
  274. package/dist/components/form/shared-styles/field.styles.js +16 -6
  275. package/dist/components/form/shared-styles/form-labels.styles.js +1 -1
  276. package/dist/components/form/shared-styles/listbox.styles.js +10 -0
  277. package/dist/components/form/slider/slider.d.ts +11 -9
  278. package/dist/components/form/slider/slider.js +14 -14
  279. package/dist/components/form/slider/slider.styles.js +8 -7
  280. package/dist/components/form/switch/switch.d.ts +5 -1
  281. package/dist/components/form/switch/switch.js +5 -1
  282. package/dist/components/form/switch/switch.styles.js +7 -5
  283. package/dist/components/form/textarea/textarea.d.ts +96 -24
  284. package/dist/components/form/textarea/textarea.js +206 -51
  285. package/dist/components/form/time-picker/time-picker-columns.d.ts +2 -2
  286. package/dist/components/form/time-picker/time-picker-columns.js +8 -8
  287. package/dist/components/form/time-picker/time-picker-columns.styles.js +4 -2
  288. package/dist/components/form/time-picker/time-picker-list.styles.js +2 -1
  289. package/dist/components/form/time-picker/time-picker.d.ts +30 -10
  290. package/dist/components/form/time-picker/time-picker.js +81 -64
  291. package/dist/components/form/time-picker/time-picker.styles.js +4 -3
  292. package/dist/components/layout/animate/animate.d.ts +37 -15
  293. package/dist/components/layout/animate/animate.js +36 -16
  294. package/dist/components/layout/animate/animate.styles.js +11 -18
  295. package/dist/components/layout/divider/divider.js +1 -1
  296. package/dist/components/layout/divider/divider.styles.js +1 -1
  297. package/dist/components/layout/infinite-list/infinite-list.d.ts +33 -10
  298. package/dist/components/layout/infinite-list/infinite-list.js +115 -18
  299. package/dist/components/layout/infinite-list/infinite-list.styles.d.ts +3 -0
  300. package/dist/components/layout/infinite-list/infinite-list.styles.js +17 -5
  301. package/dist/components/loader/loader/loader.js +2 -2
  302. package/dist/components/loader/loader/loader.styles.js +17 -13
  303. package/dist/components/loader/skeleton/skeleton.js +1 -1
  304. package/dist/components/navigation/breadcrumb/breadcrumb.d.ts +31 -45
  305. package/dist/components/navigation/breadcrumb/breadcrumb.js +111 -77
  306. package/dist/components/navigation/breadcrumb/breadcrumb.styles.d.ts +3 -0
  307. package/dist/components/navigation/breadcrumb/breadcrumb.styles.js +22 -26
  308. package/dist/components/navigation/carousel/carousel.d.ts +55 -11
  309. package/dist/components/navigation/carousel/carousel.js +101 -43
  310. package/dist/components/navigation/carousel/carousel.styles.js +65 -22
  311. package/dist/components/navigation/pagination/pagination.d.ts +23 -21
  312. package/dist/components/navigation/pagination/pagination.js +30 -53
  313. package/dist/components/navigation/pagination/pagination.styles.js +8 -3
  314. package/dist/components/navigation/sidebar/sidebar.d.ts +17 -13
  315. package/dist/components/navigation/sidebar/sidebar.js +23 -33
  316. package/dist/components/navigation/sidebar/sidebar.styles.js +32 -14
  317. package/dist/components/navigation/stepper/step.js +9 -8
  318. package/dist/components/navigation/stepper/step.styles.js +16 -5
  319. package/dist/components/navigation/stepper/stepper.js +12 -5
  320. package/dist/components/navigation/stepper/stepper.styles.js +16 -5
  321. package/dist/components/navigation/tabs/tab/tab.d.ts +11 -0
  322. package/dist/components/navigation/tabs/tab/tab.js +11 -0
  323. package/dist/components/navigation/tabs/tab/tab.styles.js +22 -16
  324. package/dist/components/navigation/tabs/tab-group/tab-group.js +9 -10
  325. package/dist/components/navigation/tabs/tab-group/tab-group.styles.js +21 -16
  326. package/dist/components/navigation/tabs/tab-panel/tab-panel.d.ts +4 -0
  327. package/dist/components/navigation/tabs/tab-panel/tab-panel.js +4 -0
  328. package/dist/components/navigation/tabs/tab-panel/tab-panel.styles.js +18 -1
  329. package/dist/components/navigation/toolbar/toolbar.d.ts +30 -62
  330. package/dist/components/navigation/toolbar/toolbar.js +43 -105
  331. package/dist/components/navigation/toolbar/toolbar.styles.js +59 -36
  332. package/dist/events/table-row-click.event.d.ts +5 -4
  333. package/dist/events/table-row-click.event.js +10 -5
  334. package/dist/features/scheduler/calendar/calendar.d.ts +6 -6
  335. package/dist/features/scheduler/calendar/calendar.js +7 -6
  336. package/dist/features/scheduler/calendar/calendar.styles.js +8 -6
  337. package/dist/features/scheduler/scheduler/scheduler.d.ts +8 -8
  338. package/dist/features/scheduler/scheduler/scheduler.js +24 -47
  339. package/dist/features/scheduler/scheduler/scheduler.styles.js +6 -4
  340. package/dist/features/scheduler/scheduler-event/scheduler-event.d.ts +2 -0
  341. package/dist/features/scheduler/scheduler-event/scheduler-event.js +5 -3
  342. package/dist/features/scheduler/scheduler-event/scheduler-event.styles.js +11 -5
  343. package/dist/features/scheduler/scheduler-event-editor/scheduler-event-editor.d.ts +6 -4
  344. package/dist/features/scheduler/scheduler-event-editor/scheduler-event-editor.js +6 -7
  345. package/dist/features/scheduler/shared/scheduler-hour-grid.styles.js +3 -3
  346. package/dist/features/scheduler/shared/scheduler-month-view.styles.js +2 -2
  347. package/dist/features/scheduler/shared/scheduler-year-view.styles.js +2 -2
  348. package/dist/features/table/table/table-native.styles.d.ts +28 -0
  349. package/dist/features/table/table/table-native.styles.js +502 -0
  350. package/dist/features/table/table/table.d.ts +342 -294
  351. package/dist/features/table/table/table.js +820 -546
  352. package/dist/features/table/table/table.styles.js +31 -17
  353. package/dist/features/table/table/table.types.d.ts +11 -20
  354. package/dist/features/table/table/table.utils.d.ts +6 -36
  355. package/dist/features/table/table/table.utils.js +16 -65
  356. package/dist/features/table/table-action-bar/table-action-bar.d.ts +33 -16
  357. package/dist/features/table/table-action-bar/table-action-bar.js +15 -22
  358. package/dist/features/table/table-action-bar/table-action-bar.styles.js +15 -3
  359. package/dist/i18n/en.d.ts +99 -0
  360. package/dist/i18n/en.js +99 -0
  361. package/dist/i18n/fr.js +103 -2
  362. package/dist/index.d.ts +6 -10
  363. package/dist/index.js +7 -10
  364. package/dist/mixins/button.mixin.js +3 -2
  365. package/dist/mixins/check.mixin.js +15 -15
  366. package/dist/mixins/disabled.mixin.d.ts +5 -0
  367. package/dist/mixins/disabled.mixin.js +21 -1
  368. package/dist/mixins/editable.mixin.js +28 -5
  369. package/dist/mixins/field-appearance.mixin.js +3 -2
  370. package/dist/mixins/form.mixin.d.ts +21 -1
  371. package/dist/mixins/form.mixin.js +156 -27
  372. package/dist/mixins/localizable.mixin.d.ts +1 -1
  373. package/dist/mixins/localizable.mixin.js +1 -1
  374. package/dist/mixins/radio.mixin.js +15 -15
  375. package/dist/mixins/readonly.mixin.d.ts +2 -1
  376. package/dist/mixins/readonly.mixin.js +10 -3
  377. package/dist/mixins/validators.mixin.d.ts +7 -1
  378. package/dist/mixins/validators.mixin.js +36 -17
  379. package/dist/ssr/alert-ssr.css +187 -0
  380. package/dist/ssr/animate-ssr.css +3 -2
  381. package/dist/ssr/badge-ssr.css +67 -0
  382. package/dist/ssr/breadcrumb-ssr.css +41 -0
  383. package/dist/ssr/button-ssr.css +319 -0
  384. package/dist/ssr/card-ssr.css +196 -0
  385. package/dist/ssr/carousel-ssr.css +238 -0
  386. package/dist/ssr/checkbox-ssr.css +67 -0
  387. package/dist/ssr/chip-ssr.css +242 -0
  388. package/dist/ssr/collapse-ssr.css +151 -0
  389. package/dist/ssr/description-list-ssr.css +150 -0
  390. package/dist/ssr/field-ssr.css +163 -0
  391. package/dist/ssr/icon-ssr.css +266 -0
  392. package/dist/ssr/image-carousel-ssr.css +24 -0
  393. package/dist/ssr/links-ssr.css +8 -2
  394. package/dist/ssr/pagination-ssr.css +4 -0
  395. package/dist/ssr/rating-ssr.css +254 -0
  396. package/dist/ssr/sidebar-ssr.css +9 -1
  397. package/dist/ssr/skeleton-ssr.css +63 -0
  398. package/dist/ssr/table-ssr.css +472 -0
  399. package/dist/ssr/tabs-ssr.css +129 -0
  400. package/dist/ssr/tag-ssr.css +197 -0
  401. package/dist/ssr/toggle-group-ssr.css +182 -0
  402. package/dist/ssr/toolbar-ssr.css +34 -1
  403. package/dist/utils/drag-drop.utils.js +18 -2
  404. package/dist/utils/dropdown-menu.utils.d.ts +2 -2
  405. package/dist/utils/dropdown-menu.utils.js +4 -14
  406. package/dist/utils/implicit-submission.utils.d.ts +18 -0
  407. package/dist/utils/implicit-submission.utils.js +79 -0
  408. package/dist/utils/light-dom-styles.utils.d.ts +14 -0
  409. package/dist/utils/light-dom-styles.utils.js +37 -0
  410. package/dist/utils/listbox-options.utils.d.ts +11 -0
  411. package/dist/utils/listbox-options.utils.js +41 -3
  412. package/dist/utils/media.styles.d.ts +19 -0
  413. package/dist/utils/media.styles.js +23 -0
  414. package/dist/utils/motion.utils.d.ts +40 -0
  415. package/dist/utils/motion.utils.js +51 -0
  416. package/dist/utils/theme-generator.utils.d.ts +6 -1
  417. package/dist/utils/theme-generator.utils.js +59 -20
  418. package/package.json +39 -31
  419. package/styles/breakpoints.scss +8 -0
  420. package/styles/eunomia-grid.scss +6 -0
  421. package/styles/themes/eunomia-theme.scss +4 -3
  422. package/styles/themes/mixins/eunomia-a11y-color.mixin.scss +34 -1
  423. package/styles/themes/mixins/eunomia-neutrals.mixin.scss +4 -0
  424. package/styles/themes/mixins/eunomia-states.mixin.scss +36 -12
  425. package/styles/themes/prebuilt-themes/eunomia/eunomia-dark.mixin.scss +10 -10
  426. package/styles/themes/prebuilt-themes/eunomia/eunomia.mixin.scss +10 -10
  427. package/styles/themes/prebuilt-themes/eunomia/eunomia.theme.scss +3 -2
  428. package/styles/themes/prebuilt-themes/fire/eunomia-fire-dark.mixin.scss +10 -10
  429. package/styles/themes/prebuilt-themes/fire/eunomia-fire.mixin.scss +10 -10
  430. package/styles/themes/prebuilt-themes/fire/eunomia-fire.theme.scss +3 -2
  431. package/styles/themes/prebuilt-themes/forest/eunomia-forest-dark.mixin.scss +10 -10
  432. package/styles/themes/prebuilt-themes/forest/eunomia-forest.mixin.scss +10 -10
  433. package/styles/themes/prebuilt-themes/forest/eunomia-forest.theme.scss +3 -2
  434. package/styles/themes/prebuilt-themes/gold/eunomia-gold-dark.mixin.scss +10 -10
  435. package/styles/themes/prebuilt-themes/gold/eunomia-gold.mixin.scss +10 -10
  436. package/styles/themes/prebuilt-themes/gold/eunomia-gold.theme.scss +3 -2
  437. package/styles/themes/prebuilt-themes/ocean/eunomia-ocean-dark.mixin.scss +10 -10
  438. package/styles/themes/prebuilt-themes/ocean/eunomia-ocean.mixin.scss +10 -10
  439. package/styles/themes/prebuilt-themes/ocean/eunomia-ocean.theme.scss +3 -2
  440. package/styles/themes/prebuilt-themes/salmon/eunomia-salmon-dark.mixin.scss +10 -10
  441. package/styles/themes/prebuilt-themes/salmon/eunomia-salmon.mixin.scss +10 -10
  442. package/styles/themes/prebuilt-themes/salmon/eunomia-salmon.theme.scss +3 -2
  443. package/styles/themes/prebuilt-themes/violet/eunomia-violet-dark.mixin.scss +10 -10
  444. package/styles/themes/prebuilt-themes/violet/eunomia-violet.mixin.scss +10 -10
  445. package/styles/themes/prebuilt-themes/violet/eunomia-violet.theme.scss +3 -2
  446. package/styles/tools/indexes/eunomia-media-queries.index.scss +1 -3
  447. package/styles/tools/indexes/eunomia-tools.index.scss +1 -0
  448. package/styles/tools/mixins/layout/eunomia-grid.mixin.scss +117 -53
  449. package/styles/tools/mixins/media-queries/eunomia-media-queries.mixin.scss +69 -0
  450. package/styles/tools/mixins/settings/eunomia-alpha.mixin.scss +28 -4
  451. package/styles/tools/mixins/settings/eunomia-motion.mixin.scss +9 -0
  452. package/styles/tools/variables/eunomia.breakpoints.scss +4 -0
  453. package/dist/cdn/components/chunks/chunk-32DTNR52.js +0 -1
  454. package/dist/cdn/components/chunks/chunk-A6KGFALA.js +0 -132
  455. package/dist/cdn/components/chunks/chunk-CEDHJUUH.js +0 -1
  456. package/dist/cdn/components/chunks/chunk-D2M4BV5Y.js +0 -328
  457. package/dist/cdn/components/chunks/chunk-E4IS25H7.js +0 -1
  458. package/dist/cdn/components/chunks/chunk-E74CM7UG.js +0 -66
  459. package/dist/cdn/components/chunks/chunk-EAKYD33D.js +0 -110
  460. package/dist/cdn/components/chunks/chunk-EST3M4AO.js +0 -1
  461. package/dist/cdn/components/chunks/chunk-GU6BVMFJ.js +0 -1
  462. package/dist/cdn/components/chunks/chunk-KBH5PCUO.js +0 -3
  463. package/dist/cdn/components/chunks/chunk-KVYUNKUO.js +0 -27
  464. package/dist/cdn/components/chunks/chunk-LFCXUVDO.js +0 -1
  465. package/dist/cdn/components/chunks/chunk-OAULRKHQ.js +0 -38
  466. package/dist/cdn/components/chunks/chunk-PCM7D3YF.js +0 -84
  467. package/dist/cdn/components/chunks/chunk-S2UCEWNG.js +0 -207
  468. package/dist/cdn/components/chunks/chunk-SJWRE6PW.js +0 -1
  469. package/dist/cdn/components/chunks/chunk-T4PTHUYF.js +0 -10
  470. package/dist/cdn/components/chunks/chunk-VRGRCYIO.js +0 -1
  471. package/dist/cdn/components/chunks/chunk-X2AUBZD2.js +0 -30
  472. package/dist/cdn/components/eun-breadcrumb-item.js +0 -93
  473. package/dist/cdn/components/eun-table-cell.js +0 -1
  474. package/dist/cdn/components/eun-table-column.js +0 -1
  475. package/dist/cdn/components/eun-table-header.js +0 -1
  476. package/dist/cdn/components/eun-table-item.js +0 -1
  477. package/dist/cdn/components/eun-table-skeleton-row.js +0 -1
  478. package/dist/cdn/styles/tools/mixins/media-queries/eunomia-device.mixin.scss +0 -14
  479. package/dist/cdn/styles/tools/mixins/media-queries/eunomia-gte.mixin.scss +0 -26
  480. package/dist/cdn/styles/tools/mixins/media-queries/eunomia-lte.mixin.scss +0 -26
  481. package/dist/components/navigation/breadcrumb/breadcrumb-item.d.ts +0 -77
  482. package/dist/components/navigation/breadcrumb/breadcrumb-item.js +0 -130
  483. package/dist/components/navigation/breadcrumb/breadcrumb-item.styles.d.ts +0 -6
  484. package/dist/components/navigation/breadcrumb/breadcrumb-item.styles.js +0 -78
  485. package/dist/features/table/native-table.css +0 -276
  486. package/dist/features/table/shared-styles/table-row.styles.d.ts +0 -7
  487. package/dist/features/table/shared-styles/table-row.styles.js +0 -47
  488. package/dist/features/table/shared-styles/table-shared.styles.d.ts +0 -23
  489. package/dist/features/table/shared-styles/table-shared.styles.js +0 -33
  490. package/dist/features/table/table-cell/table-cell.d.ts +0 -59
  491. package/dist/features/table/table-cell/table-cell.js +0 -73
  492. package/dist/features/table/table-cell/table-cell.styles.d.ts +0 -1
  493. package/dist/features/table/table-cell/table-cell.styles.js +0 -46
  494. package/dist/features/table/table-column/table-column.d.ts +0 -73
  495. package/dist/features/table/table-column/table-column.js +0 -89
  496. package/dist/features/table/table-column/table-column.styles.d.ts +0 -1
  497. package/dist/features/table/table-column/table-column.styles.js +0 -51
  498. package/dist/features/table/table-header/table-header.d.ts +0 -102
  499. package/dist/features/table/table-header/table-header.js +0 -165
  500. package/dist/features/table/table-header/table-header.styles.d.ts +0 -1
  501. package/dist/features/table/table-header/table-header.styles.js +0 -147
  502. package/dist/features/table/table-item/table-item.d.ts +0 -179
  503. package/dist/features/table/table-item/table-item.js +0 -291
  504. package/dist/features/table/table-item/table-item.styles.d.ts +0 -1
  505. package/dist/features/table/table-item/table-item.styles.js +0 -404
  506. package/dist/features/table/table-managed/table-managed.d.ts +0 -19
  507. package/dist/features/table/table-managed/table-managed.js +0 -128
  508. package/dist/features/table/table-skeleton-row/table-skeleton-row.d.ts +0 -46
  509. package/dist/features/table/table-skeleton-row/table-skeleton-row.js +0 -110
  510. package/dist/features/table/table-skeleton-row/table-skeleton-row.styles.d.ts +0 -12
  511. package/dist/features/table/table-skeleton-row/table-skeleton-row.styles.js +0 -65
  512. package/dist/mixins/table-row.mixin.d.ts +0 -37
  513. package/dist/mixins/table-row.mixin.js +0 -103
  514. package/styles/tools/mixins/media-queries/eunomia-device.mixin.scss +0 -14
  515. package/styles/tools/mixins/media-queries/eunomia-gte.mixin.scss +0 -26
  516. package/styles/tools/mixins/media-queries/eunomia-lte.mixin.scss +0 -26
package/dist/cdn/styles/themes/eunomia-theme.css CHANGED
@@ -1 +1 @@
1
- @font-face{font-family:"Mulish";font-style:normal;font-weight:200 1000;font-display:swap;src:url("../../../fonts/mulish/mulish-latin-variable-normal.woff2") format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}@font-face{font-family:"Mulish";font-style:italic;font-weight:200 1000;font-display:swap;src:url("../../../fonts/mulish/mulish-latin-variable-italic.woff2") format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}.eunomia-theme{--eun-color-grey-0: #ffffff;--eun-color-grey-100: #f7f8fa;--eun-color-grey-200: #ecedf0;--eun-color-grey-300: #dee0e7;--eun-color-grey-400: #c1c9d6;--eun-color-grey-500: #8d93aa;--eun-color-grey-600: #666e8a;--eun-color-grey-700: #484e61;--eun-color-grey-800: #071621;--eun-color-grey-900: #000000;--eun-font-family: "Mulish", sans-serif;--eun-font-size-xxs: 0.4rem;--eun-font-size-xs: 0.6rem;--eun-font-size-s: 0.82rem;--eun-font-size-m: 1rem;--eun-font-size-l: 1.3rem;--eun-font-size-xl: 1.6rem;--eun-font-size-xxl: 2rem;--eun-font-size-xxxl: 3.4rem;--eun-font-size-xxxxl: 5rem;--eun-font-weight-s: 300;--eun-font-weight-m: 500;--eun-font-weight-l: 700;--eun-space-xxs: 0.1rem;--eun-space-xs: 0.25rem;--eun-space-s: 0.5rem;--eun-space-m: 1rem;--eun-space-l: 2rem;--eun-space-xl: 3.5rem;--eun-space-xxl: 5rem;--eun-border-radius-s: 5px;--eun-border-radius-m: 10px;--eun-border-radius-l: 20px;--eun-border-radius-xl: 999px;--eun-border-width-s: 1px;--eun-border-width-m: 1.5px;--eun-border-width-l: 2px;--eun-shadow-xs: rgba(0, 0, 0, 0.1) 0px 1px 3px 0px, rgba(0, 0, 0, 0.06) 0px 1px 2px 0px;--eun-shadow-s: rgba(0, 0, 0, 0.1) 0px 4px 6px -1px, rgba(0, 0, 0, 0.06) 0px 2px 4px -1px;--eun-shadow-m: rgba(0, 0, 0, 0.1) 0px 10px 15px -3px, rgba(0, 0, 0, 0.05) 0px 4px 6px -2px;--eun-shadow-l: rgba(0, 0, 0, 0.1) 0px 20px 25px -5px, rgba(0, 0, 0, 0.04) 0px 10px 10px -5px;--eun-shadow-xl: rgba(0, 0, 0, 0.25) 0px 25px 50px -12px;--eun-surface-transparent-25: color-mix( in srgb, var(--eun-surface-color) 25%, transparent );--eun-surface-transparent-50: color-mix( in srgb, var(--eun-surface-color) 50%, transparent );--eun-surface-transparent-75: color-mix( in srgb, var(--eun-surface-color) 75%, transparent );--eun-text-transparent-25: color-mix( in srgb, var(--eun-text-color) 25%, transparent );--eun-text-transparent-50: color-mix( in srgb, var(--eun-text-color) 50%, transparent );--eun-text-transparent-75: color-mix( in srgb, var(--eun-text-color) 75%, transparent );--eun-text-on-dark-secondary: rgba(255, 255, 255, 0.7);--eun-height-xxs: 8px;--eun-height-xs: 16px;--eun-height-s: 24px;--eun-height-m: 32px;--eun-height-l: 34px;--eun-height-xl: 48px;--eun-height-xxl: 56px;--eun-breakpoint-mobile: 600px;--eun-breakpoint-tablet: 768px;--eun-breakpoint-laptop: 1024px;--eun-breakpoint-desktop: 1280px}.eunomia-theme .eun-grid{display:grid;row-gap:var(--eun-grid-row-gap, var(--eun-space-s));column-gap:var(--eun-grid-column-gap, var(--eun-space-m))}.eunomia-theme .eun-grid--halves{grid-template-columns:repeat(2, 1fr)}.eunomia-theme .eun-grid--thirds-1-2{grid-template-columns:1fr 2fr}.eunomia-theme .eun-grid--thirds-2-1{grid-template-columns:2fr 1fr}.eunomia-theme .eun-grid--thirds-equal{grid-template-columns:repeat(3, 1fr)}.eunomia-theme .eun-grid--2x2{grid-template-columns:repeat(2, 1fr);grid-auto-flow:row}.eunomia-theme .eun-grid--sidebar-left,.eunomia-theme .eun-grid--sidebar-right{grid-template-columns:repeat(2, 1fr);grid-template-rows:repeat(2, auto)}.eunomia-theme .eun-grid--sidebar-left>:first-child{grid-column:1;grid-row:1/span 2}.eunomia-theme .eun-grid--sidebar-right>:first-child{grid-column:2;grid-row:1/span 2}.eunomia-theme .eun-grid--lead-left,.eunomia-theme .eun-grid--lead-right{grid-template-rows:repeat(2, auto)}.eunomia-theme .eun-grid--lead-left{grid-template-columns:auto 1fr}.eunomia-theme .eun-grid--lead-right{grid-template-columns:1fr auto}.eunomia-theme .eun-grid--lead-left>:first-child{grid-column:1;grid-row:1/span 2}.eunomia-theme .eun-grid--lead-right>:first-child{grid-column:2;grid-row:1/span 2}.eunomia-theme .eun-grid--gallery{grid-template-columns:repeat(auto-fill, minmax(var(--eun-grid-min-width, 220px), 1fr))}.eunomia-theme .eun-grid--panel{grid-template-rows:auto 1fr auto}@media(max-width: 767px){.eunomia-theme .eun-grid--halves,.eunomia-theme .eun-grid--thirds-1-2,.eunomia-theme .eun-grid--thirds-2-1,.eunomia-theme .eun-grid--thirds-equal,.eunomia-theme .eun-grid--2x2,.eunomia-theme .eun-grid--sidebar-left,.eunomia-theme .eun-grid--sidebar-right{grid-template-columns:1fr;grid-template-rows:none}.eunomia-theme .eun-grid--sidebar-left>:first-child,.eunomia-theme .eun-grid--sidebar-right>:first-child{grid-column:1;grid-row:auto}}.eunomia-theme--dark{--eun-color-grey-0: #16171c;--eun-color-grey-100: #2b3748;--eun-color-grey-200: #353c48;--eun-color-grey-300: #666e8a;--eun-color-grey-400: #8d93aa;--eun-color-grey-500: #5f6876;--eun-color-grey-600: #c1c1c1;--eun-color-grey-700: #ecedf0;--eun-color-grey-800: #f7f8fa;--eun-color-grey-900: #ffffff;--eun-font-family: "Mulish", sans-serif;--eun-font-size-xxs: 0.4rem;--eun-font-size-xs: 0.6rem;--eun-font-size-s: 0.82rem;--eun-font-size-m: 1rem;--eun-font-size-l: 1.3rem;--eun-font-size-xl: 1.6rem;--eun-font-size-xxl: 2rem;--eun-font-size-xxxl: 3.4rem;--eun-font-size-xxxxl: 5rem;--eun-font-weight-s: 300;--eun-font-weight-m: 500;--eun-font-weight-l: 700;--eun-space-xxs: 0.1rem;--eun-space-xs: 0.25rem;--eun-space-s: 0.5rem;--eun-space-m: 1rem;--eun-space-l: 2rem;--eun-space-xl: 3.5rem;--eun-space-xxl: 5rem;--eun-border-radius-s: 5px;--eun-border-radius-m: 10px;--eun-border-radius-l: 20px;--eun-border-radius-xl: 999px;--eun-border-width-s: 1px;--eun-border-width-m: 1.5px;--eun-border-width-l: 2px;--eun-shadow-xs: rgba(0, 0, 0, 0.1) 0px 1px 3px 0px, rgba(0, 0, 0, 0.06) 0px 1px 2px 0px;--eun-shadow-s: rgba(0, 0, 0, 0.1) 0px 4px 6px -1px, rgba(0, 0, 0, 0.06) 0px 2px 4px -1px;--eun-shadow-m: rgba(0, 0, 0, 0.1) 0px 10px 15px -3px, rgba(0, 0, 0, 0.05) 0px 4px 6px -2px;--eun-shadow-l: rgba(0, 0, 0, 0.1) 0px 20px 25px -5px, rgba(0, 0, 0, 0.04) 0px 10px 10px -5px;--eun-shadow-xl: rgba(0, 0, 0, 0.25) 0px 25px 50px -12px;--eun-surface-transparent-25: color-mix( in srgb, var(--eun-surface-color) 25%, transparent );--eun-surface-transparent-50: color-mix( in srgb, var(--eun-surface-color) 50%, transparent );--eun-surface-transparent-75: color-mix( in srgb, var(--eun-surface-color) 75%, transparent );--eun-text-transparent-25: color-mix( in srgb, var(--eun-text-color) 25%, transparent );--eun-text-transparent-50: color-mix( in srgb, var(--eun-text-color) 50%, transparent );--eun-text-transparent-75: color-mix( in srgb, var(--eun-text-color) 75%, transparent );--eun-text-on-dark-secondary: rgba(255, 255, 255, 0.7);--eun-height-xxs: 8px;--eun-height-xs: 16px;--eun-height-s: 24px;--eun-height-m: 32px;--eun-height-l: 34px;--eun-height-xl: 48px;--eun-height-xxl: 56px;--eun-breakpoint-mobile: 600px;--eun-breakpoint-tablet: 768px;--eun-breakpoint-laptop: 1024px;--eun-breakpoint-desktop: 1280px}.eunomia-theme--dark .eun-grid{display:grid;row-gap:var(--eun-grid-row-gap, var(--eun-space-s));column-gap:var(--eun-grid-column-gap, var(--eun-space-m))}.eunomia-theme--dark .eun-grid--halves{grid-template-columns:repeat(2, 1fr)}.eunomia-theme--dark .eun-grid--thirds-1-2{grid-template-columns:1fr 2fr}.eunomia-theme--dark .eun-grid--thirds-2-1{grid-template-columns:2fr 1fr}.eunomia-theme--dark .eun-grid--thirds-equal{grid-template-columns:repeat(3, 1fr)}.eunomia-theme--dark .eun-grid--2x2{grid-template-columns:repeat(2, 1fr);grid-auto-flow:row}.eunomia-theme--dark .eun-grid--sidebar-left,.eunomia-theme--dark .eun-grid--sidebar-right{grid-template-columns:repeat(2, 1fr);grid-template-rows:repeat(2, auto)}.eunomia-theme--dark .eun-grid--sidebar-left>:first-child{grid-column:1;grid-row:1/span 2}.eunomia-theme--dark .eun-grid--sidebar-right>:first-child{grid-column:2;grid-row:1/span 2}.eunomia-theme--dark .eun-grid--lead-left,.eunomia-theme--dark .eun-grid--lead-right{grid-template-rows:repeat(2, auto)}.eunomia-theme--dark .eun-grid--lead-left{grid-template-columns:auto 1fr}.eunomia-theme--dark .eun-grid--lead-right{grid-template-columns:1fr auto}.eunomia-theme--dark .eun-grid--lead-left>:first-child{grid-column:1;grid-row:1/span 2}.eunomia-theme--dark .eun-grid--lead-right>:first-child{grid-column:2;grid-row:1/span 2}.eunomia-theme--dark .eun-grid--gallery{grid-template-columns:repeat(auto-fill, minmax(var(--eun-grid-min-width, 220px), 1fr))}.eunomia-theme--dark .eun-grid--panel{grid-template-rows:auto 1fr auto}@media(max-width: 767px){.eunomia-theme--dark .eun-grid--halves,.eunomia-theme--dark .eun-grid--thirds-1-2,.eunomia-theme--dark .eun-grid--thirds-2-1,.eunomia-theme--dark .eun-grid--thirds-equal,.eunomia-theme--dark .eun-grid--2x2,.eunomia-theme--dark .eun-grid--sidebar-left,.eunomia-theme--dark .eun-grid--sidebar-right{grid-template-columns:1fr;grid-template-rows:none}.eunomia-theme--dark .eun-grid--sidebar-left>:first-child,.eunomia-theme--dark .eun-grid--sidebar-right>:first-child{grid-column:1;grid-row:auto}}
1
+ @font-face{font-family:"Mulish";font-style:normal;font-weight:200 1000;font-display:swap;src:url("../../../fonts/mulish/mulish-latin-variable-normal.woff2") format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}@font-face{font-family:"Mulish";font-style:italic;font-weight:200 1000;font-display:swap;src:url("../../../fonts/mulish/mulish-latin-variable-italic.woff2") format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}:where(.eun-grid){--_cols0: var(--eun-grid-columns, var(--_variantCols0, 1));--_cols1: var( --eun-grid-columns-mobile, var(--eun-grid-columns, var(--_variantCols1, var(--_variantCols0, 1))) );--_cols2: var( --eun-grid-columns-tablet, var( --eun-grid-columns-mobile, var( --eun-grid-columns, var(--_variantCols2, var(--_variantCols1, var(--_variantCols0, 1))) ) ) );--_cols3: var( --eun-grid-columns-laptop, var( --eun-grid-columns-tablet, var( --eun-grid-columns-mobile, var( --eun-grid-columns, var( --_variantCols3, var( --_variantCols2, var(--_variantCols1, var(--_variantCols0, 1)) ) ) ) ) ) );--_cols4: var( --eun-grid-columns-desktop, var( --eun-grid-columns-laptop, var( --eun-grid-columns-tablet, var( --eun-grid-columns-mobile, var( --eun-grid-columns, var( --_variantCols4, var( --_variantCols3, var( --_variantCols2, var(--_variantCols1, var(--_variantCols0, 1)) ) ) ) ) ) ) ) );--_cols: var(--_cols0);display:grid;grid-template-columns:repeat(var(--_cols), minmax(0, 1fr));row-gap:var(--eun-grid-row-gap, var(--eun-space-s));column-gap:var(--eun-grid-column-gap, var(--eun-space-m))}@media(width >= 600px){:where(.eun-grid){--_cols: var(--_cols1)}}@media(width >= 768px){:where(.eun-grid){--_cols: var(--_cols2)}}@media(width >= 1024px){:where(.eun-grid){--_cols: var(--_cols3)}}@media(width >= 1280px){:where(.eun-grid){--_cols: var(--_cols4)}}:where(.eun-grid--halves),:where(.eun-grid--2x2){--_variantCols2: 2}:where(.eun-grid--thirds-equal){--_variantCols2: 3}:where(.eun-grid--2x2){grid-auto-flow:row}@media(width >= 768px){:where(.eun-grid--thirds-1-2){grid-template-columns:1fr 2fr}:where(.eun-grid--thirds-2-1){grid-template-columns:2fr 1fr}:where(.eun-grid--sidebar-left),:where(.eun-grid--sidebar-right){grid-template-columns:repeat(2, 1fr);grid-template-rows:repeat(2, auto)}:where(.eun-grid--sidebar-left>:first-child){grid-column:1;grid-row:1/span 2}:where(.eun-grid--sidebar-right>:first-child){grid-column:2;grid-row:1/span 2}}:where(.eun-grid--lead-left),:where(.eun-grid--lead-right){grid-template-rows:repeat(2, auto)}:where(.eun-grid--lead-left){grid-template-columns:auto 1fr}:where(.eun-grid--lead-right){grid-template-columns:1fr auto}:where(.eun-grid--lead-left>:first-child){grid-column:1;grid-row:1/span 2}:where(.eun-grid--lead-right>:first-child){grid-column:2;grid-row:1/span 2}:where(.eun-grid--gallery){grid-template-columns:repeat(auto-fill, minmax(var(--eun-grid-min-width, 220px), 1fr))}:where(.eun-grid--panel){grid-template-rows:auto 1fr auto}.eunomia-theme{--eun-color-grey-0: #ffffff;--eun-color-grey-100: #f7f8fa;--eun-color-grey-200: #ecedf0;--eun-color-grey-300: #dee0e7;--eun-color-grey-400: #c1c9d6;--eun-color-grey-500: #8d93aa;--eun-color-grey-600: #666e8a;--eun-color-grey-700: #484e61;--eun-color-grey-800: #071621;--eun-color-grey-900: #000000;--eun-font-family: "Mulish", sans-serif;--eun-font-size-xxs: 0.4rem;--eun-font-size-xs: 0.6rem;--eun-font-size-s: 0.82rem;--eun-font-size-m: 1rem;--eun-font-size-l: 1.3rem;--eun-font-size-xl: 1.6rem;--eun-font-size-xxl: 2rem;--eun-font-size-xxxl: 3.4rem;--eun-font-size-xxxxl: 5rem;--eun-font-weight-s: 300;--eun-font-weight-m: 500;--eun-font-weight-l: 700;--eun-space-xxs: 0.1rem;--eun-space-xs: 0.25rem;--eun-space-s: 0.5rem;--eun-space-m: 1rem;--eun-space-l: 2rem;--eun-space-xl: 3.5rem;--eun-space-xxl: 5rem;--eun-border-radius-s: 5px;--eun-border-radius-m: 10px;--eun-border-radius-l: 20px;--eun-border-radius-xl: 999px;--eun-border-width-s: 1px;--eun-border-width-m: 1.5px;--eun-border-width-l: 2px;--eun-shadow-xs: rgba(0, 0, 0, 0.1) 0px 1px 3px 0px, rgba(0, 0, 0, 0.06) 0px 1px 2px 0px;--eun-shadow-s: rgba(0, 0, 0, 0.1) 0px 4px 6px -1px, rgba(0, 0, 0, 0.06) 0px 2px 4px -1px;--eun-shadow-m: rgba(0, 0, 0, 0.1) 0px 10px 15px -3px, rgba(0, 0, 0, 0.05) 0px 4px 6px -2px;--eun-shadow-l: rgba(0, 0, 0, 0.1) 0px 20px 25px -5px, rgba(0, 0, 0, 0.04) 0px 10px 10px -5px;--eun-shadow-xl: rgba(0, 0, 0, 0.25) 0px 25px 50px -12px;--eun-duration-xs: 100ms;--eun-duration-s: 150ms;--eun-duration-m: 200ms;--eun-duration-l: 250ms;--eun-duration-xl: 300ms;--eun-easing-default: ease;--eun-easing-out: ease-out;--eun-surface-transparent-25: color-mix( in srgb, var(--eun-surface-color) 25%, transparent );--eun-surface-transparent-50: color-mix( in srgb, var(--eun-surface-color) 50%, transparent );--eun-surface-transparent-75: color-mix( in srgb, var(--eun-surface-color) 75%, transparent );--eun-text-transparent-25: color-mix( in srgb, var(--eun-text-color) 25%, transparent );--eun-text-transparent-50: color-mix( in srgb, var(--eun-text-color) 50%, transparent );--eun-text-transparent-75: color-mix( in srgb, var(--eun-text-color) 75%, transparent );--eun-text-on-dark-secondary: rgba(255, 255, 255, 0.7);--eun-text-on-inverse-secondary: color-mix( in srgb, var(--eun-text-on-inverse) 70%, transparent );--eun-border-on-inverse: color-mix( in srgb, var(--eun-text-on-inverse) 20%, transparent );--eun-content-hover-on-inverse: color-mix( in srgb, var(--eun-text-on-inverse) 8%, transparent );--eun-content-pressed-on-inverse: color-mix( in srgb, var(--eun-text-on-inverse) 14%, transparent );--eun-backdrop-color: color-mix( in srgb, var(--eun-surface-inverse) 45%, transparent );--eun-height-xxs: 8px;--eun-height-xs: 16px;--eun-height-s: 24px;--eun-height-m: 32px;--eun-height-l: 34px;--eun-height-xl: 48px;--eun-height-xxl: 56px;--eun-breakpoint-mobile: 600px;--eun-breakpoint-tablet: 768px;--eun-breakpoint-laptop: 1024px;--eun-breakpoint-desktop: 1280px}.eunomia-theme--dark{--eun-color-grey-0: #16171c;--eun-color-grey-100: #2b3748;--eun-color-grey-200: #353c48;--eun-color-grey-300: #666e8a;--eun-color-grey-400: #8d93aa;--eun-color-grey-500: #5f6876;--eun-color-grey-600: #c1c1c1;--eun-color-grey-700: #ecedf0;--eun-color-grey-800: #f7f8fa;--eun-color-grey-900: #ffffff;--eun-font-family: "Mulish", sans-serif;--eun-font-size-xxs: 0.4rem;--eun-font-size-xs: 0.6rem;--eun-font-size-s: 0.82rem;--eun-font-size-m: 1rem;--eun-font-size-l: 1.3rem;--eun-font-size-xl: 1.6rem;--eun-font-size-xxl: 2rem;--eun-font-size-xxxl: 3.4rem;--eun-font-size-xxxxl: 5rem;--eun-font-weight-s: 300;--eun-font-weight-m: 500;--eun-font-weight-l: 700;--eun-space-xxs: 0.1rem;--eun-space-xs: 0.25rem;--eun-space-s: 0.5rem;--eun-space-m: 1rem;--eun-space-l: 2rem;--eun-space-xl: 3.5rem;--eun-space-xxl: 5rem;--eun-border-radius-s: 5px;--eun-border-radius-m: 10px;--eun-border-radius-l: 20px;--eun-border-radius-xl: 999px;--eun-border-width-s: 1px;--eun-border-width-m: 1.5px;--eun-border-width-l: 2px;--eun-shadow-xs: rgba(0, 0, 0, 0.1) 0px 1px 3px 0px, rgba(0, 0, 0, 0.06) 0px 1px 2px 0px;--eun-shadow-s: rgba(0, 0, 0, 0.1) 0px 4px 6px -1px, rgba(0, 0, 0, 0.06) 0px 2px 4px -1px;--eun-shadow-m: rgba(0, 0, 0, 0.1) 0px 10px 15px -3px, rgba(0, 0, 0, 0.05) 0px 4px 6px -2px;--eun-shadow-l: rgba(0, 0, 0, 0.1) 0px 20px 25px -5px, rgba(0, 0, 0, 0.04) 0px 10px 10px -5px;--eun-shadow-xl: rgba(0, 0, 0, 0.25) 0px 25px 50px -12px;--eun-duration-xs: 100ms;--eun-duration-s: 150ms;--eun-duration-m: 200ms;--eun-duration-l: 250ms;--eun-duration-xl: 300ms;--eun-easing-default: ease;--eun-easing-out: ease-out;--eun-surface-transparent-25: color-mix( in srgb, var(--eun-surface-color) 25%, transparent );--eun-surface-transparent-50: color-mix( in srgb, var(--eun-surface-color) 50%, transparent );--eun-surface-transparent-75: color-mix( in srgb, var(--eun-surface-color) 75%, transparent );--eun-text-transparent-25: color-mix( in srgb, var(--eun-text-color) 25%, transparent );--eun-text-transparent-50: color-mix( in srgb, var(--eun-text-color) 50%, transparent );--eun-text-transparent-75: color-mix( in srgb, var(--eun-text-color) 75%, transparent );--eun-text-on-dark-secondary: rgba(255, 255, 255, 0.7);--eun-text-on-inverse-secondary: color-mix( in srgb, var(--eun-text-on-inverse) 70%, transparent );--eun-border-on-inverse: color-mix( in srgb, var(--eun-text-on-inverse) 20%, transparent );--eun-content-hover-on-inverse: color-mix( in srgb, var(--eun-text-on-inverse) 8%, transparent );--eun-content-pressed-on-inverse: color-mix( in srgb, var(--eun-text-on-inverse) 14%, transparent );--eun-backdrop-color: color-mix( in srgb, var(--eun-surface-inverse) 45%, transparent );--eun-height-xxs: 8px;--eun-height-xs: 16px;--eun-height-s: 24px;--eun-height-m: 32px;--eun-height-l: 34px;--eun-height-xl: 48px;--eun-height-xxl: 56px;--eun-breakpoint-mobile: 600px;--eun-breakpoint-tablet: 768px;--eun-breakpoint-laptop: 1024px;--eun-breakpoint-desktop: 1280px}
package/dist/cdn/styles/themes/eunomia-theme.scss CHANGED
@@ -1,5 +1,6 @@
1
- @use './../tools/indexes/eunomia-tools.index.scss' as *;
2
- @use './mixins/eunomia-scales.mixin.scss' as *;
1
+ @use "./../tools/indexes/eunomia-tools.index.scss" as *;
2
+ @use "./mixins/eunomia-scales.mixin.scss" as *;
3
+ @use "./../eunomia-grid.scss";
3
4
 
4
5
  @mixin default-settings {
5
6
  @include eunomia-font-family();
@@ -9,10 +10,10 @@
9
10
  @include eunomia-border-radius();
10
11
  @include eunomia-border-width();
11
12
  @include eunomia-shadows();
13
+ @include eunomia-motion();
12
14
  @include eunomia-alpha();
13
15
  @include eunomia-height();
14
16
  @include eunomia-breakpoints();
15
- @include eunomia-grid-layouts();
16
17
  }
17
18
 
18
19
  .eunomia-theme {
package/dist/cdn/styles/themes/mixins/eunomia-a11y-color.mixin.scss CHANGED
@@ -48,7 +48,10 @@
48
48
  $result: $color;
49
49
  $guard: 0;
50
50
 
51
- @while eunomia-contrast-ratio($result, $surface) < $min-contrast and $guard < 60
51
+ @while eunomia-contrast-ratio($result, $surface) <
52
+ $min-contrast and
53
+ $guard <
54
+ 60
52
55
  {
53
56
  $result: color.adjust($result, $lightness: $step, $space: hsl);
54
57
  $guard: $guard + 1;
@@ -64,3 +67,33 @@
64
67
 
65
68
  @return rgb($r, $g, $b);
66
69
  }
70
+
71
+ @function eunomia-light-accessible(
72
+ $color,
73
+ $surface: #ffffff,
74
+ $min-contrast: 4.5,
75
+ $min-lightness: 10%,
76
+ $step: 1.5%
77
+ ) {
78
+ $result: $color;
79
+ $guard: 0;
80
+
81
+ @while eunomia-contrast-ratio($result, $surface) <
82
+ $min-contrast and
83
+ $guard <
84
+ 60
85
+ {
86
+ $result: color.adjust($result, $lightness: -$step, $space: hsl);
87
+ $guard: $guard + 1;
88
+
89
+ @if color.channel($result, "lightness", $space: hsl) <= $min-lightness {
90
+ $guard: 60;
91
+ }
92
+ }
93
+
94
+ $r: math.round(color.channel($result, "red"));
95
+ $g: math.round(color.channel($result, "green"));
96
+ $b: math.round(color.channel($result, "blue"));
97
+
98
+ @return rgb($r, $g, $b);
99
+ }
package/dist/cdn/styles/themes/mixins/eunomia-neutrals.mixin.scss CHANGED
@@ -32,6 +32,8 @@
32
32
  --eun-text-disabled-color: #8d93aa;
33
33
  --eun-text-readonly-color: #c1c9d6;
34
34
  --eun-disabled-content: #c1c9d6;
35
+ --eun-surface-inverse: #0b1620;
36
+ --eun-text-on-inverse: #f5f7fa;
35
37
  }
36
38
 
37
39
  @mixin eunomia-dark-neutrals {
@@ -68,4 +70,6 @@
68
70
  --eun-text-disabled-color: var(--eun-color-grey-500);
69
71
  --eun-text-readonly-color: var(--eun-color-grey-400);
70
72
  --eun-disabled-content: var(--eun-color-grey-400);
73
+ --eun-surface-inverse: #0b1620;
74
+ --eun-text-on-inverse: #f5f7fa;
71
75
  }
package/dist/cdn/styles/themes/mixins/eunomia-states.mixin.scss CHANGED
@@ -1,3 +1,4 @@
1
+ @use "sass:color";
1
2
  @use "./eunomia-a11y-color.mixin.scss" as *;
2
3
 
3
4
  @mixin eunomia-all-states {
@@ -12,40 +13,63 @@
12
13
  --eun-color-warning-100: #{eunomia-dark-accessible(#c85207)};
13
14
  --eun-color-critical-100: #{eunomia-dark-accessible(#aa0014)};
14
15
  --eun-color-info-100: #{eunomia-dark-accessible(#097faf)};
16
+ --eun-color-success-text: var(--eun-color-success-100);
17
+ --eun-color-warning-text: var(--eun-color-warning-100);
18
+ --eun-color-critical-text: var(--eun-color-critical-100);
19
+ --eun-color-info-text: var(--eun-color-info-100);
20
+ }
21
+
22
+ @function -eunomia-state-text($base) {
23
+ @return eunomia-light-accessible(
24
+ $base,
25
+ $surface: color.mix($base, #ffffff, 5%)
26
+ );
15
27
  }
16
28
 
17
29
  @mixin eunomia-success {
18
30
  $base: #1a9948;
19
31
 
20
32
  --eun-color-success-100: #{$base};
21
- --eun-color-success-90: #{rgba($base, 0.32)};
22
- --eun-color-success-50: #{rgba($base, 0.16)};
23
- --eun-color-success-30: #{rgba($base, 0.06)};
33
+ --eun-color-success-text: #{-eunomia-state-text($base)};
34
+ --eun-color-success-alpha-5: #{rgba($base, 0.05)};
35
+ --eun-color-success-alpha-10: #{rgba($base, 0.1)};
36
+ --eun-color-success-alpha-20: #{rgba($base, 0.2)};
37
+ --eun-color-success-alpha-30: #{rgba($base, 0.3)};
38
+ --eun-color-success-alpha-40: #{rgba($base, 0.4)};
24
39
  }
25
40
 
26
41
  @mixin eunomia-warning {
27
42
  $base: #c85207;
28
43
 
29
44
  --eun-color-warning-100: #{$base};
30
- --eun-color-warning-90: #{rgba($base, 0.32)};
31
- --eun-color-warning-50: #{rgba($base, 0.16)};
32
- --eun-color-warning-30: #{rgba($base, 0.06)};
45
+ --eun-color-warning-text: #{-eunomia-state-text($base)};
46
+ --eun-color-warning-alpha-5: #{rgba($base, 0.05)};
47
+ --eun-color-warning-alpha-10: #{rgba($base, 0.1)};
48
+ --eun-color-warning-alpha-20: #{rgba($base, 0.2)};
49
+ --eun-color-warning-alpha-30: #{rgba($base, 0.3)};
50
+ --eun-color-warning-alpha-40: #{rgba($base, 0.4)};
33
51
  }
34
52
 
35
53
  @mixin eunomia-critical {
36
54
  $base: #aa0014;
37
55
 
38
56
  --eun-color-critical-100: #{$base};
39
- --eun-color-critical-90: #{rgba($base, 0.32)};
40
- --eun-color-critical-50: #{rgba($base, 0.16)};
41
- --eun-color-critical-30: #{rgba($base, 0.06)};
57
+ --eun-color-critical-text: #{-eunomia-state-text($base)};
58
+ --eun-color-critical-alpha-5: #{rgba($base, 0.05)};
59
+ --eun-color-critical-alpha-10: #{rgba($base, 0.1)};
60
+ --eun-color-critical-alpha-20: #{rgba($base, 0.2)};
61
+ --eun-color-critical-alpha-30: #{rgba($base, 0.3)};
62
+ --eun-color-critical-alpha-40: #{rgba($base, 0.4)};
42
63
  }
43
64
 
44
65
  @mixin eunomia-info {
45
66
  $base: #097faf;
46
67
 
47
68
  --eun-color-info-100: #{$base};
48
- --eun-color-info-90: #{rgba($base, 0.32)};
49
- --eun-color-info-50: #{rgba($base, 0.16)};
50
- --eun-color-info-30: #{rgba($base, 0.06)};
69
+ --eun-color-info-text: #{-eunomia-state-text($base)};
70
+ --eun-color-info-alpha-5: #{rgba($base, 0.05)};
71
+ --eun-color-info-alpha-10: #{rgba($base, 0.1)};
72
+ --eun-color-info-alpha-20: #{rgba($base, 0.2)};
73
+ --eun-color-info-alpha-30: #{rgba($base, 0.3)};
74
+ --eun-color-info-alpha-40: #{rgba($base, 0.4)};
51
75
  }
package/dist/cdn/styles/themes/prebuilt-themes/eunomia/eunomia-dark.mixin.scss CHANGED
@@ -26,11 +26,11 @@
26
26
  --eun-color-on-primary-900: #000000de;
27
27
  --eun-color-primary-950: #b3c6ff;
28
28
  --eun-color-on-primary-950: #000000de;
29
- --eun-color-primary-bg-hover: #{rgba($primary-500, 0.08)};
30
- --eun-color-primary-bg-active: #{rgba($primary-500, 0.08)};
31
- --eun-color-primary-transparent: #{rgba($primary-500, 0.2)};
32
- --eun-color-primary-transparent-hover: #{rgba($primary-500, 0.3)};
33
- --eun-color-primary-transparent-active: #{rgba($primary-500, 0.4)};
29
+ --eun-color-primary-alpha-5: #{rgba($primary-500, 0.05)};
30
+ --eun-color-primary-alpha-10: #{rgba($primary-500, 0.1)};
31
+ --eun-color-primary-alpha-20: #{rgba($primary-500, 0.2)};
32
+ --eun-color-primary-alpha-30: #{rgba($primary-500, 0.3)};
33
+ --eun-color-primary-alpha-40: #{rgba($primary-500, 0.4)};
34
34
 
35
35
  --eun-color-secondary-50: #7b623a;
36
36
  --eun-color-on-secondary-50: #ffffff;
@@ -54,11 +54,11 @@
54
54
  --eun-color-on-secondary-900: #000000de;
55
55
  --eun-color-secondary-950: #f6ddb4;
56
56
  --eun-color-on-secondary-950: #000000de;
57
- --eun-color-secondary-bg-hover: #{rgba($secondary-500, 0.08)};
58
- --eun-color-secondary-bg-active: #{rgba($secondary-500, 0.08)};
59
- --eun-color-secondary-transparent: #{rgba($secondary-500, 0.2)};
60
- --eun-color-secondary-transparent-hover: #{rgba($secondary-500, 0.3)};
61
- --eun-color-secondary-transparent-active: #{rgba($secondary-500, 0.4)};
57
+ --eun-color-secondary-alpha-5: #{rgba($secondary-500, 0.05)};
58
+ --eun-color-secondary-alpha-10: #{rgba($secondary-500, 0.1)};
59
+ --eun-color-secondary-alpha-20: #{rgba($secondary-500, 0.2)};
60
+ --eun-color-secondary-alpha-30: #{rgba($secondary-500, 0.3)};
61
+ --eun-color-secondary-alpha-40: #{rgba($secondary-500, 0.4)};
62
62
 
63
63
  @include eunomia-dark-neutrals();
64
64
 
package/dist/cdn/styles/themes/prebuilt-themes/eunomia/eunomia.mixin.scss CHANGED
@@ -26,11 +26,11 @@
26
26
  --eun-color-on-primary-900: #ffffff;
27
27
  --eun-color-primary-950: #203a85;
28
28
  --eun-color-on-primary-950: #ffffff;
29
- --eun-color-primary-bg-hover: #{rgba($primary-500, 0.08)};
30
- --eun-color-primary-bg-active: #{rgba($primary-500, 0.08)};
31
- --eun-color-primary-transparent: #{rgba($primary-500, 0.2)};
32
- --eun-color-primary-transparent-hover: #{rgba($primary-500, 0.3)};
33
- --eun-color-primary-transparent-active: #{rgba($primary-500, 0.4)};
29
+ --eun-color-primary-alpha-5: #{rgba($primary-500, 0.05)};
30
+ --eun-color-primary-alpha-10: #{rgba($primary-500, 0.1)};
31
+ --eun-color-primary-alpha-20: #{rgba($primary-500, 0.2)};
32
+ --eun-color-primary-alpha-30: #{rgba($primary-500, 0.3)};
33
+ --eun-color-primary-alpha-40: #{rgba($primary-500, 0.4)};
34
34
 
35
35
  --eun-color-secondary-50: #f6ddb4;
36
36
  --eun-color-on-secondary-50: #000000de;
@@ -54,11 +54,11 @@
54
54
  --eun-color-on-secondary-900: #000000de;
55
55
  --eun-color-secondary-950: #7b623a;
56
56
  --eun-color-on-secondary-950: #ffffff;
57
- --eun-color-secondary-bg-hover: #{rgba($secondary-500, 0.08)};
58
- --eun-color-secondary-bg-active: #{rgba($secondary-500, 0.08)};
59
- --eun-color-secondary-transparent: #{rgba($secondary-500, 0.2)};
60
- --eun-color-secondary-transparent-hover: #{rgba($secondary-500, 0.3)};
61
- --eun-color-secondary-transparent-active: #{rgba($secondary-500, 0.4)};
57
+ --eun-color-secondary-alpha-5: #{rgba($secondary-500, 0.05)};
58
+ --eun-color-secondary-alpha-10: #{rgba($secondary-500, 0.1)};
59
+ --eun-color-secondary-alpha-20: #{rgba($secondary-500, 0.2)};
60
+ --eun-color-secondary-alpha-30: #{rgba($secondary-500, 0.3)};
61
+ --eun-color-secondary-alpha-40: #{rgba($secondary-500, 0.4)};
62
62
 
63
63
  @include eunomia-neutrals();
64
64
 
package/dist/cdn/styles/themes/prebuilt-themes/eunomia/eunomia.theme.css CHANGED
@@ -1 +1 @@
1
- @font-face{font-family:"Mulish";font-style:normal;font-weight:200 1000;font-display:swap;src:url("../../../fonts/mulish/mulish-latin-variable-normal.woff2") format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}@font-face{font-family:"Mulish";font-style:italic;font-weight:200 1000;font-display:swap;src:url("../../../fonts/mulish/mulish-latin-variable-italic.woff2") format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}.eunomia-eunomia-theme{--eun-color-primary-50: #9ab4ff;--eun-color-on-primary-50: #000000de;--eun-color-primary-100: #85a4ff;--eun-color-on-primary-100: #000000de;--eun-color-primary-200: #6f94ff;--eun-color-on-primary-200: #000000de;--eun-color-primary-300: #5480ff;--eun-color-on-primary-300: #000000de;--eun-color-primary-400: #4978ff;--eun-color-on-primary-400: #000000de;--eun-color-primary-500: #3d6fff;--eun-color-on-primary-500: #ffffff;--eun-color-primary-600: #3968f0;--eun-color-on-primary-600: #ffffff;--eun-color-primary-700: #3662e0;--eun-color-on-primary-700: #ffffff;--eun-color-primary-800: #2d52bd;--eun-color-on-primary-800: #ffffff;--eun-color-primary-900: #2646a1;--eun-color-on-primary-900: #ffffff;--eun-color-primary-950: #203a85;--eun-color-on-primary-950: #ffffff;--eun-color-primary-bg-hover: rgba(61, 111, 255, 0.08);--eun-color-primary-bg-active: rgba(61, 111, 255, 0.08);--eun-color-primary-transparent: rgba(61, 111, 255, 0.2);--eun-color-primary-transparent-hover: rgba(61, 111, 255, 0.3);--eun-color-primary-transparent-active: rgba(61, 111, 255, 0.4);--eun-color-secondary-50: #f6ddb4;--eun-color-on-secondary-50: #000000de;--eun-color-secondary-100: #f4d5a4;--eun-color-on-secondary-100: #000000de;--eun-color-secondary-200: #f2ce94;--eun-color-on-secondary-200: #000000de;--eun-color-secondary-300: #efc580;--eun-color-on-secondary-300: #000000de;--eun-color-secondary-400: #eec178;--eun-color-on-secondary-400: #000000de;--eun-color-secondary-500: #edbd6f;--eun-color-on-secondary-500: #000000de;--eun-color-secondary-600: #dfb268;--eun-color-on-secondary-600: #000000de;--eun-color-secondary-700: #d1a662;--eun-color-on-secondary-700: #000000de;--eun-color-secondary-800: #af8c52;--eun-color-on-secondary-800: #000000de;--eun-color-secondary-900: #957746;--eun-color-on-secondary-900: #000000de;--eun-color-secondary-950: #7b623a;--eun-color-on-secondary-950: #ffffff;--eun-color-secondary-bg-hover: rgba(237, 189, 111, 0.08);--eun-color-secondary-bg-active: rgba(237, 189, 111, 0.08);--eun-color-secondary-transparent: rgba(237, 189, 111, 0.2);--eun-color-secondary-transparent-hover: rgba(237, 189, 111, 0.3);--eun-color-secondary-transparent-active: rgba(237, 189, 111, 0.4);--eun-content-hover: #9696961a;--eun-content-pressed: #e4e6e8;--eun-divider-color: #dee0e7;--eun-border-color: #dee0e7;--eun-surface-color: #ffffff;--eun-surface-sunken: color-mix( in srgb, var(--eun-text-color) 5%, transparent );--eun-surface-sunken-hover: color-mix( in srgb, var(--eun-text-color) 9%, transparent );--eun-surface-sunken-pressed: color-mix( in srgb, var(--eun-text-color) 12%, transparent );--eun-surface-sunken-strong: color-mix( in srgb, var(--eun-text-color) 8%, transparent );--eun-disabled-color: #ecedf0;--eun-readonly-color: #666e8a;--eun-text-color: #071621;--eun-text-secondary: #484e61;--eun-placeholder-color: var(--eun-color-grey-400, #c1c9d6);--eun-text-disabled-color: #8d93aa;--eun-text-readonly-color: #c1c9d6;--eun-disabled-content: #c1c9d6;--eun-surface-tint: #f5f8ff;--eun-divider-tint: #d6dae8;--eun-border-tint: #d6dae8;--eun-content-hover-tint: #e4e9f1;--eun-content-pressed-tint: #dce0e9}.eunomia-eunomia-theme--dark{--eun-color-primary-50: #384c85;--eun-color-on-primary-50: #ffffff;--eun-color-primary-100: #445ca1;--eun-color-on-primary-100: #ffffff;--eun-color-primary-200: #506cbd;--eun-color-on-primary-200: #ffffff;--eun-color-primary-300: #5f80e0;--eun-color-on-primary-300: #000000de;--eun-color-primary-400: #6689f0;--eun-color-on-primary-400: #000000de;--eun-color-primary-500: #6c92ff;--eun-color-on-primary-500: #000000de;--eun-color-primary-600: #7599ff;--eun-color-on-primary-600: #000000de;--eun-color-primary-700: #7e9fff;--eun-color-on-primary-700: #000000de;--eun-color-primary-800: #92aeff;--eun-color-on-primary-800: #000000de;--eun-color-primary-900: #a2baff;--eun-color-on-primary-900: #000000de;--eun-color-primary-950: #b3c6ff;--eun-color-on-primary-950: #000000de;--eun-color-primary-bg-hover: rgba(108, 146, 255, 0.08);--eun-color-primary-bg-active: rgba(108, 146, 255, 0.08);--eun-color-primary-transparent: rgba(108, 146, 255, 0.2);--eun-color-primary-transparent-hover: rgba(108, 146, 255, 0.3);--eun-color-primary-transparent-active: rgba(108, 146, 255, 0.4);--eun-color-secondary-50: #7b623a;--eun-color-on-secondary-50: #ffffff;--eun-color-secondary-100: #957746;--eun-color-on-secondary-100: #000000de;--eun-color-secondary-200: #af8c52;--eun-color-on-secondary-200: #000000de;--eun-color-secondary-300: #d1a662;--eun-color-on-secondary-300: #000000de;--eun-color-secondary-400: #dfb268;--eun-color-on-secondary-400: #000000de;--eun-color-secondary-500: #edbd6f;--eun-color-on-secondary-500: #000000de;--eun-color-secondary-600: #eec178;--eun-color-on-secondary-600: #000000de;--eun-color-secondary-700: #efc580;--eun-color-on-secondary-700: #000000de;--eun-color-secondary-800: #f2ce94;--eun-color-on-secondary-800: #000000de;--eun-color-secondary-900: #f4d5a4;--eun-color-on-secondary-900: #000000de;--eun-color-secondary-950: #f6ddb4;--eun-color-on-secondary-950: #000000de;--eun-color-secondary-bg-hover: rgba(237, 189, 111, 0.08);--eun-color-secondary-bg-active: rgba(237, 189, 111, 0.08);--eun-color-secondary-transparent: rgba(237, 189, 111, 0.2);--eun-color-secondary-transparent-hover: rgba(237, 189, 111, 0.3);--eun-color-secondary-transparent-active: rgba(237, 189, 111, 0.4);--eun-content-hover: rgba(255, 255, 255, 0.08);--eun-content-pressed: rgba(255, 255, 255, 0.14);--eun-divider-color: var(--eun-color-grey-300);--eun-border-color: var(--eun-color-grey-300);--eun-surface-color: var(--eun-color-grey-0);--eun-surface-sunken: color-mix( in srgb, var(--eun-text-color) 8%, transparent );--eun-surface-sunken-hover: color-mix( in srgb, var(--eun-text-color) 12%, transparent );--eun-surface-sunken-pressed: color-mix( in srgb, var(--eun-text-color) 16%, transparent );--eun-surface-sunken-strong: color-mix( in srgb, var(--eun-text-color) 16%, transparent );--eun-disabled-color: var(--eun-color-grey-200);--eun-readonly-color: var(--eun-color-grey-600);--eun-text-color: var(--eun-color-grey-800);--eun-text-secondary: var(--eun-color-grey-700);--eun-placeholder-color: var(--eun-color-grey-400);--eun-text-disabled-color: var(--eun-color-grey-500);--eun-text-readonly-color: var(--eun-color-grey-400);--eun-disabled-content: var(--eun-color-grey-400);--eun-surface-tint: #2a3243;--eun-divider-tint: #667090;--eun-border-tint: #667090;--eun-content-hover-tint: rgba(248, 250, 255, 0.08);--eun-content-pressed-tint: rgba(248, 250, 255, 0.14)}
1
+ @font-face{font-family:"Mulish";font-style:normal;font-weight:200 1000;font-display:swap;src:url("../../../fonts/mulish/mulish-latin-variable-normal.woff2") format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}@font-face{font-family:"Mulish";font-style:italic;font-weight:200 1000;font-display:swap;src:url("../../../fonts/mulish/mulish-latin-variable-italic.woff2") format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}:where(.eun-grid){--_cols0: var(--eun-grid-columns, var(--_variantCols0, 1));--_cols1: var( --eun-grid-columns-mobile, var(--eun-grid-columns, var(--_variantCols1, var(--_variantCols0, 1))) );--_cols2: var( --eun-grid-columns-tablet, var( --eun-grid-columns-mobile, var( --eun-grid-columns, var(--_variantCols2, var(--_variantCols1, var(--_variantCols0, 1))) ) ) );--_cols3: var( --eun-grid-columns-laptop, var( --eun-grid-columns-tablet, var( --eun-grid-columns-mobile, var( --eun-grid-columns, var( --_variantCols3, var( --_variantCols2, var(--_variantCols1, var(--_variantCols0, 1)) ) ) ) ) ) );--_cols4: var( --eun-grid-columns-desktop, var( --eun-grid-columns-laptop, var( --eun-grid-columns-tablet, var( --eun-grid-columns-mobile, var( --eun-grid-columns, var( --_variantCols4, var( --_variantCols3, var( --_variantCols2, var(--_variantCols1, var(--_variantCols0, 1)) ) ) ) ) ) ) ) );--_cols: var(--_cols0);display:grid;grid-template-columns:repeat(var(--_cols), minmax(0, 1fr));row-gap:var(--eun-grid-row-gap, var(--eun-space-s));column-gap:var(--eun-grid-column-gap, var(--eun-space-m))}@media(width >= 600px){:where(.eun-grid){--_cols: var(--_cols1)}}@media(width >= 768px){:where(.eun-grid){--_cols: var(--_cols2)}}@media(width >= 1024px){:where(.eun-grid){--_cols: var(--_cols3)}}@media(width >= 1280px){:where(.eun-grid){--_cols: var(--_cols4)}}:where(.eun-grid--halves),:where(.eun-grid--2x2){--_variantCols2: 2}:where(.eun-grid--thirds-equal){--_variantCols2: 3}:where(.eun-grid--2x2){grid-auto-flow:row}@media(width >= 768px){:where(.eun-grid--thirds-1-2){grid-template-columns:1fr 2fr}:where(.eun-grid--thirds-2-1){grid-template-columns:2fr 1fr}:where(.eun-grid--sidebar-left),:where(.eun-grid--sidebar-right){grid-template-columns:repeat(2, 1fr);grid-template-rows:repeat(2, auto)}:where(.eun-grid--sidebar-left>:first-child){grid-column:1;grid-row:1/span 2}:where(.eun-grid--sidebar-right>:first-child){grid-column:2;grid-row:1/span 2}}:where(.eun-grid--lead-left),:where(.eun-grid--lead-right){grid-template-rows:repeat(2, auto)}:where(.eun-grid--lead-left){grid-template-columns:auto 1fr}:where(.eun-grid--lead-right){grid-template-columns:1fr auto}:where(.eun-grid--lead-left>:first-child){grid-column:1;grid-row:1/span 2}:where(.eun-grid--lead-right>:first-child){grid-column:2;grid-row:1/span 2}:where(.eun-grid--gallery){grid-template-columns:repeat(auto-fill, minmax(var(--eun-grid-min-width, 220px), 1fr))}:where(.eun-grid--panel){grid-template-rows:auto 1fr auto}.eunomia-eunomia-theme{--eun-color-primary-50: #9ab4ff;--eun-color-on-primary-50: #000000de;--eun-color-primary-100: #85a4ff;--eun-color-on-primary-100: #000000de;--eun-color-primary-200: #6f94ff;--eun-color-on-primary-200: #000000de;--eun-color-primary-300: #5480ff;--eun-color-on-primary-300: #000000de;--eun-color-primary-400: #4978ff;--eun-color-on-primary-400: #000000de;--eun-color-primary-500: #3d6fff;--eun-color-on-primary-500: #ffffff;--eun-color-primary-600: #3968f0;--eun-color-on-primary-600: #ffffff;--eun-color-primary-700: #3662e0;--eun-color-on-primary-700: #ffffff;--eun-color-primary-800: #2d52bd;--eun-color-on-primary-800: #ffffff;--eun-color-primary-900: #2646a1;--eun-color-on-primary-900: #ffffff;--eun-color-primary-950: #203a85;--eun-color-on-primary-950: #ffffff;--eun-color-primary-alpha-5: rgba(61, 111, 255, 0.05);--eun-color-primary-alpha-10: rgba(61, 111, 255, 0.1);--eun-color-primary-alpha-20: rgba(61, 111, 255, 0.2);--eun-color-primary-alpha-30: rgba(61, 111, 255, 0.3);--eun-color-primary-alpha-40: rgba(61, 111, 255, 0.4);--eun-color-secondary-50: #f6ddb4;--eun-color-on-secondary-50: #000000de;--eun-color-secondary-100: #f4d5a4;--eun-color-on-secondary-100: #000000de;--eun-color-secondary-200: #f2ce94;--eun-color-on-secondary-200: #000000de;--eun-color-secondary-300: #efc580;--eun-color-on-secondary-300: #000000de;--eun-color-secondary-400: #eec178;--eun-color-on-secondary-400: #000000de;--eun-color-secondary-500: #edbd6f;--eun-color-on-secondary-500: #000000de;--eun-color-secondary-600: #dfb268;--eun-color-on-secondary-600: #000000de;--eun-color-secondary-700: #d1a662;--eun-color-on-secondary-700: #000000de;--eun-color-secondary-800: #af8c52;--eun-color-on-secondary-800: #000000de;--eun-color-secondary-900: #957746;--eun-color-on-secondary-900: #000000de;--eun-color-secondary-950: #7b623a;--eun-color-on-secondary-950: #ffffff;--eun-color-secondary-alpha-5: rgba(237, 189, 111, 0.05);--eun-color-secondary-alpha-10: rgba(237, 189, 111, 0.1);--eun-color-secondary-alpha-20: rgba(237, 189, 111, 0.2);--eun-color-secondary-alpha-30: rgba(237, 189, 111, 0.3);--eun-color-secondary-alpha-40: rgba(237, 189, 111, 0.4);--eun-content-hover: #9696961a;--eun-content-pressed: #e4e6e8;--eun-divider-color: #dee0e7;--eun-border-color: #dee0e7;--eun-surface-color: #ffffff;--eun-surface-sunken: color-mix( in srgb, var(--eun-text-color) 5%, transparent );--eun-surface-sunken-hover: color-mix( in srgb, var(--eun-text-color) 9%, transparent );--eun-surface-sunken-pressed: color-mix( in srgb, var(--eun-text-color) 12%, transparent );--eun-surface-sunken-strong: color-mix( in srgb, var(--eun-text-color) 8%, transparent );--eun-disabled-color: #ecedf0;--eun-readonly-color: #666e8a;--eun-text-color: #071621;--eun-text-secondary: #484e61;--eun-placeholder-color: var(--eun-color-grey-400, #c1c9d6);--eun-text-disabled-color: #8d93aa;--eun-text-readonly-color: #c1c9d6;--eun-disabled-content: #c1c9d6;--eun-surface-inverse: #0b1620;--eun-text-on-inverse: #f5f7fa;--eun-surface-tint: #f5f8ff;--eun-divider-tint: #d6dae8;--eun-border-tint: #d6dae8;--eun-content-hover-tint: #e4e9f1;--eun-content-pressed-tint: #dce0e9}.eunomia-eunomia-theme--dark{--eun-color-primary-50: #384c85;--eun-color-on-primary-50: #ffffff;--eun-color-primary-100: #445ca1;--eun-color-on-primary-100: #ffffff;--eun-color-primary-200: #506cbd;--eun-color-on-primary-200: #ffffff;--eun-color-primary-300: #5f80e0;--eun-color-on-primary-300: #000000de;--eun-color-primary-400: #6689f0;--eun-color-on-primary-400: #000000de;--eun-color-primary-500: #6c92ff;--eun-color-on-primary-500: #000000de;--eun-color-primary-600: #7599ff;--eun-color-on-primary-600: #000000de;--eun-color-primary-700: #7e9fff;--eun-color-on-primary-700: #000000de;--eun-color-primary-800: #92aeff;--eun-color-on-primary-800: #000000de;--eun-color-primary-900: #a2baff;--eun-color-on-primary-900: #000000de;--eun-color-primary-950: #b3c6ff;--eun-color-on-primary-950: #000000de;--eun-color-primary-alpha-5: rgba(108, 146, 255, 0.05);--eun-color-primary-alpha-10: rgba(108, 146, 255, 0.1);--eun-color-primary-alpha-20: rgba(108, 146, 255, 0.2);--eun-color-primary-alpha-30: rgba(108, 146, 255, 0.3);--eun-color-primary-alpha-40: rgba(108, 146, 255, 0.4);--eun-color-secondary-50: #7b623a;--eun-color-on-secondary-50: #ffffff;--eun-color-secondary-100: #957746;--eun-color-on-secondary-100: #000000de;--eun-color-secondary-200: #af8c52;--eun-color-on-secondary-200: #000000de;--eun-color-secondary-300: #d1a662;--eun-color-on-secondary-300: #000000de;--eun-color-secondary-400: #dfb268;--eun-color-on-secondary-400: #000000de;--eun-color-secondary-500: #edbd6f;--eun-color-on-secondary-500: #000000de;--eun-color-secondary-600: #eec178;--eun-color-on-secondary-600: #000000de;--eun-color-secondary-700: #efc580;--eun-color-on-secondary-700: #000000de;--eun-color-secondary-800: #f2ce94;--eun-color-on-secondary-800: #000000de;--eun-color-secondary-900: #f4d5a4;--eun-color-on-secondary-900: #000000de;--eun-color-secondary-950: #f6ddb4;--eun-color-on-secondary-950: #000000de;--eun-color-secondary-alpha-5: rgba(237, 189, 111, 0.05);--eun-color-secondary-alpha-10: rgba(237, 189, 111, 0.1);--eun-color-secondary-alpha-20: rgba(237, 189, 111, 0.2);--eun-color-secondary-alpha-30: rgba(237, 189, 111, 0.3);--eun-color-secondary-alpha-40: rgba(237, 189, 111, 0.4);--eun-content-hover: rgba(255, 255, 255, 0.08);--eun-content-pressed: rgba(255, 255, 255, 0.14);--eun-divider-color: var(--eun-color-grey-300);--eun-border-color: var(--eun-color-grey-300);--eun-surface-color: var(--eun-color-grey-0);--eun-surface-sunken: color-mix( in srgb, var(--eun-text-color) 8%, transparent );--eun-surface-sunken-hover: color-mix( in srgb, var(--eun-text-color) 12%, transparent );--eun-surface-sunken-pressed: color-mix( in srgb, var(--eun-text-color) 16%, transparent );--eun-surface-sunken-strong: color-mix( in srgb, var(--eun-text-color) 16%, transparent );--eun-disabled-color: var(--eun-color-grey-200);--eun-readonly-color: var(--eun-color-grey-600);--eun-text-color: var(--eun-color-grey-800);--eun-text-secondary: var(--eun-color-grey-700);--eun-placeholder-color: var(--eun-color-grey-400);--eun-text-disabled-color: var(--eun-color-grey-500);--eun-text-readonly-color: var(--eun-color-grey-400);--eun-disabled-content: var(--eun-color-grey-400);--eun-surface-inverse: #0b1620;--eun-text-on-inverse: #f5f7fa;--eun-surface-tint: #2a3243;--eun-divider-tint: #667090;--eun-border-tint: #667090;--eun-content-hover-tint: rgba(248, 250, 255, 0.08);--eun-content-pressed-tint: rgba(248, 250, 255, 0.14)}
package/dist/cdn/styles/themes/prebuilt-themes/eunomia/eunomia.theme.scss CHANGED
@@ -9,8 +9,9 @@
9
9
  @use "./../../../tools/mixins/settings/eunomia-radius.mixin.scss" as *;
10
10
  @use "./../../../tools/mixins/settings/eunomia-border.mixin.scss" as *;
11
11
  @use "./../../../tools/mixins/settings/eunomia-shadows.mixin.scss" as *;
12
+ @use "./../../../tools/mixins/settings/eunomia-motion.mixin.scss" as *;
12
13
  @use "./../../../tools/mixins/settings/eunomia-alpha.mixin.scss" as *;
13
- @use "./../../../tools/mixins/layout/eunomia-grid.mixin.scss" as *;
14
+ @use "./../../../eunomia-grid.scss";
14
15
 
15
16
  @mixin default-settings {
16
17
  @include eunomia-font-family();
@@ -20,10 +21,10 @@
20
21
  @include eunomia-border-radius();
21
22
  @include eunomia-border-width();
22
23
  @include eunomia-shadows();
24
+ @include eunomia-motion();
23
25
  @include eunomia-alpha();
24
26
  @include eunomia-height();
25
27
  @include eunomia-breakpoints();
26
- @include eunomia-grid-layouts();
27
28
  }
28
29
 
29
30
  @mixin eunomia-eunomia-theme() {
package/dist/cdn/styles/themes/prebuilt-themes/fire/eunomia-fire-dark.mixin.scss CHANGED
@@ -26,11 +26,11 @@
26
26
  --eun-color-on-primary-900: #000000de;
27
27
  --eun-color-primary-950: #e99b96;
28
28
  --eun-color-on-primary-950: #000000de;
29
- --eun-color-primary-bg-hover: #{rgba($primary-500, 0.08)};
30
- --eun-color-primary-bg-active: #{rgba($primary-500, 0.08)};
31
- --eun-color-primary-transparent: #{rgba($primary-500, 0.2)};
32
- --eun-color-primary-transparent-hover: #{rgba($primary-500, 0.3)};
33
- --eun-color-primary-transparent-active: #{rgba($primary-500, 0.4)};
29
+ --eun-color-primary-alpha-5: #{rgba($primary-500, 0.05)};
30
+ --eun-color-primary-alpha-10: #{rgba($primary-500, 0.1)};
31
+ --eun-color-primary-alpha-20: #{rgba($primary-500, 0.2)};
32
+ --eun-color-primary-alpha-30: #{rgba($primary-500, 0.3)};
33
+ --eun-color-primary-alpha-40: #{rgba($primary-500, 0.4)};
34
34
 
35
35
  --eun-color-secondary-50: #743f10;
36
36
  --eun-color-on-secondary-50: #ffffff;
@@ -54,11 +54,11 @@
54
54
  --eun-color-on-secondary-900: #000000de;
55
55
  --eun-color-secondary-950: #eeb98a;
56
56
  --eun-color-on-secondary-950: #000000de;
57
- --eun-color-secondary-bg-hover: #{rgba($secondary-500, 0.08)};
58
- --eun-color-secondary-bg-active: #{rgba($secondary-500, 0.08)};
59
- --eun-color-secondary-transparent: #{rgba($secondary-500, 0.2)};
60
- --eun-color-secondary-transparent-hover: #{rgba($secondary-500, 0.3)};
61
- --eun-color-secondary-transparent-active: #{rgba($secondary-500, 0.4)};
57
+ --eun-color-secondary-alpha-5: #{rgba($secondary-500, 0.05)};
58
+ --eun-color-secondary-alpha-10: #{rgba($secondary-500, 0.1)};
59
+ --eun-color-secondary-alpha-20: #{rgba($secondary-500, 0.2)};
60
+ --eun-color-secondary-alpha-30: #{rgba($secondary-500, 0.3)};
61
+ --eun-color-secondary-alpha-40: #{rgba($secondary-500, 0.4)};
62
62
 
63
63
  @include eunomia-dark-neutrals();
64
64
 
package/dist/cdn/styles/themes/prebuilt-themes/fire/eunomia-fire.mixin.scss CHANGED
@@ -26,11 +26,11 @@
26
26
  --eun-color-on-primary-900: #ffffff;
27
27
  --eun-color-primary-950: #70150f;
28
28
  --eun-color-on-primary-950: #ffffff;
29
- --eun-color-primary-bg-hover: #{rgba($primary-500, 0.08)};
30
- --eun-color-primary-bg-active: #{rgba($primary-500, 0.08)};
31
- --eun-color-primary-transparent: #{rgba($primary-500, 0.2)};
32
- --eun-color-primary-transparent-hover: #{rgba($primary-500, 0.3)};
33
- --eun-color-primary-transparent-active: #{rgba($primary-500, 0.4)};
29
+ --eun-color-primary-alpha-5: #{rgba($primary-500, 0.05)};
30
+ --eun-color-primary-alpha-10: #{rgba($primary-500, 0.1)};
31
+ --eun-color-primary-alpha-20: #{rgba($primary-500, 0.2)};
32
+ --eun-color-primary-alpha-30: #{rgba($primary-500, 0.3)};
33
+ --eun-color-primary-alpha-40: #{rgba($primary-500, 0.4)};
34
34
 
35
35
  --eun-color-secondary-50: #f8b982;
36
36
  --eun-color-on-secondary-50: #000000de;
@@ -54,11 +54,11 @@
54
54
  --eun-color-on-secondary-900: #ffffff;
55
55
  --eun-color-secondary-950: #7e3f08;
56
56
  --eun-color-on-secondary-950: #ffffff;
57
- --eun-color-secondary-bg-hover: #{rgba($secondary-500, 0.08)};
58
- --eun-color-secondary-bg-active: #{rgba($secondary-500, 0.08)};
59
- --eun-color-secondary-transparent: #{rgba($secondary-500, 0.2)};
60
- --eun-color-secondary-transparent-hover: #{rgba($secondary-500, 0.3)};
61
- --eun-color-secondary-transparent-active: #{rgba($secondary-500, 0.4)};
57
+ --eun-color-secondary-alpha-5: #{rgba($secondary-500, 0.05)};
58
+ --eun-color-secondary-alpha-10: #{rgba($secondary-500, 0.1)};
59
+ --eun-color-secondary-alpha-20: #{rgba($secondary-500, 0.2)};
60
+ --eun-color-secondary-alpha-30: #{rgba($secondary-500, 0.3)};
61
+ --eun-color-secondary-alpha-40: #{rgba($secondary-500, 0.4)};
62
62
 
63
63
  @include eunomia-neutrals();
64
64
 
package/dist/cdn/styles/themes/prebuilt-themes/fire/eunomia-fire.theme.css CHANGED
@@ -1 +1 @@
1
- @font-face{font-family:"Mulish";font-style:normal;font-weight:200 1000;font-display:swap;src:url("../../../fonts/mulish/mulish-latin-variable-normal.woff2") format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}@font-face{font-family:"Mulish";font-style:italic;font-weight:200 1000;font-display:swap;src:url("../../../fonts/mulish/mulish-latin-variable-italic.woff2") format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}.eunomia-fire-theme{--eun-color-primary-50: #eb9089;--eun-color-on-primary-50: #000000de;--eun-color-primary-100: #e67870;--eun-color-on-primary-100: #000000de;--eun-color-primary-200: #e26157;--eun-color-on-primary-200: #000000de;--eun-color-primary-300: #dd4337;--eun-color-on-primary-300: #000000de;--eun-color-primary-400: #da362a;--eun-color-on-primary-400: #ffffff;--eun-color-primary-500: #d8291c;--eun-color-on-primary-500: #ffffff;--eun-color-primary-600: #cb271a;--eun-color-on-primary-600: #ffffff;--eun-color-primary-700: #be2419;--eun-color-on-primary-700: #ffffff;--eun-color-primary-800: #a01e15;--eun-color-on-primary-800: #ffffff;--eun-color-primary-900: #881a12;--eun-color-on-primary-900: #ffffff;--eun-color-primary-950: #70150f;--eun-color-on-primary-950: #ffffff;--eun-color-primary-bg-hover: rgba(216, 41, 28, 0.08);--eun-color-primary-bg-active: rgba(216, 41, 28, 0.08);--eun-color-primary-transparent: rgba(216, 41, 28, 0.2);--eun-color-primary-transparent-hover: rgba(216, 41, 28, 0.3);--eun-color-primary-transparent-active: rgba(216, 41, 28, 0.4);--eun-color-secondary-50: #f8b982;--eun-color-on-secondary-50: #000000de;--eun-color-secondary-100: #f7ab68;--eun-color-on-secondary-100: #000000de;--eun-color-secondary-200: #f59c4d;--eun-color-on-secondary-200: #000000de;--eun-color-secondary-300: #f4892c;--eun-color-on-secondary-300: #000000de;--eun-color-secondary-400: #f3811d;--eun-color-on-secondary-400: #000000de;--eun-color-secondary-500: #f2790f;--eun-color-on-secondary-500: #000000de;--eun-color-secondary-600: #e3720e;--eun-color-on-secondary-600: #000000de;--eun-color-secondary-700: #d56a0d;--eun-color-on-secondary-700: #000000de;--eun-color-secondary-800: #b35a0b;--eun-color-on-secondary-800: #ffffff;--eun-color-secondary-900: #984c09;--eun-color-on-secondary-900: #ffffff;--eun-color-secondary-950: #7e3f08;--eun-color-on-secondary-950: #ffffff;--eun-color-secondary-bg-hover: rgba(242, 121, 15, 0.08);--eun-color-secondary-bg-active: rgba(242, 121, 15, 0.08);--eun-color-secondary-transparent: rgba(242, 121, 15, 0.2);--eun-color-secondary-transparent-hover: rgba(242, 121, 15, 0.3);--eun-color-secondary-transparent-active: rgba(242, 121, 15, 0.4);--eun-content-hover: #9696961a;--eun-content-pressed: #e4e6e8;--eun-divider-color: #dee0e7;--eun-border-color: #dee0e7;--eun-surface-color: #ffffff;--eun-surface-sunken: color-mix( in srgb, var(--eun-text-color) 5%, transparent );--eun-surface-sunken-hover: color-mix( in srgb, var(--eun-text-color) 9%, transparent );--eun-surface-sunken-pressed: color-mix( in srgb, var(--eun-text-color) 12%, transparent );--eun-surface-sunken-strong: color-mix( in srgb, var(--eun-text-color) 8%, transparent );--eun-disabled-color: #ecedf0;--eun-readonly-color: #666e8a;--eun-text-color: #071621;--eun-text-secondary: #484e61;--eun-placeholder-color: var(--eun-color-grey-400, #c1c9d6);--eun-text-disabled-color: #8d93aa;--eun-text-readonly-color: #c1c9d6;--eun-disabled-content: #c1c9d6;--eun-surface-tint: #fdf4f4;--eun-divider-tint: #ded7dd;--eun-border-tint: #ded7dd;--eun-content-hover-tint: #ece5e5;--eun-content-pressed-tint: #e3ddde}.eunomia-fire-theme--dark{--eun-color-primary-50: #6f211b;--eun-color-on-primary-50: #ffffff;--eun-color-primary-100: #862922;--eun-color-on-primary-100: #ffffff;--eun-color-primary-200: #9e3027;--eun-color-on-primary-200: #ffffff;--eun-color-primary-300: #bc392e;--eun-color-on-primary-300: #ffffff;--eun-color-primary-400: #c83c32;--eun-color-on-primary-400: #ffffff;--eun-color-primary-500: #e94235;--eun-color-on-primary-500: #000000de;--eun-color-primary-600: #d84c41;--eun-color-on-primary-600: #000000de;--eun-color-primary-700: #da574d;--eun-color-on-primary-700: #000000de;--eun-color-primary-800: #e07169;--eun-color-on-primary-800: #000000de;--eun-color-primary-900: #e48780;--eun-color-on-primary-900: #000000de;--eun-color-primary-950: #e99b96;--eun-color-on-primary-950: #000000de;--eun-color-primary-bg-hover: rgba(233, 66, 53, 0.08);--eun-color-primary-bg-active: rgba(233, 66, 53, 0.08);--eun-color-primary-transparent: rgba(233, 66, 53, 0.2);--eun-color-primary-transparent-hover: rgba(233, 66, 53, 0.3);--eun-color-primary-transparent-active: rgba(233, 66, 53, 0.4);--eun-color-secondary-50: #743f10;--eun-color-on-secondary-50: #ffffff;--eun-color-secondary-100: #8c4c13;--eun-color-on-secondary-100: #ffffff;--eun-color-secondary-200: #a55a17;--eun-color-on-secondary-200: #ffffff;--eun-color-secondary-300: #c4691a;--eun-color-on-secondary-300: #000000de;--eun-color-secondary-400: #d2711c;--eun-color-on-secondary-400: #000000de;--eun-color-secondary-500: #df781e;--eun-color-on-secondary-500: #000000de;--eun-color-secondary-600: #e1812c;--eun-color-on-secondary-600: #000000de;--eun-color-secondary-700: #e38839;--eun-color-on-secondary-700: #000000de;--eun-color-secondary-800: #e79c59;--eun-color-on-secondary-800: #000000de;--eun-color-secondary-900: #ebab72;--eun-color-on-secondary-900: #000000de;--eun-color-secondary-950: #eeb98a;--eun-color-on-secondary-950: #000000de;--eun-color-secondary-bg-hover: rgba(223, 120, 30, 0.08);--eun-color-secondary-bg-active: rgba(223, 120, 30, 0.08);--eun-color-secondary-transparent: rgba(223, 120, 30, 0.2);--eun-color-secondary-transparent-hover: rgba(223, 120, 30, 0.3);--eun-color-secondary-transparent-active: rgba(223, 120, 30, 0.4);--eun-content-hover: rgba(255, 255, 255, 0.08);--eun-content-pressed: rgba(255, 255, 255, 0.14);--eun-divider-color: var(--eun-color-grey-300);--eun-border-color: var(--eun-color-grey-300);--eun-surface-color: var(--eun-color-grey-0);--eun-surface-sunken: color-mix( in srgb, var(--eun-text-color) 8%, transparent );--eun-surface-sunken-hover: color-mix( in srgb, var(--eun-text-color) 12%, transparent );--eun-surface-sunken-pressed: color-mix( in srgb, var(--eun-text-color) 16%, transparent );--eun-surface-sunken-strong: color-mix( in srgb, var(--eun-text-color) 16%, transparent );--eun-disabled-color: var(--eun-color-grey-200);--eun-readonly-color: var(--eun-color-grey-600);--eun-text-color: var(--eun-color-grey-800);--eun-text-secondary: var(--eun-color-grey-700);--eun-placeholder-color: var(--eun-color-grey-400);--eun-text-disabled-color: var(--eun-color-grey-500);--eun-text-readonly-color: var(--eun-color-grey-400);--eun-disabled-content: var(--eun-color-grey-400);--eun-surface-tint: #2f2e39;--eun-divider-tint: #6c6c86;--eun-border-tint: #6c6c86;--eun-content-hover-tint: rgba(253, 245, 245, 0.08);--eun-content-pressed-tint: rgba(253, 245, 245, 0.14)}
1
+ @font-face{font-family:"Mulish";font-style:normal;font-weight:200 1000;font-display:swap;src:url("../../../fonts/mulish/mulish-latin-variable-normal.woff2") format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}@font-face{font-family:"Mulish";font-style:italic;font-weight:200 1000;font-display:swap;src:url("../../../fonts/mulish/mulish-latin-variable-italic.woff2") format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}:where(.eun-grid){--_cols0: var(--eun-grid-columns, var(--_variantCols0, 1));--_cols1: var( --eun-grid-columns-mobile, var(--eun-grid-columns, var(--_variantCols1, var(--_variantCols0, 1))) );--_cols2: var( --eun-grid-columns-tablet, var( --eun-grid-columns-mobile, var( --eun-grid-columns, var(--_variantCols2, var(--_variantCols1, var(--_variantCols0, 1))) ) ) );--_cols3: var( --eun-grid-columns-laptop, var( --eun-grid-columns-tablet, var( --eun-grid-columns-mobile, var( --eun-grid-columns, var( --_variantCols3, var( --_variantCols2, var(--_variantCols1, var(--_variantCols0, 1)) ) ) ) ) ) );--_cols4: var( --eun-grid-columns-desktop, var( --eun-grid-columns-laptop, var( --eun-grid-columns-tablet, var( --eun-grid-columns-mobile, var( --eun-grid-columns, var( --_variantCols4, var( --_variantCols3, var( --_variantCols2, var(--_variantCols1, var(--_variantCols0, 1)) ) ) ) ) ) ) ) );--_cols: var(--_cols0);display:grid;grid-template-columns:repeat(var(--_cols), minmax(0, 1fr));row-gap:var(--eun-grid-row-gap, var(--eun-space-s));column-gap:var(--eun-grid-column-gap, var(--eun-space-m))}@media(width >= 600px){:where(.eun-grid){--_cols: var(--_cols1)}}@media(width >= 768px){:where(.eun-grid){--_cols: var(--_cols2)}}@media(width >= 1024px){:where(.eun-grid){--_cols: var(--_cols3)}}@media(width >= 1280px){:where(.eun-grid){--_cols: var(--_cols4)}}:where(.eun-grid--halves),:where(.eun-grid--2x2){--_variantCols2: 2}:where(.eun-grid--thirds-equal){--_variantCols2: 3}:where(.eun-grid--2x2){grid-auto-flow:row}@media(width >= 768px){:where(.eun-grid--thirds-1-2){grid-template-columns:1fr 2fr}:where(.eun-grid--thirds-2-1){grid-template-columns:2fr 1fr}:where(.eun-grid--sidebar-left),:where(.eun-grid--sidebar-right){grid-template-columns:repeat(2, 1fr);grid-template-rows:repeat(2, auto)}:where(.eun-grid--sidebar-left>:first-child){grid-column:1;grid-row:1/span 2}:where(.eun-grid--sidebar-right>:first-child){grid-column:2;grid-row:1/span 2}}:where(.eun-grid--lead-left),:where(.eun-grid--lead-right){grid-template-rows:repeat(2, auto)}:where(.eun-grid--lead-left){grid-template-columns:auto 1fr}:where(.eun-grid--lead-right){grid-template-columns:1fr auto}:where(.eun-grid--lead-left>:first-child){grid-column:1;grid-row:1/span 2}:where(.eun-grid--lead-right>:first-child){grid-column:2;grid-row:1/span 2}:where(.eun-grid--gallery){grid-template-columns:repeat(auto-fill, minmax(var(--eun-grid-min-width, 220px), 1fr))}:where(.eun-grid--panel){grid-template-rows:auto 1fr auto}.eunomia-fire-theme{--eun-color-primary-50: #eb9089;--eun-color-on-primary-50: #000000de;--eun-color-primary-100: #e67870;--eun-color-on-primary-100: #000000de;--eun-color-primary-200: #e26157;--eun-color-on-primary-200: #000000de;--eun-color-primary-300: #dd4337;--eun-color-on-primary-300: #000000de;--eun-color-primary-400: #da362a;--eun-color-on-primary-400: #ffffff;--eun-color-primary-500: #d8291c;--eun-color-on-primary-500: #ffffff;--eun-color-primary-600: #cb271a;--eun-color-on-primary-600: #ffffff;--eun-color-primary-700: #be2419;--eun-color-on-primary-700: #ffffff;--eun-color-primary-800: #a01e15;--eun-color-on-primary-800: #ffffff;--eun-color-primary-900: #881a12;--eun-color-on-primary-900: #ffffff;--eun-color-primary-950: #70150f;--eun-color-on-primary-950: #ffffff;--eun-color-primary-alpha-5: rgba(216, 41, 28, 0.05);--eun-color-primary-alpha-10: rgba(216, 41, 28, 0.1);--eun-color-primary-alpha-20: rgba(216, 41, 28, 0.2);--eun-color-primary-alpha-30: rgba(216, 41, 28, 0.3);--eun-color-primary-alpha-40: rgba(216, 41, 28, 0.4);--eun-color-secondary-50: #f8b982;--eun-color-on-secondary-50: #000000de;--eun-color-secondary-100: #f7ab68;--eun-color-on-secondary-100: #000000de;--eun-color-secondary-200: #f59c4d;--eun-color-on-secondary-200: #000000de;--eun-color-secondary-300: #f4892c;--eun-color-on-secondary-300: #000000de;--eun-color-secondary-400: #f3811d;--eun-color-on-secondary-400: #000000de;--eun-color-secondary-500: #f2790f;--eun-color-on-secondary-500: #000000de;--eun-color-secondary-600: #e3720e;--eun-color-on-secondary-600: #000000de;--eun-color-secondary-700: #d56a0d;--eun-color-on-secondary-700: #000000de;--eun-color-secondary-800: #b35a0b;--eun-color-on-secondary-800: #ffffff;--eun-color-secondary-900: #984c09;--eun-color-on-secondary-900: #ffffff;--eun-color-secondary-950: #7e3f08;--eun-color-on-secondary-950: #ffffff;--eun-color-secondary-alpha-5: rgba(242, 121, 15, 0.05);--eun-color-secondary-alpha-10: rgba(242, 121, 15, 0.1);--eun-color-secondary-alpha-20: rgba(242, 121, 15, 0.2);--eun-color-secondary-alpha-30: rgba(242, 121, 15, 0.3);--eun-color-secondary-alpha-40: rgba(242, 121, 15, 0.4);--eun-content-hover: #9696961a;--eun-content-pressed: #e4e6e8;--eun-divider-color: #dee0e7;--eun-border-color: #dee0e7;--eun-surface-color: #ffffff;--eun-surface-sunken: color-mix( in srgb, var(--eun-text-color) 5%, transparent );--eun-surface-sunken-hover: color-mix( in srgb, var(--eun-text-color) 9%, transparent );--eun-surface-sunken-pressed: color-mix( in srgb, var(--eun-text-color) 12%, transparent );--eun-surface-sunken-strong: color-mix( in srgb, var(--eun-text-color) 8%, transparent );--eun-disabled-color: #ecedf0;--eun-readonly-color: #666e8a;--eun-text-color: #071621;--eun-text-secondary: #484e61;--eun-placeholder-color: var(--eun-color-grey-400, #c1c9d6);--eun-text-disabled-color: #8d93aa;--eun-text-readonly-color: #c1c9d6;--eun-disabled-content: #c1c9d6;--eun-surface-inverse: #0b1620;--eun-text-on-inverse: #f5f7fa;--eun-surface-tint: #fdf4f4;--eun-divider-tint: #ded7dd;--eun-border-tint: #ded7dd;--eun-content-hover-tint: #ece5e5;--eun-content-pressed-tint: #e3ddde}.eunomia-fire-theme--dark{--eun-color-primary-50: #6f211b;--eun-color-on-primary-50: #ffffff;--eun-color-primary-100: #862922;--eun-color-on-primary-100: #ffffff;--eun-color-primary-200: #9e3027;--eun-color-on-primary-200: #ffffff;--eun-color-primary-300: #bc392e;--eun-color-on-primary-300: #ffffff;--eun-color-primary-400: #c83c32;--eun-color-on-primary-400: #ffffff;--eun-color-primary-500: #e94235;--eun-color-on-primary-500: #000000de;--eun-color-primary-600: #d84c41;--eun-color-on-primary-600: #000000de;--eun-color-primary-700: #da574d;--eun-color-on-primary-700: #000000de;--eun-color-primary-800: #e07169;--eun-color-on-primary-800: #000000de;--eun-color-primary-900: #e48780;--eun-color-on-primary-900: #000000de;--eun-color-primary-950: #e99b96;--eun-color-on-primary-950: #000000de;--eun-color-primary-alpha-5: rgba(233, 66, 53, 0.05);--eun-color-primary-alpha-10: rgba(233, 66, 53, 0.1);--eun-color-primary-alpha-20: rgba(233, 66, 53, 0.2);--eun-color-primary-alpha-30: rgba(233, 66, 53, 0.3);--eun-color-primary-alpha-40: rgba(233, 66, 53, 0.4);--eun-color-secondary-50: #743f10;--eun-color-on-secondary-50: #ffffff;--eun-color-secondary-100: #8c4c13;--eun-color-on-secondary-100: #ffffff;--eun-color-secondary-200: #a55a17;--eun-color-on-secondary-200: #ffffff;--eun-color-secondary-300: #c4691a;--eun-color-on-secondary-300: #000000de;--eun-color-secondary-400: #d2711c;--eun-color-on-secondary-400: #000000de;--eun-color-secondary-500: #df781e;--eun-color-on-secondary-500: #000000de;--eun-color-secondary-600: #e1812c;--eun-color-on-secondary-600: #000000de;--eun-color-secondary-700: #e38839;--eun-color-on-secondary-700: #000000de;--eun-color-secondary-800: #e79c59;--eun-color-on-secondary-800: #000000de;--eun-color-secondary-900: #ebab72;--eun-color-on-secondary-900: #000000de;--eun-color-secondary-950: #eeb98a;--eun-color-on-secondary-950: #000000de;--eun-color-secondary-alpha-5: rgba(223, 120, 30, 0.05);--eun-color-secondary-alpha-10: rgba(223, 120, 30, 0.1);--eun-color-secondary-alpha-20: rgba(223, 120, 30, 0.2);--eun-color-secondary-alpha-30: rgba(223, 120, 30, 0.3);--eun-color-secondary-alpha-40: rgba(223, 120, 30, 0.4);--eun-content-hover: rgba(255, 255, 255, 0.08);--eun-content-pressed: rgba(255, 255, 255, 0.14);--eun-divider-color: var(--eun-color-grey-300);--eun-border-color: var(--eun-color-grey-300);--eun-surface-color: var(--eun-color-grey-0);--eun-surface-sunken: color-mix( in srgb, var(--eun-text-color) 8%, transparent );--eun-surface-sunken-hover: color-mix( in srgb, var(--eun-text-color) 12%, transparent );--eun-surface-sunken-pressed: color-mix( in srgb, var(--eun-text-color) 16%, transparent );--eun-surface-sunken-strong: color-mix( in srgb, var(--eun-text-color) 16%, transparent );--eun-disabled-color: var(--eun-color-grey-200);--eun-readonly-color: var(--eun-color-grey-600);--eun-text-color: var(--eun-color-grey-800);--eun-text-secondary: var(--eun-color-grey-700);--eun-placeholder-color: var(--eun-color-grey-400);--eun-text-disabled-color: var(--eun-color-grey-500);--eun-text-readonly-color: var(--eun-color-grey-400);--eun-disabled-content: var(--eun-color-grey-400);--eun-surface-inverse: #0b1620;--eun-text-on-inverse: #f5f7fa;--eun-surface-tint: #2f2e39;--eun-divider-tint: #6c6c86;--eun-border-tint: #6c6c86;--eun-content-hover-tint: rgba(253, 245, 245, 0.08);--eun-content-pressed-tint: rgba(253, 245, 245, 0.14)}
package/dist/cdn/styles/themes/prebuilt-themes/fire/eunomia-fire.theme.scss CHANGED
@@ -9,8 +9,9 @@
9
9
  @use "./../../../tools/mixins/settings/eunomia-radius.mixin.scss" as *;
10
10
  @use "./../../../tools/mixins/settings/eunomia-border.mixin.scss" as *;
11
11
  @use "./../../../tools/mixins/settings/eunomia-shadows.mixin.scss" as *;
12
+ @use "./../../../tools/mixins/settings/eunomia-motion.mixin.scss" as *;
12
13
  @use "./../../../tools/mixins/settings/eunomia-alpha.mixin.scss" as *;
13
- @use "./../../../tools/mixins/layout/eunomia-grid.mixin.scss" as *;
14
+ @use "./../../../eunomia-grid.scss";
14
15
 
15
16
  @mixin default-settings {
16
17
  @include eunomia-font-family();
@@ -20,10 +21,10 @@
20
21
  @include eunomia-border-radius();
21
22
  @include eunomia-border-width();
22
23
  @include eunomia-shadows();
24
+ @include eunomia-motion();
23
25
  @include eunomia-alpha();
24
26
  @include eunomia-height();
25
27
  @include eunomia-breakpoints();
26
- @include eunomia-grid-layouts();
27
28
  }
28
29
 
29
30
  @mixin eunomia-fire-theme() {
package/dist/cdn/styles/themes/prebuilt-themes/forest/eunomia-forest-dark.mixin.scss CHANGED
@@ -26,11 +26,11 @@
26
26
  --eun-color-on-primary-900: #000000de;
27
27
  --eun-color-primary-950: #c4edda;
28
28
  --eun-color-on-primary-950: #000000de;
29
- --eun-color-primary-bg-hover: #{rgba($primary-500, 0.08)};
30
- --eun-color-primary-bg-active: #{rgba($primary-500, 0.08)};
31
- --eun-color-primary-transparent: #{rgba($primary-500, 0.2)};
32
- --eun-color-primary-transparent-hover: #{rgba($primary-500, 0.3)};
33
- --eun-color-primary-transparent-active: #{rgba($primary-500, 0.4)};
29
+ --eun-color-primary-alpha-5: #{rgba($primary-500, 0.05)};
30
+ --eun-color-primary-alpha-10: #{rgba($primary-500, 0.1)};
31
+ --eun-color-primary-alpha-20: #{rgba($primary-500, 0.2)};
32
+ --eun-color-primary-alpha-30: #{rgba($primary-500, 0.3)};
33
+ --eun-color-primary-alpha-40: #{rgba($primary-500, 0.4)};
34
34
 
35
35
  --eun-color-secondary-50: #67523f;
36
36
  --eun-color-on-secondary-50: #ffffff;
@@ -54,11 +54,11 @@
54
54
  --eun-color-on-secondary-900: #000000de;
55
55
  --eun-color-secondary-950: #e1cdba;
56
56
  --eun-color-on-secondary-950: #000000de;
57
- --eun-color-secondary-bg-hover: #{rgba($secondary-500, 0.08)};
58
- --eun-color-secondary-bg-active: #{rgba($secondary-500, 0.08)};
59
- --eun-color-secondary-transparent: #{rgba($secondary-500, 0.2)};
60
- --eun-color-secondary-transparent-hover: #{rgba($secondary-500, 0.3)};
61
- --eun-color-secondary-transparent-active: #{rgba($secondary-500, 0.4)};
57
+ --eun-color-secondary-alpha-5: #{rgba($secondary-500, 0.05)};
58
+ --eun-color-secondary-alpha-10: #{rgba($secondary-500, 0.1)};
59
+ --eun-color-secondary-alpha-20: #{rgba($secondary-500, 0.2)};
60
+ --eun-color-secondary-alpha-30: #{rgba($secondary-500, 0.3)};
61
+ --eun-color-secondary-alpha-40: #{rgba($secondary-500, 0.4)};
62
62
 
63
63
  @include eunomia-dark-neutrals();
64
64
 
package/dist/cdn/styles/themes/prebuilt-themes/forest/eunomia-forest.mixin.scss CHANGED
@@ -26,11 +26,11 @@
26
26
  --eun-color-on-primary-900: #ffffff;
27
27
  --eun-color-primary-950: #0e3f28;
28
28
  --eun-color-on-primary-950: #ffffff;
29
- --eun-color-primary-bg-hover: #{rgba($primary-500, 0.08)};
30
- --eun-color-primary-bg-active: #{rgba($primary-500, 0.08)};
31
- --eun-color-primary-transparent: #{rgba($primary-500, 0.2)};
32
- --eun-color-primary-transparent-hover: #{rgba($primary-500, 0.3)};
33
- --eun-color-primary-transparent-active: #{rgba($primary-500, 0.4)};
29
+ --eun-color-primary-alpha-5: #{rgba($primary-500, 0.05)};
30
+ --eun-color-primary-alpha-10: #{rgba($primary-500, 0.1)};
31
+ --eun-color-primary-alpha-20: #{rgba($primary-500, 0.2)};
32
+ --eun-color-primary-alpha-30: #{rgba($primary-500, 0.3)};
33
+ --eun-color-primary-alpha-40: #{rgba($primary-500, 0.4)};
34
34
 
35
35
  --eun-color-secondary-50: #c3ab95;
36
36
  --eun-color-on-secondary-50: #000000de;
@@ -54,11 +54,11 @@
54
54
  --eun-color-on-secondary-900: #ffffff;
55
55
  --eun-color-secondary-950: #48311b;
56
56
  --eun-color-on-secondary-950: #ffffff;
57
- --eun-color-secondary-bg-hover: #{rgba($secondary-500, 0.08)};
58
- --eun-color-secondary-bg-active: #{rgba($secondary-500, 0.08)};
59
- --eun-color-secondary-transparent: #{rgba($secondary-500, 0.2)};
60
- --eun-color-secondary-transparent-hover: #{rgba($secondary-500, 0.3)};
61
- --eun-color-secondary-transparent-active: #{rgba($secondary-500, 0.4)};
57
+ --eun-color-secondary-alpha-5: #{rgba($secondary-500, 0.05)};
58
+ --eun-color-secondary-alpha-10: #{rgba($secondary-500, 0.1)};
59
+ --eun-color-secondary-alpha-20: #{rgba($secondary-500, 0.2)};
60
+ --eun-color-secondary-alpha-30: #{rgba($secondary-500, 0.3)};
61
+ --eun-color-secondary-alpha-40: #{rgba($secondary-500, 0.4)};
62
62
 
63
63
  @include eunomia-neutrals();
64
64
 
package/dist/cdn/styles/themes/prebuilt-themes/forest/eunomia-forest.theme.css CHANGED
@@ -1 +1 @@
1
- @font-face{font-family:"Mulish";font-style:normal;font-weight:200 1000;font-display:swap;src:url("../../../fonts/mulish/mulish-latin-variable-normal.woff2") format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}@font-face{font-family:"Mulish";font-style:italic;font-weight:200 1000;font-display:swap;src:url("../../../fonts/mulish/mulish-latin-variable-italic.woff2") format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}.eunomia-forest-theme{--eun-color-primary-50: #88baa2;--eun-color-on-primary-50: #000000de;--eun-color-primary-100: #6fab8f;--eun-color-on-primary-100: #000000de;--eun-color-primary-200: #569d7b;--eun-color-on-primary-200: #000000de;--eun-color-primary-300: #368a62;--eun-color-on-primary-300: #000000de;--eun-color-primary-400: #298258;--eun-color-on-primary-400: #ffffff;--eun-color-primary-500: #1b7a4d;--eun-color-on-primary-500: #ffffff;--eun-color-primary-600: #197348;--eun-color-on-primary-600: #ffffff;--eun-color-primary-700: #186b44;--eun-color-on-primary-700: #ffffff;--eun-color-primary-800: #145a39;--eun-color-on-primary-800: #ffffff;--eun-color-primary-900: #114d31;--eun-color-on-primary-900: #ffffff;--eun-color-primary-950: #0e3f28;--eun-color-on-primary-950: #ffffff;--eun-color-primary-bg-hover: rgba(27, 122, 77, 0.08);--eun-color-primary-bg-active: rgba(27, 122, 77, 0.08);--eun-color-primary-transparent: rgba(27, 122, 77, 0.2);--eun-color-primary-transparent-hover: rgba(27, 122, 77, 0.3);--eun-color-primary-transparent-active: rgba(27, 122, 77, 0.4);--eun-color-secondary-50: #c3ab95;--eun-color-on-secondary-50: #000000de;--eun-color-secondary-100: #b69a7f;--eun-color-on-secondary-100: #000000de;--eun-color-secondary-200: #a98869;--eun-color-on-secondary-200: #000000de;--eun-color-secondary-300: #99714c;--eun-color-on-secondary-300: #000000;--eun-color-secondary-400: #926840;--eun-color-on-secondary-400: #ffffff;--eun-color-secondary-500: #8b5e34;--eun-color-on-secondary-500: #ffffff;--eun-color-secondary-600: #835831;--eun-color-on-secondary-600: #ffffff;--eun-color-secondary-700: #7a532e;--eun-color-on-secondary-700: #ffffff;--eun-color-secondary-800: #674626;--eun-color-on-secondary-800: #ffffff;--eun-color-secondary-900: #583b21;--eun-color-on-secondary-900: #ffffff;--eun-color-secondary-950: #48311b;--eun-color-on-secondary-950: #ffffff;--eun-color-secondary-bg-hover: rgba(139, 94, 52, 0.08);--eun-color-secondary-bg-active: rgba(139, 94, 52, 0.08);--eun-color-secondary-transparent: rgba(139, 94, 52, 0.2);--eun-color-secondary-transparent-hover: rgba(139, 94, 52, 0.3);--eun-color-secondary-transparent-active: rgba(139, 94, 52, 0.4);--eun-content-hover: #9696961a;--eun-content-pressed: #e4e6e8;--eun-divider-color: #dee0e7;--eun-border-color: #dee0e7;--eun-surface-color: #ffffff;--eun-surface-sunken: color-mix( in srgb, var(--eun-text-color) 5%, transparent );--eun-surface-sunken-hover: color-mix( in srgb, var(--eun-text-color) 9%, transparent );--eun-surface-sunken-pressed: color-mix( in srgb, var(--eun-text-color) 12%, transparent );--eun-surface-sunken-strong: color-mix( in srgb, var(--eun-text-color) 8%, transparent );--eun-disabled-color: #ecedf0;--eun-readonly-color: #666e8a;--eun-text-color: #071621;--eun-text-secondary: #484e61;--eun-placeholder-color: var(--eun-color-grey-400, #c1c9d6);--eun-text-disabled-color: #8d93aa;--eun-text-readonly-color: #c1c9d6;--eun-disabled-content: #c1c9d6;--eun-surface-tint: #f4f8f6;--eun-divider-tint: #d4dbdf;--eun-border-tint: #d4dbdf;--eun-content-hover-tint: #e2e9e8;--eun-content-pressed-tint: #dae1e0}.eunomia-forest-theme--dark{--eun-color-primary-50: #49735f;--eun-color-on-primary-50: #ffffff;--eun-color-primary-100: #588b74;--eun-color-on-primary-100: #000000de;--eun-color-primary-200: #67a487;--eun-color-on-primary-200: #000000de;--eun-color-primary-300: #7bc3a1;--eun-color-on-primary-300: #000000de;--eun-color-primary-400: #84cfac;--eun-color-on-primary-400: #000000de;--eun-color-primary-500: #8cddb7;--eun-color-on-primary-500: #000000de;--eun-color-primary-600: #93dfbb;--eun-color-on-primary-600: #000000de;--eun-color-primary-700: #9ae1c0;--eun-color-on-primary-700: #000000de;--eun-color-primary-800: #aae6ca;--eun-color-on-primary-800: #000000de;--eun-color-primary-900: #b6ead2;--eun-color-on-primary-900: #000000de;--eun-color-primary-950: #c4edda;--eun-color-on-primary-950: #000000de;--eun-color-primary-bg-hover: rgba(140, 221, 183, 0.08);--eun-color-primary-bg-active: rgba(140, 221, 183, 0.08);--eun-color-primary-transparent: rgba(140, 221, 183, 0.2);--eun-color-primary-transparent-hover: rgba(140, 221, 183, 0.3);--eun-color-primary-transparent-active: rgba(140, 221, 183, 0.4);--eun-color-secondary-50: #67523f;--eun-color-on-secondary-50: #ffffff;--eun-color-secondary-100: #7c644d;--eun-color-on-secondary-100: #ffffff;--eun-color-secondary-200: #91755b;--eun-color-on-secondary-200: #000000;--eun-color-secondary-300: #ad8b6c;--eun-color-on-secondary-300: #000000de;--eun-color-secondary-400: #b99573;--eun-color-on-secondary-400: #000000de;--eun-color-secondary-500: #c49e7b;--eun-color-on-secondary-500: #000000de;--eun-color-secondary-600: #c8a382;--eun-color-on-secondary-600: #000000de;--eun-color-secondary-700: #cbaa8b;--eun-color-on-secondary-700: #000000de;--eun-color-secondary-800: #d4b89d;--eun-color-on-secondary-800: #000000de;--eun-color-secondary-900: #dac1ab;--eun-color-on-secondary-900: #000000de;--eun-color-secondary-950: #e1cdba;--eun-color-on-secondary-950: #000000de;--eun-color-secondary-bg-hover: rgba(196, 158, 123, 0.08);--eun-color-secondary-bg-active: rgba(196, 158, 123, 0.08);--eun-color-secondary-transparent: rgba(196, 158, 123, 0.2);--eun-color-secondary-transparent-hover: rgba(196, 158, 123, 0.3);--eun-color-secondary-transparent-active: rgba(196, 158, 123, 0.4);--eun-content-hover: rgba(255, 255, 255, 0.08);--eun-content-pressed: rgba(255, 255, 255, 0.14);--eun-divider-color: var(--eun-color-grey-300);--eun-border-color: var(--eun-color-grey-300);--eun-surface-color: var(--eun-color-grey-0);--eun-surface-sunken: color-mix( in srgb, var(--eun-text-color) 8%, transparent );--eun-surface-sunken-hover: color-mix( in srgb, var(--eun-text-color) 12%, transparent );--eun-surface-sunken-pressed: color-mix( in srgb, var(--eun-text-color) 16%, transparent );--eun-surface-sunken-strong: color-mix( in srgb, var(--eun-text-color) 16%, transparent );--eun-disabled-color: var(--eun-color-grey-200);--eun-readonly-color: var(--eun-color-grey-600);--eun-text-color: var(--eun-color-grey-800);--eun-text-secondary: var(--eun-color-grey-700);--eun-placeholder-color: var(--eun-color-grey-400);--eun-text-disabled-color: var(--eun-color-grey-500);--eun-text-readonly-color: var(--eun-color-grey-400);--eun-disabled-content: var(--eun-color-grey-400);--eun-surface-tint: #2b363f;--eun-divider-tint: #68748c;--eun-border-tint: #68748c;--eun-content-hover-tint: rgba(249, 253, 251, 0.08);--eun-content-pressed-tint: rgba(249, 253, 251, 0.14)}
1
+ @font-face{font-family:"Mulish";font-style:normal;font-weight:200 1000;font-display:swap;src:url("../../../fonts/mulish/mulish-latin-variable-normal.woff2") format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}@font-face{font-family:"Mulish";font-style:italic;font-weight:200 1000;font-display:swap;src:url("../../../fonts/mulish/mulish-latin-variable-italic.woff2") format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}:where(.eun-grid){--_cols0: var(--eun-grid-columns, var(--_variantCols0, 1));--_cols1: var( --eun-grid-columns-mobile, var(--eun-grid-columns, var(--_variantCols1, var(--_variantCols0, 1))) );--_cols2: var( --eun-grid-columns-tablet, var( --eun-grid-columns-mobile, var( --eun-grid-columns, var(--_variantCols2, var(--_variantCols1, var(--_variantCols0, 1))) ) ) );--_cols3: var( --eun-grid-columns-laptop, var( --eun-grid-columns-tablet, var( --eun-grid-columns-mobile, var( --eun-grid-columns, var( --_variantCols3, var( --_variantCols2, var(--_variantCols1, var(--_variantCols0, 1)) ) ) ) ) ) );--_cols4: var( --eun-grid-columns-desktop, var( --eun-grid-columns-laptop, var( --eun-grid-columns-tablet, var( --eun-grid-columns-mobile, var( --eun-grid-columns, var( --_variantCols4, var( --_variantCols3, var( --_variantCols2, var(--_variantCols1, var(--_variantCols0, 1)) ) ) ) ) ) ) ) );--_cols: var(--_cols0);display:grid;grid-template-columns:repeat(var(--_cols), minmax(0, 1fr));row-gap:var(--eun-grid-row-gap, var(--eun-space-s));column-gap:var(--eun-grid-column-gap, var(--eun-space-m))}@media(width >= 600px){:where(.eun-grid){--_cols: var(--_cols1)}}@media(width >= 768px){:where(.eun-grid){--_cols: var(--_cols2)}}@media(width >= 1024px){:where(.eun-grid){--_cols: var(--_cols3)}}@media(width >= 1280px){:where(.eun-grid){--_cols: var(--_cols4)}}:where(.eun-grid--halves),:where(.eun-grid--2x2){--_variantCols2: 2}:where(.eun-grid--thirds-equal){--_variantCols2: 3}:where(.eun-grid--2x2){grid-auto-flow:row}@media(width >= 768px){:where(.eun-grid--thirds-1-2){grid-template-columns:1fr 2fr}:where(.eun-grid--thirds-2-1){grid-template-columns:2fr 1fr}:where(.eun-grid--sidebar-left),:where(.eun-grid--sidebar-right){grid-template-columns:repeat(2, 1fr);grid-template-rows:repeat(2, auto)}:where(.eun-grid--sidebar-left>:first-child){grid-column:1;grid-row:1/span 2}:where(.eun-grid--sidebar-right>:first-child){grid-column:2;grid-row:1/span 2}}:where(.eun-grid--lead-left),:where(.eun-grid--lead-right){grid-template-rows:repeat(2, auto)}:where(.eun-grid--lead-left){grid-template-columns:auto 1fr}:where(.eun-grid--lead-right){grid-template-columns:1fr auto}:where(.eun-grid--lead-left>:first-child){grid-column:1;grid-row:1/span 2}:where(.eun-grid--lead-right>:first-child){grid-column:2;grid-row:1/span 2}:where(.eun-grid--gallery){grid-template-columns:repeat(auto-fill, minmax(var(--eun-grid-min-width, 220px), 1fr))}:where(.eun-grid--panel){grid-template-rows:auto 1fr auto}.eunomia-forest-theme{--eun-color-primary-50: #88baa2;--eun-color-on-primary-50: #000000de;--eun-color-primary-100: #6fab8f;--eun-color-on-primary-100: #000000de;--eun-color-primary-200: #569d7b;--eun-color-on-primary-200: #000000de;--eun-color-primary-300: #368a62;--eun-color-on-primary-300: #000000de;--eun-color-primary-400: #298258;--eun-color-on-primary-400: #ffffff;--eun-color-primary-500: #1b7a4d;--eun-color-on-primary-500: #ffffff;--eun-color-primary-600: #197348;--eun-color-on-primary-600: #ffffff;--eun-color-primary-700: #186b44;--eun-color-on-primary-700: #ffffff;--eun-color-primary-800: #145a39;--eun-color-on-primary-800: #ffffff;--eun-color-primary-900: #114d31;--eun-color-on-primary-900: #ffffff;--eun-color-primary-950: #0e3f28;--eun-color-on-primary-950: #ffffff;--eun-color-primary-alpha-5: rgba(27, 122, 77, 0.05);--eun-color-primary-alpha-10: rgba(27, 122, 77, 0.1);--eun-color-primary-alpha-20: rgba(27, 122, 77, 0.2);--eun-color-primary-alpha-30: rgba(27, 122, 77, 0.3);--eun-color-primary-alpha-40: rgba(27, 122, 77, 0.4);--eun-color-secondary-50: #c3ab95;--eun-color-on-secondary-50: #000000de;--eun-color-secondary-100: #b69a7f;--eun-color-on-secondary-100: #000000de;--eun-color-secondary-200: #a98869;--eun-color-on-secondary-200: #000000de;--eun-color-secondary-300: #99714c;--eun-color-on-secondary-300: #000000;--eun-color-secondary-400: #926840;--eun-color-on-secondary-400: #ffffff;--eun-color-secondary-500: #8b5e34;--eun-color-on-secondary-500: #ffffff;--eun-color-secondary-600: #835831;--eun-color-on-secondary-600: #ffffff;--eun-color-secondary-700: #7a532e;--eun-color-on-secondary-700: #ffffff;--eun-color-secondary-800: #674626;--eun-color-on-secondary-800: #ffffff;--eun-color-secondary-900: #583b21;--eun-color-on-secondary-900: #ffffff;--eun-color-secondary-950: #48311b;--eun-color-on-secondary-950: #ffffff;--eun-color-secondary-alpha-5: rgba(139, 94, 52, 0.05);--eun-color-secondary-alpha-10: rgba(139, 94, 52, 0.1);--eun-color-secondary-alpha-20: rgba(139, 94, 52, 0.2);--eun-color-secondary-alpha-30: rgba(139, 94, 52, 0.3);--eun-color-secondary-alpha-40: rgba(139, 94, 52, 0.4);--eun-content-hover: #9696961a;--eun-content-pressed: #e4e6e8;--eun-divider-color: #dee0e7;--eun-border-color: #dee0e7;--eun-surface-color: #ffffff;--eun-surface-sunken: color-mix( in srgb, var(--eun-text-color) 5%, transparent );--eun-surface-sunken-hover: color-mix( in srgb, var(--eun-text-color) 9%, transparent );--eun-surface-sunken-pressed: color-mix( in srgb, var(--eun-text-color) 12%, transparent );--eun-surface-sunken-strong: color-mix( in srgb, var(--eun-text-color) 8%, transparent );--eun-disabled-color: #ecedf0;--eun-readonly-color: #666e8a;--eun-text-color: #071621;--eun-text-secondary: #484e61;--eun-placeholder-color: var(--eun-color-grey-400, #c1c9d6);--eun-text-disabled-color: #8d93aa;--eun-text-readonly-color: #c1c9d6;--eun-disabled-content: #c1c9d6;--eun-surface-inverse: #0b1620;--eun-text-on-inverse: #f5f7fa;--eun-surface-tint: #f4f8f6;--eun-divider-tint: #d4dbdf;--eun-border-tint: #d4dbdf;--eun-content-hover-tint: #e2e9e8;--eun-content-pressed-tint: #dae1e0}.eunomia-forest-theme--dark{--eun-color-primary-50: #49735f;--eun-color-on-primary-50: #ffffff;--eun-color-primary-100: #588b74;--eun-color-on-primary-100: #000000de;--eun-color-primary-200: #67a487;--eun-color-on-primary-200: #000000de;--eun-color-primary-300: #7bc3a1;--eun-color-on-primary-300: #000000de;--eun-color-primary-400: #84cfac;--eun-color-on-primary-400: #000000de;--eun-color-primary-500: #8cddb7;--eun-color-on-primary-500: #000000de;--eun-color-primary-600: #93dfbb;--eun-color-on-primary-600: #000000de;--eun-color-primary-700: #9ae1c0;--eun-color-on-primary-700: #000000de;--eun-color-primary-800: #aae6ca;--eun-color-on-primary-800: #000000de;--eun-color-primary-900: #b6ead2;--eun-color-on-primary-900: #000000de;--eun-color-primary-950: #c4edda;--eun-color-on-primary-950: #000000de;--eun-color-primary-alpha-5: rgba(140, 221, 183, 0.05);--eun-color-primary-alpha-10: rgba(140, 221, 183, 0.1);--eun-color-primary-alpha-20: rgba(140, 221, 183, 0.2);--eun-color-primary-alpha-30: rgba(140, 221, 183, 0.3);--eun-color-primary-alpha-40: rgba(140, 221, 183, 0.4);--eun-color-secondary-50: #67523f;--eun-color-on-secondary-50: #ffffff;--eun-color-secondary-100: #7c644d;--eun-color-on-secondary-100: #ffffff;--eun-color-secondary-200: #91755b;--eun-color-on-secondary-200: #000000;--eun-color-secondary-300: #ad8b6c;--eun-color-on-secondary-300: #000000de;--eun-color-secondary-400: #b99573;--eun-color-on-secondary-400: #000000de;--eun-color-secondary-500: #c49e7b;--eun-color-on-secondary-500: #000000de;--eun-color-secondary-600: #c8a382;--eun-color-on-secondary-600: #000000de;--eun-color-secondary-700: #cbaa8b;--eun-color-on-secondary-700: #000000de;--eun-color-secondary-800: #d4b89d;--eun-color-on-secondary-800: #000000de;--eun-color-secondary-900: #dac1ab;--eun-color-on-secondary-900: #000000de;--eun-color-secondary-950: #e1cdba;--eun-color-on-secondary-950: #000000de;--eun-color-secondary-alpha-5: rgba(196, 158, 123, 0.05);--eun-color-secondary-alpha-10: rgba(196, 158, 123, 0.1);--eun-color-secondary-alpha-20: rgba(196, 158, 123, 0.2);--eun-color-secondary-alpha-30: rgba(196, 158, 123, 0.3);--eun-color-secondary-alpha-40: rgba(196, 158, 123, 0.4);--eun-content-hover: rgba(255, 255, 255, 0.08);--eun-content-pressed: rgba(255, 255, 255, 0.14);--eun-divider-color: var(--eun-color-grey-300);--eun-border-color: var(--eun-color-grey-300);--eun-surface-color: var(--eun-color-grey-0);--eun-surface-sunken: color-mix( in srgb, var(--eun-text-color) 8%, transparent );--eun-surface-sunken-hover: color-mix( in srgb, var(--eun-text-color) 12%, transparent );--eun-surface-sunken-pressed: color-mix( in srgb, var(--eun-text-color) 16%, transparent );--eun-surface-sunken-strong: color-mix( in srgb, var(--eun-text-color) 16%, transparent );--eun-disabled-color: var(--eun-color-grey-200);--eun-readonly-color: var(--eun-color-grey-600);--eun-text-color: var(--eun-color-grey-800);--eun-text-secondary: var(--eun-color-grey-700);--eun-placeholder-color: var(--eun-color-grey-400);--eun-text-disabled-color: var(--eun-color-grey-500);--eun-text-readonly-color: var(--eun-color-grey-400);--eun-disabled-content: var(--eun-color-grey-400);--eun-surface-inverse: #0b1620;--eun-text-on-inverse: #f5f7fa;--eun-surface-tint: #2b363f;--eun-divider-tint: #68748c;--eun-border-tint: #68748c;--eun-content-hover-tint: rgba(249, 253, 251, 0.08);--eun-content-pressed-tint: rgba(249, 253, 251, 0.14)}