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

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 (177) hide show
  1. package/dist/cdn/components/chunks/{chunk-3PNGQEG4.js → chunk-32L2QYWQ.js} +2 -2
  2. package/dist/cdn/components/chunks/{chunk-Z3OFIE7S.js → chunk-3UUZM7X2.js} +1 -1
  3. package/dist/cdn/components/chunks/{chunk-BVASCT2V.js → chunk-55PUDL7D.js} +13 -13
  4. package/dist/cdn/components/chunks/chunk-5LA5DQMP.js +1 -0
  5. package/dist/cdn/components/chunks/chunk-5LXGJVJR.js +1 -0
  6. package/dist/cdn/components/chunks/chunk-6TIEBY34.js +1 -0
  7. package/dist/cdn/components/chunks/{chunk-LVKMAHMU.js → chunk-AH2SKZ7T.js} +4 -1
  8. package/dist/cdn/components/chunks/chunk-JAGZL7JH.js +1 -0
  9. package/dist/cdn/components/chunks/{chunk-DGI7TKCU.js → chunk-LD35BFNK.js} +5 -9
  10. package/dist/cdn/components/chunks/chunk-P6LGU3FT.js +1 -0
  11. package/dist/cdn/components/chunks/{chunk-UYZR4JXZ.js → chunk-QSZO4GIH.js} +45 -9
  12. package/dist/cdn/components/chunks/{chunk-PXF554MD.js → chunk-QYB6Z6FG.js} +5 -5
  13. package/dist/cdn/components/chunks/{chunk-RIFF2D2F.js → chunk-RGC3I6MK.js} +1 -1
  14. package/dist/cdn/components/chunks/{chunk-N6ZW5CDN.js → chunk-TCSB2MLU.js} +1 -1
  15. package/dist/cdn/components/chunks/chunk-WIUERJII.js +1 -0
  16. package/dist/cdn/components/eun-animate.js +4 -4
  17. package/dist/cdn/components/eun-button.js +1 -1
  18. package/dist/cdn/components/eun-carousel.js +10 -9
  19. package/dist/cdn/components/eun-chip.js +17 -11
  20. package/dist/cdn/components/eun-collapse.js +1 -1
  21. package/dist/cdn/components/eun-color-picker.js +18 -5
  22. package/dist/cdn/components/eun-counter.js +10 -8
  23. package/dist/cdn/components/eun-date-picker.js +46 -43
  24. package/dist/cdn/components/eun-drawer.js +19 -20
  25. package/dist/cdn/components/eun-dropdown-button.js +1 -1
  26. package/dist/cdn/components/eun-dropdown-item.js +3 -3
  27. package/dist/cdn/components/eun-fab.js +1 -1
  28. package/dist/cdn/components/eun-image-carousel.js +4 -4
  29. package/dist/cdn/components/eun-input-phone.js +11 -8
  30. package/dist/cdn/components/eun-input.js +1 -1
  31. package/dist/cdn/components/eun-link.js +59 -13
  32. package/dist/cdn/components/eun-modal.js +23 -13
  33. package/dist/cdn/components/eun-scheduler-event-editor.js +1 -1
  34. package/dist/cdn/components/eun-search.js +34 -28
  35. package/dist/cdn/components/eun-select.js +3 -3
  36. package/dist/cdn/components/eun-sidebar.js +66 -21
  37. package/dist/cdn/components/eun-sliding-card.js +1 -1
  38. package/dist/cdn/components/eun-stepper.js +16 -16
  39. package/dist/cdn/components/eun-tab-panel.js +1 -1
  40. package/dist/cdn/components/eun-table-action-bar.js +1 -1
  41. package/dist/cdn/components/eun-table.js +2 -2
  42. package/dist/cdn/components/eun-textarea.js +16 -13
  43. package/dist/cdn/components/eun-time-picker.js +25 -23
  44. package/dist/cdn/components/eun-toast.js +8 -8
  45. package/dist/cdn/components/eun-toggle-group.js +71 -35
  46. package/dist/cdn/components/eun-toggle-item.js +8 -8
  47. package/dist/cdn/components/eun-toolbar.js +20 -20
  48. package/dist/cdn/components/eun-tooltip.js +6 -6
  49. package/dist/cdn/styles/eunomia-themes.css +1 -1
  50. package/dist/cdn/styles/themes/mixins/eunomia-neutrals.mixin.scss +6 -2
  51. package/dist/cdn/styles/themes/prebuilt-themes/eunomia/eunomia-dark.mixin.scss +6 -2
  52. package/dist/cdn/styles/themes/prebuilt-themes/eunomia/eunomia.theme.css +1 -1
  53. package/dist/cdn/styles/themes/prebuilt-themes/fire/eunomia-fire-dark.mixin.scss +6 -2
  54. package/dist/cdn/styles/themes/prebuilt-themes/fire/eunomia-fire.theme.css +1 -1
  55. package/dist/cdn/styles/themes/prebuilt-themes/forest/eunomia-forest-dark.mixin.scss +6 -2
  56. package/dist/cdn/styles/themes/prebuilt-themes/forest/eunomia-forest.theme.css +1 -1
  57. package/dist/cdn/styles/themes/prebuilt-themes/gold/eunomia-gold-dark.mixin.scss +6 -2
  58. package/dist/cdn/styles/themes/prebuilt-themes/gold/eunomia-gold.theme.css +1 -1
  59. package/dist/cdn/styles/themes/prebuilt-themes/ocean/eunomia-ocean-dark.mixin.scss +6 -2
  60. package/dist/cdn/styles/themes/prebuilt-themes/ocean/eunomia-ocean.theme.css +1 -1
  61. package/dist/cdn/styles/themes/prebuilt-themes/salmon/eunomia-salmon-dark.mixin.scss +6 -2
  62. package/dist/cdn/styles/themes/prebuilt-themes/salmon/eunomia-salmon.theme.css +1 -1
  63. package/dist/cdn/styles/themes/prebuilt-themes/violet/eunomia-violet-dark.mixin.scss +6 -2
  64. package/dist/cdn/styles/themes/prebuilt-themes/violet/eunomia-violet.theme.css +1 -1
  65. package/dist/components/action/button/button.d.ts +2 -2
  66. package/dist/components/action/button/button.js +3 -7
  67. package/dist/components/action/button/button.styles.js +3 -3
  68. package/dist/components/action/dropdown-button/dropdown-button.d.ts +4 -6
  69. package/dist/components/action/dropdown-button/dropdown-button.js +6 -8
  70. package/dist/components/action/dropdown-button/dropdown-item.d.ts +10 -2
  71. package/dist/components/action/dropdown-button/dropdown-item.js +24 -9
  72. package/dist/components/action/link/link.d.ts +10 -1
  73. package/dist/components/action/link/link.js +13 -1
  74. package/dist/components/action/link/link.styles.js +50 -3
  75. package/dist/components/action/toggle/toggle-group.d.ts +12 -2
  76. package/dist/components/action/toggle/toggle-group.js +17 -2
  77. package/dist/components/action/toggle/toggle-group.styles.js +54 -18
  78. package/dist/components/action/toggle/toggle-item.js +1 -3
  79. package/dist/components/action/toggle/toggle-item.styles.js +7 -7
  80. package/dist/components/alert/drawer/drawer.d.ts +25 -0
  81. package/dist/components/alert/drawer/drawer.js +42 -3
  82. package/dist/components/alert/drawer/drawer.styles.js +6 -6
  83. package/dist/components/alert/modal/modal.d.ts +25 -0
  84. package/dist/components/alert/modal/modal.js +42 -3
  85. package/dist/components/alert/modal/modal.styles.js +17 -6
  86. package/dist/components/alert/toast/toast.js +3 -2
  87. package/dist/components/alert/toast/toast.styles.js +3 -3
  88. package/dist/components/content/chip/chip.js +3 -2
  89. package/dist/components/content/chip/chip.styles.js +9 -3
  90. package/dist/components/content/image-carousel/image-carousel.js +5 -4
  91. package/dist/components/content/tooltip/tooltip.d.ts +16 -9
  92. package/dist/components/content/tooltip/tooltip.js +28 -12
  93. package/dist/components/content/tooltip/tooltip.styles.js +1 -1
  94. package/dist/components/form/color-picker/color-picker.d.ts +7 -1
  95. package/dist/components/form/color-picker/color-picker.js +8 -2
  96. package/dist/components/form/color-picker/color-picker.styles.js +13 -0
  97. package/dist/components/form/counter/counter.d.ts +3 -1
  98. package/dist/components/form/counter/counter.js +3 -1
  99. package/dist/components/form/counter/counter.styles.js +6 -4
  100. package/dist/components/form/date-picker/date-picker.d.ts +6 -1
  101. package/dist/components/form/date-picker/date-picker.js +7 -2
  102. package/dist/components/form/date-picker/date-picker.styles.js +9 -6
  103. package/dist/components/form/input/input.d.ts +6 -1
  104. package/dist/components/form/input/input.js +7 -2
  105. package/dist/components/form/input-phone/input-phone.d.ts +7 -1
  106. package/dist/components/form/input-phone/input-phone.js +7 -1
  107. package/dist/components/form/input-phone/input-phone.styles.js +6 -3
  108. package/dist/components/form/search/search.d.ts +64 -10
  109. package/dist/components/form/search/search.js +112 -31
  110. package/dist/components/form/search/search.styles.js +2 -0
  111. package/dist/components/form/select/select.d.ts +7 -1
  112. package/dist/components/form/select/select.js +7 -1
  113. package/dist/components/form/shared-styles/field.styles.js +45 -8
  114. package/dist/components/form/shared-styles/listbox.styles.js +5 -1
  115. package/dist/components/form/textarea/textarea.d.ts +1 -0
  116. package/dist/components/form/textarea/textarea.js +2 -1
  117. package/dist/components/form/textarea/textarea.styles.js +3 -0
  118. package/dist/components/form/time-picker/time-picker.d.ts +6 -1
  119. package/dist/components/form/time-picker/time-picker.js +7 -2
  120. package/dist/components/form/time-picker/time-picker.styles.js +7 -5
  121. package/dist/components/layout/animate/animate.js +2 -1
  122. package/dist/components/navigation/carousel/carousel.d.ts +1 -2
  123. package/dist/components/navigation/carousel/carousel.js +14 -6
  124. package/dist/components/navigation/carousel/carousel.styles.js +5 -4
  125. package/dist/components/navigation/sidebar/sidebar.d.ts +98 -52
  126. package/dist/components/navigation/sidebar/sidebar.js +140 -85
  127. package/dist/components/navigation/sidebar/sidebar.styles.d.ts +1 -1
  128. package/dist/components/navigation/sidebar/sidebar.styles.js +69 -21
  129. package/dist/components/navigation/stepper/stepper.d.ts +1 -3
  130. package/dist/components/navigation/stepper/stepper.js +3 -21
  131. package/dist/components/navigation/toolbar/toolbar.d.ts +10 -0
  132. package/dist/components/navigation/toolbar/toolbar.js +8 -1
  133. package/dist/components/navigation/toolbar/toolbar.styles.js +18 -17
  134. package/dist/events/select.event.d.ts +3 -2
  135. package/dist/events/select.event.js +2 -1
  136. package/dist/features/scheduler/scheduler-event-editor/scheduler-event-editor.js +1 -1
  137. package/dist/features/table/table/table.js +1 -1
  138. package/dist/features/table/table-action-bar/table-action-bar.js +2 -2
  139. package/dist/index.d.ts +1 -0
  140. package/dist/mixins/button.mixin.d.ts +1 -1
  141. package/dist/mixins/button.mixin.js +6 -4
  142. package/dist/mixins/dialog-surface.mixin.d.ts +8 -0
  143. package/dist/mixins/field-size.mixin.d.ts +19 -0
  144. package/dist/mixins/field-size.mixin.js +33 -0
  145. package/dist/mixins/rounded.mixin.d.ts +18 -0
  146. package/dist/mixins/rounded.mixin.js +32 -0
  147. package/dist/ssr/button-ssr.css +5 -5
  148. package/dist/ssr/carousel-ssr.css +9 -0
  149. package/dist/ssr/chip-ssr.css +8 -0
  150. package/dist/ssr/collapse-ssr.css +29 -0
  151. package/dist/ssr/field-ssr.css +43 -4
  152. package/dist/ssr/image-carousel-ssr.css +10 -0
  153. package/dist/ssr/links-ssr.css +38 -1
  154. package/dist/ssr/sidebar-ssr.css +95 -4
  155. package/dist/ssr/toggle-group-ssr.css +64 -13
  156. package/dist/ssr/toolbar-ssr.css +50 -0
  157. package/dist/types/variant.type.d.ts +4 -1
  158. package/dist/utils/boolean.utils.d.ts +14 -0
  159. package/dist/utils/boolean.utils.js +20 -0
  160. package/dist/utils/dropdown-menu.utils.d.ts +1 -1
  161. package/dist/utils/focusable-elements.utils.d.ts +12 -0
  162. package/dist/utils/focusable-elements.utils.js +26 -0
  163. package/dist/utils/input-modality.utils.d.ts +13 -0
  164. package/dist/utils/input-modality.utils.js +34 -0
  165. package/dist/utils/theme-generator.utils.d.ts +8 -2
  166. package/dist/utils/theme-generator.utils.js +30 -9
  167. package/package.json +1 -1
  168. package/styles/themes/mixins/eunomia-neutrals.mixin.scss +6 -2
  169. package/styles/themes/prebuilt-themes/eunomia/eunomia-dark.mixin.scss +6 -2
  170. package/styles/themes/prebuilt-themes/fire/eunomia-fire-dark.mixin.scss +6 -2
  171. package/styles/themes/prebuilt-themes/forest/eunomia-forest-dark.mixin.scss +6 -2
  172. package/styles/themes/prebuilt-themes/gold/eunomia-gold-dark.mixin.scss +6 -2
  173. package/styles/themes/prebuilt-themes/ocean/eunomia-ocean-dark.mixin.scss +6 -2
  174. package/styles/themes/prebuilt-themes/salmon/eunomia-salmon-dark.mixin.scss +6 -2
  175. package/styles/themes/prebuilt-themes/violet/eunomia-violet-dark.mixin.scss +6 -2
  176. package/dist/cdn/components/chunks/chunk-6VK6SHCG.js +0 -1
  177. package/dist/cdn/components/chunks/chunk-UDOZRIJZ.js +0 -1
package/dist/cdn/styles/themes/mixins/eunomia-neutrals.mixin.scss CHANGED
@@ -39,9 +39,13 @@
39
39
  @mixin eunomia-dark-neutrals {
40
40
  --eun-content-hover: rgba(255, 255, 255, 0.08);
41
41
  --eun-content-pressed: rgba(255, 255, 255, 0.14);
42
- --eun-divider-color: var(--eun-color-grey-300);
43
- --eun-border-color: var(--eun-color-grey-300);
44
42
  --eun-surface-color: var(--eun-color-grey-0);
43
+ --eun-border-color: color-mix(
44
+ in srgb,
45
+ var(--eun-text-color) 12%,
46
+ var(--eun-surface-color)
47
+ );
48
+ --eun-divider-color: var(--eun-border-color);
45
49
  --eun-surface-sunken: color-mix(
46
50
  in srgb,
47
51
  var(--eun-text-color) 8%,
package/dist/cdn/styles/themes/prebuilt-themes/eunomia/eunomia-dark.mixin.scss CHANGED
@@ -63,8 +63,12 @@
63
63
  @include eunomia-dark-neutrals();
64
64
 
65
65
  --eun-surface-tint: #2a3243;
66
- --eun-divider-tint: #667090;
67
- --eun-border-tint: #667090;
66
+ --eun-border-tint: color-mix(
67
+ in srgb,
68
+ var(--eun-color-primary-500) 5%,
69
+ var(--eun-border-color)
70
+ );
71
+ --eun-divider-tint: var(--eun-border-tint);
68
72
  --eun-content-hover-tint: rgba(248, 250, 255, 0.08);
69
73
  --eun-content-pressed-tint: rgba(248, 250, 255, 0.14);
70
74
  }
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}: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)}
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-surface-color: var(--eun-color-grey-0);--eun-border-color: color-mix( in srgb, var(--eun-text-color) 12%, var(--eun-surface-color) );--eun-divider-color: var(--eun-border-color);--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-border-tint: color-mix( in srgb, var(--eun-color-primary-500) 5%, var(--eun-border-color) );--eun-divider-tint: var(--eun-border-tint);--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/fire/eunomia-fire-dark.mixin.scss CHANGED
@@ -63,8 +63,12 @@
63
63
  @include eunomia-dark-neutrals();
64
64
 
65
65
  --eun-surface-tint: #2f2e39;
66
- --eun-divider-tint: #6c6c86;
67
- --eun-border-tint: #6c6c86;
66
+ --eun-border-tint: color-mix(
67
+ in srgb,
68
+ var(--eun-color-primary-500) 5%,
69
+ var(--eun-border-color)
70
+ );
71
+ --eun-divider-tint: var(--eun-border-tint);
68
72
  --eun-content-hover-tint: rgba(253, 245, 245, 0.08);
69
73
  --eun-content-pressed-tint: rgba(253, 245, 245, 0.14);
70
74
  }
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}: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)}
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-surface-color: var(--eun-color-grey-0);--eun-border-color: color-mix( in srgb, var(--eun-text-color) 12%, var(--eun-surface-color) );--eun-divider-color: var(--eun-border-color);--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-border-tint: color-mix( in srgb, var(--eun-color-primary-500) 5%, var(--eun-border-color) );--eun-divider-tint: var(--eun-border-tint);--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/forest/eunomia-forest-dark.mixin.scss CHANGED
@@ -63,8 +63,12 @@
63
63
  @include eunomia-dark-neutrals();
64
64
 
65
65
  --eun-surface-tint: #2b363f;
66
- --eun-divider-tint: #68748c;
67
- --eun-border-tint: #68748c;
66
+ --eun-border-tint: color-mix(
67
+ in srgb,
68
+ var(--eun-color-primary-500) 5%,
69
+ var(--eun-border-color)
70
+ );
71
+ --eun-divider-tint: var(--eun-border-tint);
68
72
  --eun-content-hover-tint: rgba(249, 253, 251, 0.08);
69
73
  --eun-content-pressed-tint: rgba(249, 253, 251, 0.14);
70
74
  }
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}: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)}
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-surface-color: var(--eun-color-grey-0);--eun-border-color: color-mix( in srgb, var(--eun-text-color) 12%, var(--eun-surface-color) );--eun-divider-color: var(--eun-border-color);--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-border-tint: color-mix( in srgb, var(--eun-color-primary-500) 5%, var(--eun-border-color) );--eun-divider-tint: var(--eun-border-tint);--eun-content-hover-tint: rgba(249, 253, 251, 0.08);--eun-content-pressed-tint: rgba(249, 253, 251, 0.14)}
package/dist/cdn/styles/themes/prebuilt-themes/gold/eunomia-gold-dark.mixin.scss CHANGED
@@ -63,8 +63,12 @@
63
63
  @include eunomia-dark-neutrals();
64
64
 
65
65
  --eun-surface-tint: #2e3339;
66
- --eun-divider-tint: #6b7186;
67
- --eun-border-tint: #6b7186;
66
+ --eun-border-tint: color-mix(
67
+ in srgb,
68
+ var(--eun-color-primary-500) 5%,
69
+ var(--eun-border-color)
70
+ );
71
+ --eun-divider-tint: var(--eun-border-tint);
68
72
  --eun-content-hover-tint: rgba(252, 251, 246, 0.08);
69
73
  --eun-content-pressed-tint: rgba(252, 251, 246, 0.14);
70
74
  }
package/dist/cdn/styles/themes/prebuilt-themes/gold/eunomia-gold.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}: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-gold-theme{--eun-color-primary-50: #e3cf8f;--eun-color-on-primary-50: #000000de;--eun-color-primary-100: #ddc477;--eun-color-on-primary-100: #000000de;--eun-color-primary-200: #d7ba5f;--eun-color-on-primary-200: #000000de;--eun-color-primary-300: #cfad41;--eun-color-on-primary-300: #000000de;--eun-color-primary-400: #cca834;--eun-color-on-primary-400: #000000de;--eun-color-primary-500: #c9a227;--eun-color-on-primary-500: #000000de;--eun-color-primary-600: #bd9825;--eun-color-on-primary-600: #000000de;--eun-color-primary-700: #b18f22;--eun-color-on-primary-700: #000000de;--eun-color-primary-800: #95781d;--eun-color-on-primary-800: #000000de;--eun-color-primary-900: #7f6619;--eun-color-on-primary-900: #ffffff;--eun-color-primary-950: #695414;--eun-color-on-primary-950: #ffffff;--eun-color-primary-alpha-5: rgba(201, 162, 39, 0.05);--eun-color-primary-alpha-10: rgba(201, 162, 39, 0.1);--eun-color-primary-alpha-20: rgba(201, 162, 39, 0.2);--eun-color-primary-alpha-30: rgba(201, 162, 39, 0.3);--eun-color-primary-alpha-40: rgba(201, 162, 39, 0.4);--eun-color-secondary-50: #8499ab;--eun-color-on-secondary-50: #000000de;--eun-color-secondary-100: #6a839a;--eun-color-on-secondary-100: #000000de;--eun-color-secondary-200: #506d88;--eun-color-on-secondary-200: #ffffff;--eun-color-secondary-300: #2e5271;--eun-color-on-secondary-300: #ffffff;--eun-color-secondary-400: #204668;--eun-color-on-secondary-400: #ffffff;--eun-color-secondary-500: #123a5e;--eun-color-on-secondary-500: #ffffff;--eun-color-secondary-600: #113758;--eun-color-on-secondary-600: #ffffff;--eun-color-secondary-700: #103353;--eun-color-on-secondary-700: #ffffff;--eun-color-secondary-800: #0d2b46;--eun-color-on-secondary-800: #ffffff;--eun-color-secondary-900: #0b253b;--eun-color-on-secondary-900: #ffffff;--eun-color-secondary-950: #091e31;--eun-color-on-secondary-950: #ffffff;--eun-color-secondary-alpha-5: rgba(18, 58, 94, 0.05);--eun-color-secondary-alpha-10: rgba(18, 58, 94, 0.1);--eun-color-secondary-alpha-20: rgba(18, 58, 94, 0.2);--eun-color-secondary-alpha-30: rgba(18, 58, 94, 0.3);--eun-color-secondary-alpha-40: rgba(18, 58, 94, 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: #fcfaf4;--eun-divider-tint: #dddddd;--eun-border-tint: #dddddd;--eun-content-hover-tint: #ebebe6;--eun-content-pressed-tint: #e3e3de}.eunomia-gold-theme--dark{--eun-color-primary-50: #6a5922;--eun-color-on-primary-50: #ffffff;--eun-color-primary-100: #806b2a;--eun-color-on-primary-100: #ffffff;--eun-color-primary-200: #977e31;--eun-color-on-primary-200: #000000de;--eun-color-primary-300: #b3963b;--eun-color-on-primary-300: #000000de;--eun-color-primary-400: #c0a13e;--eun-color-on-primary-400: #000000de;--eun-color-primary-500: #ccab42;--eun-color-on-primary-500: #000000de;--eun-color-primary-600: #cfaf4d;--eun-color-on-primary-600: #000000de;--eun-color-primary-700: #d2b559;--eun-color-on-primary-700: #000000de;--eun-color-primary-800: #d9c073;--eun-color-on-primary-800: #000000de;--eun-color-primary-900: #dec988;--eun-color-on-primary-900: #000000de;--eun-color-primary-950: #e5d39c;--eun-color-on-primary-950: #000000de;--eun-color-primary-alpha-5: rgba(204, 171, 66, 0.05);--eun-color-primary-alpha-10: rgba(204, 171, 66, 0.1);--eun-color-primary-alpha-20: rgba(204, 171, 66, 0.2);--eun-color-primary-alpha-30: rgba(204, 171, 66, 0.3);--eun-color-primary-alpha-40: rgba(204, 171, 66, 0.4);--eun-color-secondary-50: #576978;--eun-color-on-secondary-50: #ffffff;--eun-color-secondary-100: #697e91;--eun-color-on-secondary-100: #000000de;--eun-color-secondary-200: #7b94ab;--eun-color-on-secondary-200: #000000de;--eun-color-secondary-300: #93b2cc;--eun-color-on-secondary-300: #000000de;--eun-color-secondary-400: #9cbdda;--eun-color-on-secondary-400: #000000de;--eun-color-secondary-500: #a7c9e7;--eun-color-on-secondary-500: #000000de;--eun-color-secondary-600: #accde9;--eun-color-on-secondary-600: #000000de;--eun-color-secondary-700: #b1cfea;--eun-color-on-secondary-700: #000000de;--eun-color-secondary-800: #bdd7ee;--eun-color-on-secondary-800: #000000de;--eun-color-secondary-900: #c8def0;--eun-color-on-secondary-900: #000000de;--eun-color-secondary-950: #d1e3f3;--eun-color-on-secondary-950: #000000de;--eun-color-secondary-alpha-5: rgba(167, 201, 231, 0.05);--eun-color-secondary-alpha-10: rgba(167, 201, 231, 0.1);--eun-color-secondary-alpha-20: rgba(167, 201, 231, 0.2);--eun-color-secondary-alpha-30: rgba(167, 201, 231, 0.3);--eun-color-secondary-alpha-40: rgba(167, 201, 231, 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: #2e3339;--eun-divider-tint: #6b7186;--eun-border-tint: #6b7186;--eun-content-hover-tint: rgba(252, 251, 246, 0.08);--eun-content-pressed-tint: rgba(252, 251, 246, 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-gold-theme{--eun-color-primary-50: #e3cf8f;--eun-color-on-primary-50: #000000de;--eun-color-primary-100: #ddc477;--eun-color-on-primary-100: #000000de;--eun-color-primary-200: #d7ba5f;--eun-color-on-primary-200: #000000de;--eun-color-primary-300: #cfad41;--eun-color-on-primary-300: #000000de;--eun-color-primary-400: #cca834;--eun-color-on-primary-400: #000000de;--eun-color-primary-500: #c9a227;--eun-color-on-primary-500: #000000de;--eun-color-primary-600: #bd9825;--eun-color-on-primary-600: #000000de;--eun-color-primary-700: #b18f22;--eun-color-on-primary-700: #000000de;--eun-color-primary-800: #95781d;--eun-color-on-primary-800: #000000de;--eun-color-primary-900: #7f6619;--eun-color-on-primary-900: #ffffff;--eun-color-primary-950: #695414;--eun-color-on-primary-950: #ffffff;--eun-color-primary-alpha-5: rgba(201, 162, 39, 0.05);--eun-color-primary-alpha-10: rgba(201, 162, 39, 0.1);--eun-color-primary-alpha-20: rgba(201, 162, 39, 0.2);--eun-color-primary-alpha-30: rgba(201, 162, 39, 0.3);--eun-color-primary-alpha-40: rgba(201, 162, 39, 0.4);--eun-color-secondary-50: #8499ab;--eun-color-on-secondary-50: #000000de;--eun-color-secondary-100: #6a839a;--eun-color-on-secondary-100: #000000de;--eun-color-secondary-200: #506d88;--eun-color-on-secondary-200: #ffffff;--eun-color-secondary-300: #2e5271;--eun-color-on-secondary-300: #ffffff;--eun-color-secondary-400: #204668;--eun-color-on-secondary-400: #ffffff;--eun-color-secondary-500: #123a5e;--eun-color-on-secondary-500: #ffffff;--eun-color-secondary-600: #113758;--eun-color-on-secondary-600: #ffffff;--eun-color-secondary-700: #103353;--eun-color-on-secondary-700: #ffffff;--eun-color-secondary-800: #0d2b46;--eun-color-on-secondary-800: #ffffff;--eun-color-secondary-900: #0b253b;--eun-color-on-secondary-900: #ffffff;--eun-color-secondary-950: #091e31;--eun-color-on-secondary-950: #ffffff;--eun-color-secondary-alpha-5: rgba(18, 58, 94, 0.05);--eun-color-secondary-alpha-10: rgba(18, 58, 94, 0.1);--eun-color-secondary-alpha-20: rgba(18, 58, 94, 0.2);--eun-color-secondary-alpha-30: rgba(18, 58, 94, 0.3);--eun-color-secondary-alpha-40: rgba(18, 58, 94, 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: #fcfaf4;--eun-divider-tint: #dddddd;--eun-border-tint: #dddddd;--eun-content-hover-tint: #ebebe6;--eun-content-pressed-tint: #e3e3de}.eunomia-gold-theme--dark{--eun-color-primary-50: #6a5922;--eun-color-on-primary-50: #ffffff;--eun-color-primary-100: #806b2a;--eun-color-on-primary-100: #ffffff;--eun-color-primary-200: #977e31;--eun-color-on-primary-200: #000000de;--eun-color-primary-300: #b3963b;--eun-color-on-primary-300: #000000de;--eun-color-primary-400: #c0a13e;--eun-color-on-primary-400: #000000de;--eun-color-primary-500: #ccab42;--eun-color-on-primary-500: #000000de;--eun-color-primary-600: #cfaf4d;--eun-color-on-primary-600: #000000de;--eun-color-primary-700: #d2b559;--eun-color-on-primary-700: #000000de;--eun-color-primary-800: #d9c073;--eun-color-on-primary-800: #000000de;--eun-color-primary-900: #dec988;--eun-color-on-primary-900: #000000de;--eun-color-primary-950: #e5d39c;--eun-color-on-primary-950: #000000de;--eun-color-primary-alpha-5: rgba(204, 171, 66, 0.05);--eun-color-primary-alpha-10: rgba(204, 171, 66, 0.1);--eun-color-primary-alpha-20: rgba(204, 171, 66, 0.2);--eun-color-primary-alpha-30: rgba(204, 171, 66, 0.3);--eun-color-primary-alpha-40: rgba(204, 171, 66, 0.4);--eun-color-secondary-50: #576978;--eun-color-on-secondary-50: #ffffff;--eun-color-secondary-100: #697e91;--eun-color-on-secondary-100: #000000de;--eun-color-secondary-200: #7b94ab;--eun-color-on-secondary-200: #000000de;--eun-color-secondary-300: #93b2cc;--eun-color-on-secondary-300: #000000de;--eun-color-secondary-400: #9cbdda;--eun-color-on-secondary-400: #000000de;--eun-color-secondary-500: #a7c9e7;--eun-color-on-secondary-500: #000000de;--eun-color-secondary-600: #accde9;--eun-color-on-secondary-600: #000000de;--eun-color-secondary-700: #b1cfea;--eun-color-on-secondary-700: #000000de;--eun-color-secondary-800: #bdd7ee;--eun-color-on-secondary-800: #000000de;--eun-color-secondary-900: #c8def0;--eun-color-on-secondary-900: #000000de;--eun-color-secondary-950: #d1e3f3;--eun-color-on-secondary-950: #000000de;--eun-color-secondary-alpha-5: rgba(167, 201, 231, 0.05);--eun-color-secondary-alpha-10: rgba(167, 201, 231, 0.1);--eun-color-secondary-alpha-20: rgba(167, 201, 231, 0.2);--eun-color-secondary-alpha-30: rgba(167, 201, 231, 0.3);--eun-color-secondary-alpha-40: rgba(167, 201, 231, 0.4);--eun-content-hover: rgba(255, 255, 255, 0.08);--eun-content-pressed: rgba(255, 255, 255, 0.14);--eun-surface-color: var(--eun-color-grey-0);--eun-border-color: color-mix( in srgb, var(--eun-text-color) 12%, var(--eun-surface-color) );--eun-divider-color: var(--eun-border-color);--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: #2e3339;--eun-border-tint: color-mix( in srgb, var(--eun-color-primary-500) 5%, var(--eun-border-color) );--eun-divider-tint: var(--eun-border-tint);--eun-content-hover-tint: rgba(252, 251, 246, 0.08);--eun-content-pressed-tint: rgba(252, 251, 246, 0.14)}
package/dist/cdn/styles/themes/prebuilt-themes/ocean/eunomia-ocean-dark.mixin.scss CHANGED
@@ -63,8 +63,12 @@
63
63
  @include eunomia-dark-neutrals();
64
64
 
65
65
  --eun-surface-tint: #2a3542;
66
- --eun-divider-tint: #67738f;
67
- --eun-border-tint: #67738f;
66
+ --eun-border-tint: color-mix(
67
+ in srgb,
68
+ var(--eun-color-primary-500) 5%,
69
+ var(--eun-border-color)
70
+ );
71
+ --eun-divider-tint: var(--eun-border-tint);
68
72
  --eun-content-hover-tint: rgba(248, 253, 254, 0.08);
69
73
  --eun-content-pressed-tint: rgba(248, 253, 254, 0.14);
70
74
  }
package/dist/cdn/styles/themes/prebuilt-themes/ocean/eunomia-ocean.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}: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-ocean-theme{--eun-color-primary-50: #80b4c3;--eun-color-on-primary-50: #000000de;--eun-color-primary-100: #65a4b7;--eun-color-on-primary-100: #000000de;--eun-color-primary-200: #4a94aa;--eun-color-on-primary-200: #000000de;--eun-color-primary-300: #287f9a;--eun-color-on-primary-300: #ffffff;--eun-color-primary-400: #1a7793;--eun-color-on-primary-400: #ffffff;--eun-color-primary-500: #0b6e8c;--eun-color-on-primary-500: #ffffff;--eun-color-primary-600: #0a6784;--eun-color-on-primary-600: #ffffff;--eun-color-primary-700: #0a617b;--eun-color-on-primary-700: #ffffff;--eun-color-primary-800: #085168;--eun-color-on-primary-800: #ffffff;--eun-color-primary-900: #074558;--eun-color-on-primary-900: #ffffff;--eun-color-primary-950: #063949;--eun-color-on-primary-950: #ffffff;--eun-color-primary-alpha-5: rgba(11, 110, 140, 0.05);--eun-color-primary-alpha-10: rgba(11, 110, 140, 0.1);--eun-color-primary-alpha-20: rgba(11, 110, 140, 0.2);--eun-color-primary-alpha-30: rgba(11, 110, 140, 0.3);--eun-color-primary-alpha-40: rgba(11, 110, 140, 0.4);--eun-color-secondary-50: #92e0d9;--eun-color-on-secondary-50: #000000de;--eun-color-secondary-100: #7bdad1;--eun-color-on-secondary-100: #000000de;--eun-color-secondary-200: #64d3c9;--eun-color-on-secondary-200: #000000de;--eun-color-secondary-300: #47cbbf;--eun-color-on-secondary-300: #000000de;--eun-color-secondary-400: #3bc8ba;--eun-color-on-secondary-400: #000000de;--eun-color-secondary-500: #2ec4b6;--eun-color-on-secondary-500: #000000de;--eun-color-secondary-600: #2bb8ab;--eun-color-on-secondary-600: #000000de;--eun-color-secondary-700: #28aca0;--eun-color-on-secondary-700: #000000de;--eun-color-secondary-800: #229187;--eun-color-on-secondary-800: #000000de;--eun-color-secondary-900: #1d7b73;--eun-color-on-secondary-900: #ffffff;--eun-color-secondary-950: #18665f;--eun-color-on-secondary-950: #ffffff;--eun-color-secondary-alpha-5: rgba(46, 196, 182, 0.05);--eun-color-secondary-alpha-10: rgba(46, 196, 182, 0.1);--eun-color-secondary-alpha-20: rgba(46, 196, 182, 0.2);--eun-color-secondary-alpha-30: rgba(46, 196, 182, 0.3);--eun-color-secondary-alpha-40: rgba(46, 196, 182, 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: #f3f8f9;--eun-divider-tint: #d3dae2;--eun-border-tint: #d3dae2;--eun-content-hover-tint: #e2e9eb;--eun-content-pressed-tint: #d9e0e3}.eunomia-ocean-theme--dark{--eun-color-primary-50: #416d7a;--eun-color-on-primary-50: #ffffff;--eun-color-primary-100: #4e8494;--eun-color-on-primary-100: #000000de;--eun-color-primary-200: #5c9bae;--eun-color-on-primary-200: #000000de;--eun-color-primary-300: #6eb8ce;--eun-color-on-primary-300: #000000de;--eun-color-primary-400: #75c4dc;--eun-color-on-primary-400: #000000de;--eun-color-primary-500: #7dd1ea;--eun-color-on-primary-500: #000000de;--eun-color-primary-600: #84d3ec;--eun-color-on-primary-600: #000000de;--eun-color-primary-700: #8cd6ed;--eun-color-on-primary-700: #000000de;--eun-color-primary-800: #9edcf0;--eun-color-on-primary-800: #000000de;--eun-color-primary-900: #ade2f2;--eun-color-on-primary-900: #000000de;--eun-color-primary-950: #bbe6f4;--eun-color-on-primary-950: #000000de;--eun-color-primary-alpha-5: rgba(125, 209, 234, 0.05);--eun-color-primary-alpha-10: rgba(125, 209, 234, 0.1);--eun-color-primary-alpha-20: rgba(125, 209, 234, 0.2);--eun-color-primary-alpha-30: rgba(125, 209, 234, 0.3);--eun-color-primary-alpha-40: rgba(125, 209, 234, 0.4);--eun-color-secondary-50: #256761;--eun-color-on-secondary-50: #ffffff;--eun-color-secondary-100: #2c7d75;--eun-color-on-secondary-100: #ffffff;--eun-color-secondary-200: #34938a;--eun-color-on-secondary-200: #000000de;--eun-color-secondary-300: #3eaea4;--eun-color-on-secondary-300: #000000de;--eun-color-secondary-400: #42b9ae;--eun-color-on-secondary-400: #000000de;--eun-color-secondary-500: #46c6ba;--eun-color-on-secondary-500: #000000de;--eun-color-secondary-600: #52c9be;--eun-color-on-secondary-600: #000000de;--eun-color-secondary-700: #5dcdc3;--eun-color-on-secondary-700: #000000de;--eun-color-secondary-800: #76d5cc;--eun-color-on-secondary-800: #000000de;--eun-color-secondary-900: #8bdbd4;--eun-color-on-secondary-900: #000000de;--eun-color-secondary-950: #9fe1db;--eun-color-on-secondary-950: #000000de;--eun-color-secondary-alpha-5: rgba(70, 198, 186, 0.05);--eun-color-secondary-alpha-10: rgba(70, 198, 186, 0.1);--eun-color-secondary-alpha-20: rgba(70, 198, 186, 0.2);--eun-color-secondary-alpha-30: rgba(70, 198, 186, 0.3);--eun-color-secondary-alpha-40: rgba(70, 198, 186, 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: #2a3542;--eun-divider-tint: #67738f;--eun-border-tint: #67738f;--eun-content-hover-tint: rgba(248, 253, 254, 0.08);--eun-content-pressed-tint: rgba(248, 253, 254, 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-ocean-theme{--eun-color-primary-50: #80b4c3;--eun-color-on-primary-50: #000000de;--eun-color-primary-100: #65a4b7;--eun-color-on-primary-100: #000000de;--eun-color-primary-200: #4a94aa;--eun-color-on-primary-200: #000000de;--eun-color-primary-300: #287f9a;--eun-color-on-primary-300: #ffffff;--eun-color-primary-400: #1a7793;--eun-color-on-primary-400: #ffffff;--eun-color-primary-500: #0b6e8c;--eun-color-on-primary-500: #ffffff;--eun-color-primary-600: #0a6784;--eun-color-on-primary-600: #ffffff;--eun-color-primary-700: #0a617b;--eun-color-on-primary-700: #ffffff;--eun-color-primary-800: #085168;--eun-color-on-primary-800: #ffffff;--eun-color-primary-900: #074558;--eun-color-on-primary-900: #ffffff;--eun-color-primary-950: #063949;--eun-color-on-primary-950: #ffffff;--eun-color-primary-alpha-5: rgba(11, 110, 140, 0.05);--eun-color-primary-alpha-10: rgba(11, 110, 140, 0.1);--eun-color-primary-alpha-20: rgba(11, 110, 140, 0.2);--eun-color-primary-alpha-30: rgba(11, 110, 140, 0.3);--eun-color-primary-alpha-40: rgba(11, 110, 140, 0.4);--eun-color-secondary-50: #92e0d9;--eun-color-on-secondary-50: #000000de;--eun-color-secondary-100: #7bdad1;--eun-color-on-secondary-100: #000000de;--eun-color-secondary-200: #64d3c9;--eun-color-on-secondary-200: #000000de;--eun-color-secondary-300: #47cbbf;--eun-color-on-secondary-300: #000000de;--eun-color-secondary-400: #3bc8ba;--eun-color-on-secondary-400: #000000de;--eun-color-secondary-500: #2ec4b6;--eun-color-on-secondary-500: #000000de;--eun-color-secondary-600: #2bb8ab;--eun-color-on-secondary-600: #000000de;--eun-color-secondary-700: #28aca0;--eun-color-on-secondary-700: #000000de;--eun-color-secondary-800: #229187;--eun-color-on-secondary-800: #000000de;--eun-color-secondary-900: #1d7b73;--eun-color-on-secondary-900: #ffffff;--eun-color-secondary-950: #18665f;--eun-color-on-secondary-950: #ffffff;--eun-color-secondary-alpha-5: rgba(46, 196, 182, 0.05);--eun-color-secondary-alpha-10: rgba(46, 196, 182, 0.1);--eun-color-secondary-alpha-20: rgba(46, 196, 182, 0.2);--eun-color-secondary-alpha-30: rgba(46, 196, 182, 0.3);--eun-color-secondary-alpha-40: rgba(46, 196, 182, 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: #f3f8f9;--eun-divider-tint: #d3dae2;--eun-border-tint: #d3dae2;--eun-content-hover-tint: #e2e9eb;--eun-content-pressed-tint: #d9e0e3}.eunomia-ocean-theme--dark{--eun-color-primary-50: #416d7a;--eun-color-on-primary-50: #ffffff;--eun-color-primary-100: #4e8494;--eun-color-on-primary-100: #000000de;--eun-color-primary-200: #5c9bae;--eun-color-on-primary-200: #000000de;--eun-color-primary-300: #6eb8ce;--eun-color-on-primary-300: #000000de;--eun-color-primary-400: #75c4dc;--eun-color-on-primary-400: #000000de;--eun-color-primary-500: #7dd1ea;--eun-color-on-primary-500: #000000de;--eun-color-primary-600: #84d3ec;--eun-color-on-primary-600: #000000de;--eun-color-primary-700: #8cd6ed;--eun-color-on-primary-700: #000000de;--eun-color-primary-800: #9edcf0;--eun-color-on-primary-800: #000000de;--eun-color-primary-900: #ade2f2;--eun-color-on-primary-900: #000000de;--eun-color-primary-950: #bbe6f4;--eun-color-on-primary-950: #000000de;--eun-color-primary-alpha-5: rgba(125, 209, 234, 0.05);--eun-color-primary-alpha-10: rgba(125, 209, 234, 0.1);--eun-color-primary-alpha-20: rgba(125, 209, 234, 0.2);--eun-color-primary-alpha-30: rgba(125, 209, 234, 0.3);--eun-color-primary-alpha-40: rgba(125, 209, 234, 0.4);--eun-color-secondary-50: #256761;--eun-color-on-secondary-50: #ffffff;--eun-color-secondary-100: #2c7d75;--eun-color-on-secondary-100: #ffffff;--eun-color-secondary-200: #34938a;--eun-color-on-secondary-200: #000000de;--eun-color-secondary-300: #3eaea4;--eun-color-on-secondary-300: #000000de;--eun-color-secondary-400: #42b9ae;--eun-color-on-secondary-400: #000000de;--eun-color-secondary-500: #46c6ba;--eun-color-on-secondary-500: #000000de;--eun-color-secondary-600: #52c9be;--eun-color-on-secondary-600: #000000de;--eun-color-secondary-700: #5dcdc3;--eun-color-on-secondary-700: #000000de;--eun-color-secondary-800: #76d5cc;--eun-color-on-secondary-800: #000000de;--eun-color-secondary-900: #8bdbd4;--eun-color-on-secondary-900: #000000de;--eun-color-secondary-950: #9fe1db;--eun-color-on-secondary-950: #000000de;--eun-color-secondary-alpha-5: rgba(70, 198, 186, 0.05);--eun-color-secondary-alpha-10: rgba(70, 198, 186, 0.1);--eun-color-secondary-alpha-20: rgba(70, 198, 186, 0.2);--eun-color-secondary-alpha-30: rgba(70, 198, 186, 0.3);--eun-color-secondary-alpha-40: rgba(70, 198, 186, 0.4);--eun-content-hover: rgba(255, 255, 255, 0.08);--eun-content-pressed: rgba(255, 255, 255, 0.14);--eun-surface-color: var(--eun-color-grey-0);--eun-border-color: color-mix( in srgb, var(--eun-text-color) 12%, var(--eun-surface-color) );--eun-divider-color: var(--eun-border-color);--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: #2a3542;--eun-border-tint: color-mix( in srgb, var(--eun-color-primary-500) 5%, var(--eun-border-color) );--eun-divider-tint: var(--eun-border-tint);--eun-content-hover-tint: rgba(248, 253, 254, 0.08);--eun-content-pressed-tint: rgba(248, 253, 254, 0.14)}
package/dist/cdn/styles/themes/prebuilt-themes/salmon/eunomia-salmon-dark.mixin.scss CHANGED
@@ -63,8 +63,12 @@
63
63
  @include eunomia-dark-neutrals();
64
64
 
65
65
  --eun-surface-tint: #2a2d37;
66
- --eun-divider-tint: #676b84;
67
- --eun-border-tint: #676b84;
66
+ --eun-border-tint: color-mix(
67
+ in srgb,
68
+ var(--eun-color-primary-500) 5%,
69
+ var(--eun-border-color)
70
+ );
71
+ --eun-divider-tint: var(--eun-border-tint);
68
72
  --eun-content-hover-tint: rgba(248, 245, 244, 0.08);
69
73
  --eun-content-pressed-tint: rgba(248, 245, 244, 0.14);
70
74
  }
package/dist/cdn/styles/themes/prebuilt-themes/salmon/eunomia-salmon.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}: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-salmon-theme{--eun-color-primary-50: #f7ccbb;--eun-color-on-primary-50: #000000de;--eun-color-primary-100: #f5c1ac;--eun-color-on-primary-100: #000000de;--eun-color-primary-200: #f3b69e;--eun-color-on-primary-200: #000000de;--eun-color-primary-300: #f1a88c;--eun-color-on-primary-300: #000000de;--eun-color-primary-400: #f0a284;--eun-color-on-primary-400: #000000de;--eun-color-primary-500: #ef9c7c;--eun-color-on-primary-500: #000000de;--eun-color-primary-600: #e19375;--eun-color-on-primary-600: #000000de;--eun-color-primary-700: #d2896d;--eun-color-on-primary-700: #000000de;--eun-color-primary-800: #b1735c;--eun-color-on-primary-800: #000000de;--eun-color-primary-900: #97624e;--eun-color-on-primary-900: #ffffff;--eun-color-primary-950: #7c5140;--eun-color-on-primary-950: #ffffff;--eun-color-primary-alpha-5: rgba(239, 156, 124, 0.05);--eun-color-primary-alpha-10: rgba(239, 156, 124, 0.1);--eun-color-primary-alpha-20: rgba(239, 156, 124, 0.2);--eun-color-primary-alpha-30: rgba(239, 156, 124, 0.3);--eun-color-primary-alpha-40: rgba(239, 156, 124, 0.4);--eun-color-secondary-50: #85c3e8;--eun-color-on-secondary-50: #000000de;--eun-color-secondary-100: #6bb7e3;--eun-color-on-secondary-100: #000000de;--eun-color-secondary-200: #51aade;--eun-color-on-secondary-200: #000000de;--eun-color-secondary-300: #309ad7;--eun-color-on-secondary-300: #000000de;--eun-color-secondary-400: #2293d5;--eun-color-on-secondary-400: #000000de;--eun-color-secondary-500: #148cd2;--eun-color-on-secondary-500: #000000de;--eun-color-secondary-600: #1384c5;--eun-color-on-secondary-600: #000000de;--eun-color-secondary-700: #127bb9;--eun-color-on-secondary-700: #ffffff;--eun-color-secondary-800: #0f689b;--eun-color-on-secondary-800: #ffffff;--eun-color-secondary-900: #0d5884;--eun-color-on-secondary-900: #ffffff;--eun-color-secondary-950: #0a496d;--eun-color-on-secondary-950: #ffffff;--eun-color-secondary-alpha-5: rgba(20, 140, 210, 0.05);--eun-color-secondary-alpha-10: rgba(20, 140, 210, 0.1);--eun-color-secondary-alpha-20: rgba(20, 140, 210, 0.2);--eun-color-secondary-alpha-30: rgba(20, 140, 210, 0.3);--eun-color-secondary-alpha-40: rgba(20, 140, 210, 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: #fefaf8;--eun-divider-tint: #dfdde2;--eun-border-tint: #dfdde2;--eun-content-hover-tint: #edebea;--eun-content-pressed-tint: #e5e2e3}.eunomia-salmon-theme--dark{--eun-color-primary-50: #401b0d;--eun-color-on-primary-50: #ffffff;--eun-color-primary-100: #4e210f;--eun-color-on-primary-100: #ffffff;--eun-color-primary-200: #5b2712;--eun-color-on-primary-200: #ffffff;--eun-color-primary-300: #6b2d16;--eun-color-on-primary-300: #ffffff;--eun-color-primary-400: #733117;--eun-color-on-primary-400: #ffffff;--eun-color-primary-500: #ef9c7c;--eun-color-on-primary-500: #000000de;--eun-color-primary-600: #824026;--eun-color-on-primary-600: #ffffff;--eun-color-primary-700: #8a4c35;--eun-color-on-primary-700: #ffffff;--eun-color-primary-800: #9d6854;--eun-color-on-primary-800: #ffffff;--eun-color-primary-900: #ac7e6d;--eun-color-on-primary-900: #000000de;--eun-color-primary-950: #ba9688;--eun-color-on-primary-950: #000000de;--eun-color-primary-alpha-5: rgba(239, 156, 124, 0.05);--eun-color-primary-alpha-10: rgba(239, 156, 124, 0.1);--eun-color-primary-alpha-20: rgba(239, 156, 124, 0.2);--eun-color-primary-alpha-30: rgba(239, 156, 124, 0.3);--eun-color-primary-alpha-40: rgba(239, 156, 124, 0.4);--eun-color-secondary-50: #1e5373;--eun-color-on-secondary-50: #ffffff;--eun-color-secondary-100: #25668b;--eun-color-on-secondary-100: #ffffff;--eun-color-secondary-200: #2c77a3;--eun-color-on-secondary-200: #ffffff;--eun-color-secondary-300: #358fc2;--eun-color-on-secondary-300: #000000de;--eun-color-secondary-400: #3797d0;--eun-color-on-secondary-400: #000000de;--eun-color-secondary-500: #3ba1dd;--eun-color-on-secondary-500: #000000de;--eun-color-secondary-600: #47a7df;--eun-color-on-secondary-600: #000000de;--eun-color-secondary-700: #53ace0;--eun-color-on-secondary-700: #000000de;--eun-color-secondary-800: #6fbae6;--eun-color-on-secondary-800: #000000de;--eun-color-secondary-900: #84c4e9;--eun-color-on-secondary-900: #000000de;--eun-color-secondary-950: #99cfee;--eun-color-on-secondary-950: #000000de;--eun-color-secondary-alpha-5: rgba(59, 161, 221, 0.05);--eun-color-secondary-alpha-10: rgba(59, 161, 221, 0.1);--eun-color-secondary-alpha-20: rgba(59, 161, 221, 0.2);--eun-color-secondary-alpha-30: rgba(59, 161, 221, 0.3);--eun-color-secondary-alpha-40: rgba(59, 161, 221, 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: #2a2d37;--eun-divider-tint: #676b84;--eun-border-tint: #676b84;--eun-content-hover-tint: rgba(248, 245, 244, 0.08);--eun-content-pressed-tint: rgba(248, 245, 244, 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-salmon-theme{--eun-color-primary-50: #f7ccbb;--eun-color-on-primary-50: #000000de;--eun-color-primary-100: #f5c1ac;--eun-color-on-primary-100: #000000de;--eun-color-primary-200: #f3b69e;--eun-color-on-primary-200: #000000de;--eun-color-primary-300: #f1a88c;--eun-color-on-primary-300: #000000de;--eun-color-primary-400: #f0a284;--eun-color-on-primary-400: #000000de;--eun-color-primary-500: #ef9c7c;--eun-color-on-primary-500: #000000de;--eun-color-primary-600: #e19375;--eun-color-on-primary-600: #000000de;--eun-color-primary-700: #d2896d;--eun-color-on-primary-700: #000000de;--eun-color-primary-800: #b1735c;--eun-color-on-primary-800: #000000de;--eun-color-primary-900: #97624e;--eun-color-on-primary-900: #ffffff;--eun-color-primary-950: #7c5140;--eun-color-on-primary-950: #ffffff;--eun-color-primary-alpha-5: rgba(239, 156, 124, 0.05);--eun-color-primary-alpha-10: rgba(239, 156, 124, 0.1);--eun-color-primary-alpha-20: rgba(239, 156, 124, 0.2);--eun-color-primary-alpha-30: rgba(239, 156, 124, 0.3);--eun-color-primary-alpha-40: rgba(239, 156, 124, 0.4);--eun-color-secondary-50: #85c3e8;--eun-color-on-secondary-50: #000000de;--eun-color-secondary-100: #6bb7e3;--eun-color-on-secondary-100: #000000de;--eun-color-secondary-200: #51aade;--eun-color-on-secondary-200: #000000de;--eun-color-secondary-300: #309ad7;--eun-color-on-secondary-300: #000000de;--eun-color-secondary-400: #2293d5;--eun-color-on-secondary-400: #000000de;--eun-color-secondary-500: #148cd2;--eun-color-on-secondary-500: #000000de;--eun-color-secondary-600: #1384c5;--eun-color-on-secondary-600: #000000de;--eun-color-secondary-700: #127bb9;--eun-color-on-secondary-700: #ffffff;--eun-color-secondary-800: #0f689b;--eun-color-on-secondary-800: #ffffff;--eun-color-secondary-900: #0d5884;--eun-color-on-secondary-900: #ffffff;--eun-color-secondary-950: #0a496d;--eun-color-on-secondary-950: #ffffff;--eun-color-secondary-alpha-5: rgba(20, 140, 210, 0.05);--eun-color-secondary-alpha-10: rgba(20, 140, 210, 0.1);--eun-color-secondary-alpha-20: rgba(20, 140, 210, 0.2);--eun-color-secondary-alpha-30: rgba(20, 140, 210, 0.3);--eun-color-secondary-alpha-40: rgba(20, 140, 210, 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: #fefaf8;--eun-divider-tint: #dfdde2;--eun-border-tint: #dfdde2;--eun-content-hover-tint: #edebea;--eun-content-pressed-tint: #e5e2e3}.eunomia-salmon-theme--dark{--eun-color-primary-50: #401b0d;--eun-color-on-primary-50: #ffffff;--eun-color-primary-100: #4e210f;--eun-color-on-primary-100: #ffffff;--eun-color-primary-200: #5b2712;--eun-color-on-primary-200: #ffffff;--eun-color-primary-300: #6b2d16;--eun-color-on-primary-300: #ffffff;--eun-color-primary-400: #733117;--eun-color-on-primary-400: #ffffff;--eun-color-primary-500: #ef9c7c;--eun-color-on-primary-500: #000000de;--eun-color-primary-600: #824026;--eun-color-on-primary-600: #ffffff;--eun-color-primary-700: #8a4c35;--eun-color-on-primary-700: #ffffff;--eun-color-primary-800: #9d6854;--eun-color-on-primary-800: #ffffff;--eun-color-primary-900: #ac7e6d;--eun-color-on-primary-900: #000000de;--eun-color-primary-950: #ba9688;--eun-color-on-primary-950: #000000de;--eun-color-primary-alpha-5: rgba(239, 156, 124, 0.05);--eun-color-primary-alpha-10: rgba(239, 156, 124, 0.1);--eun-color-primary-alpha-20: rgba(239, 156, 124, 0.2);--eun-color-primary-alpha-30: rgba(239, 156, 124, 0.3);--eun-color-primary-alpha-40: rgba(239, 156, 124, 0.4);--eun-color-secondary-50: #1e5373;--eun-color-on-secondary-50: #ffffff;--eun-color-secondary-100: #25668b;--eun-color-on-secondary-100: #ffffff;--eun-color-secondary-200: #2c77a3;--eun-color-on-secondary-200: #ffffff;--eun-color-secondary-300: #358fc2;--eun-color-on-secondary-300: #000000de;--eun-color-secondary-400: #3797d0;--eun-color-on-secondary-400: #000000de;--eun-color-secondary-500: #3ba1dd;--eun-color-on-secondary-500: #000000de;--eun-color-secondary-600: #47a7df;--eun-color-on-secondary-600: #000000de;--eun-color-secondary-700: #53ace0;--eun-color-on-secondary-700: #000000de;--eun-color-secondary-800: #6fbae6;--eun-color-on-secondary-800: #000000de;--eun-color-secondary-900: #84c4e9;--eun-color-on-secondary-900: #000000de;--eun-color-secondary-950: #99cfee;--eun-color-on-secondary-950: #000000de;--eun-color-secondary-alpha-5: rgba(59, 161, 221, 0.05);--eun-color-secondary-alpha-10: rgba(59, 161, 221, 0.1);--eun-color-secondary-alpha-20: rgba(59, 161, 221, 0.2);--eun-color-secondary-alpha-30: rgba(59, 161, 221, 0.3);--eun-color-secondary-alpha-40: rgba(59, 161, 221, 0.4);--eun-content-hover: rgba(255, 255, 255, 0.08);--eun-content-pressed: rgba(255, 255, 255, 0.14);--eun-surface-color: var(--eun-color-grey-0);--eun-border-color: color-mix( in srgb, var(--eun-text-color) 12%, var(--eun-surface-color) );--eun-divider-color: var(--eun-border-color);--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: #2a2d37;--eun-border-tint: color-mix( in srgb, var(--eun-color-primary-500) 5%, var(--eun-border-color) );--eun-divider-tint: var(--eun-border-tint);--eun-content-hover-tint: rgba(248, 245, 244, 0.08);--eun-content-pressed-tint: rgba(248, 245, 244, 0.14)}
package/dist/cdn/styles/themes/prebuilt-themes/violet/eunomia-violet-dark.mixin.scss CHANGED
@@ -63,8 +63,12 @@
63
63
  @include eunomia-dark-neutrals();
64
64
 
65
65
  --eun-surface-tint: #2a2d40;
66
- --eun-divider-tint: #666b8d;
67
- --eun-border-tint: #666b8d;
66
+ --eun-border-tint: color-mix(
67
+ in srgb,
68
+ var(--eun-color-primary-500) 5%,
69
+ var(--eun-border-color)
70
+ );
71
+ --eun-divider-tint: var(--eun-border-tint);
68
72
  --eun-content-hover-tint: rgba(248, 245, 252, 0.08);
69
73
  --eun-content-pressed-tint: rgba(248, 245, 252, 0.14);
70
74
  }
package/dist/cdn/styles/themes/prebuilt-themes/violet/eunomia-violet.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}: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-violet-theme{--eun-color-primary-50: #b38feb;--eun-color-on-primary-50: #000000de;--eun-color-primary-100: #a378e7;--eun-color-on-primary-100: #000000de;--eun-color-primary-200: #9360e3;--eun-color-on-primary-200: #000000de;--eun-color-primary-300: #7f42de;--eun-color-on-primary-300: #ffffff;--eun-color-primary-400: #7635db;--eun-color-on-primary-400: #ffffff;--eun-color-primary-500: #6d28d9;--eun-color-on-primary-500: #ffffff;--eun-color-primary-600: #6626cc;--eun-color-on-primary-600: #ffffff;--eun-color-primary-700: #6023bf;--eun-color-on-primary-700: #ffffff;--eun-color-primary-800: #511ea1;--eun-color-on-primary-800: #ffffff;--eun-color-primary-900: #451989;--eun-color-on-primary-900: #ffffff;--eun-color-primary-950: #391571;--eun-color-on-primary-950: #ffffff;--eun-color-primary-alpha-5: rgba(109, 40, 217, 0.05);--eun-color-primary-alpha-10: rgba(109, 40, 217, 0.1);--eun-color-primary-alpha-20: rgba(109, 40, 217, 0.2);--eun-color-primary-alpha-30: rgba(109, 40, 217, 0.3);--eun-color-primary-alpha-40: rgba(109, 40, 217, 0.4);--eun-color-secondary-50: #82d0d0;--eun-color-on-secondary-50: #000000de;--eun-color-secondary-100: #67c6c6;--eun-color-on-secondary-100: #000000de;--eun-color-secondary-200: #4dbcbc;--eun-color-on-secondary-200: #000000de;--eun-color-secondary-300: #2bb0af;--eun-color-on-secondary-300: #000000de;--eun-color-secondary-400: #1caaa9;--eun-color-on-secondary-400: #000000de;--eun-color-secondary-500: #0ea5a4;--eun-color-on-secondary-500: #000000de;--eun-color-secondary-600: #0d9b9a;--eun-color-on-secondary-600: #000000de;--eun-color-secondary-700: #0c9190;--eun-color-on-secondary-700: #000000de;--eun-color-secondary-800: #0a7a79;--eun-color-on-secondary-800: #ffffff;--eun-color-secondary-900: #096867;--eun-color-on-secondary-900: #ffffff;--eun-color-secondary-950: #075655;--eun-color-on-secondary-950: #ffffff;--eun-color-secondary-alpha-5: rgba(14, 165, 164, 0.05);--eun-color-secondary-alpha-10: rgba(14, 165, 164, 0.1);--eun-color-secondary-alpha-20: rgba(14, 165, 164, 0.2);--eun-color-secondary-alpha-30: rgba(14, 165, 164, 0.3);--eun-color-secondary-alpha-40: rgba(14, 165, 164, 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: #f8f4fd;--eun-divider-tint: #d8d7e6;--eun-border-tint: #d8d7e6;--eun-content-hover-tint: #e7e5ef;--eun-content-pressed-tint: #dedce7}.eunomia-violet-theme--dark{--eun-color-primary-50: #3a1b69;--eun-color-on-primary-50: #ffffff;--eun-color-primary-100: #45207f;--eun-color-on-primary-100: #ffffff;--eun-color-primary-200: #512695;--eun-color-on-primary-200: #ffffff;--eun-color-primary-300: #612db1;--eun-color-on-primary-300: #ffffff;--eun-color-primary-400: #6830be;--eun-color-on-primary-400: #ffffff;--eun-color-primary-500: #8b5bd5;--eun-color-on-primary-500: #ffffff;--eun-color-primary-600: #763fcd;--eun-color-on-primary-600: #ffffff;--eun-color-primary-700: #804cd0;--eun-color-on-primary-700: #ffffff;--eun-color-primary-800: #9368d7;--eun-color-on-primary-800: #000000de;--eun-color-primary-900: #a47ede;--eun-color-on-primary-900: #000000de;--eun-color-primary-950: #b495e3;--eun-color-on-primary-950: #000000de;--eun-color-primary-alpha-5: rgba(139, 91, 213, 0.05);--eun-color-primary-alpha-10: rgba(139, 91, 213, 0.1);--eun-color-primary-alpha-20: rgba(139, 91, 213, 0.2);--eun-color-primary-alpha-30: rgba(139, 91, 213, 0.3);--eun-color-primary-alpha-40: rgba(139, 91, 213, 0.4);--eun-color-secondary-50: #357777;--eun-color-on-secondary-50: #ffffff;--eun-color-secondary-100: #409191;--eun-color-on-secondary-100: #000000de;--eun-color-secondary-200: #4baaaa;--eun-color-on-secondary-200: #000000de;--eun-color-secondary-300: #59cac9;--eun-color-on-secondary-300: #000000de;--eun-color-secondary-400: #60d8d8;--eun-color-on-secondary-400: #000000de;--eun-color-secondary-500: #65e6e5;--eun-color-on-secondary-500: #000000de;--eun-color-secondary-600: #6fe7e7;--eun-color-on-secondary-600: #000000de;--eun-color-secondary-700: #78e9e8;--eun-color-on-secondary-700: #000000de;--eun-color-secondary-800: #8dedec;--eun-color-on-secondary-800: #000000de;--eun-color-secondary-900: #9eefee;--eun-color-on-secondary-900: #000000de;--eun-color-secondary-950: #aff2f1;--eun-color-on-secondary-950: #000000de;--eun-color-secondary-alpha-5: rgba(101, 230, 229, 0.05);--eun-color-secondary-alpha-10: rgba(101, 230, 229, 0.1);--eun-color-secondary-alpha-20: rgba(101, 230, 229, 0.2);--eun-color-secondary-alpha-30: rgba(101, 230, 229, 0.3);--eun-color-secondary-alpha-40: rgba(101, 230, 229, 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: #2a2d40;--eun-divider-tint: #666b8d;--eun-border-tint: #666b8d;--eun-content-hover-tint: rgba(248, 245, 252, 0.08);--eun-content-pressed-tint: rgba(248, 245, 252, 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-violet-theme{--eun-color-primary-50: #b38feb;--eun-color-on-primary-50: #000000de;--eun-color-primary-100: #a378e7;--eun-color-on-primary-100: #000000de;--eun-color-primary-200: #9360e3;--eun-color-on-primary-200: #000000de;--eun-color-primary-300: #7f42de;--eun-color-on-primary-300: #ffffff;--eun-color-primary-400: #7635db;--eun-color-on-primary-400: #ffffff;--eun-color-primary-500: #6d28d9;--eun-color-on-primary-500: #ffffff;--eun-color-primary-600: #6626cc;--eun-color-on-primary-600: #ffffff;--eun-color-primary-700: #6023bf;--eun-color-on-primary-700: #ffffff;--eun-color-primary-800: #511ea1;--eun-color-on-primary-800: #ffffff;--eun-color-primary-900: #451989;--eun-color-on-primary-900: #ffffff;--eun-color-primary-950: #391571;--eun-color-on-primary-950: #ffffff;--eun-color-primary-alpha-5: rgba(109, 40, 217, 0.05);--eun-color-primary-alpha-10: rgba(109, 40, 217, 0.1);--eun-color-primary-alpha-20: rgba(109, 40, 217, 0.2);--eun-color-primary-alpha-30: rgba(109, 40, 217, 0.3);--eun-color-primary-alpha-40: rgba(109, 40, 217, 0.4);--eun-color-secondary-50: #82d0d0;--eun-color-on-secondary-50: #000000de;--eun-color-secondary-100: #67c6c6;--eun-color-on-secondary-100: #000000de;--eun-color-secondary-200: #4dbcbc;--eun-color-on-secondary-200: #000000de;--eun-color-secondary-300: #2bb0af;--eun-color-on-secondary-300: #000000de;--eun-color-secondary-400: #1caaa9;--eun-color-on-secondary-400: #000000de;--eun-color-secondary-500: #0ea5a4;--eun-color-on-secondary-500: #000000de;--eun-color-secondary-600: #0d9b9a;--eun-color-on-secondary-600: #000000de;--eun-color-secondary-700: #0c9190;--eun-color-on-secondary-700: #000000de;--eun-color-secondary-800: #0a7a79;--eun-color-on-secondary-800: #ffffff;--eun-color-secondary-900: #096867;--eun-color-on-secondary-900: #ffffff;--eun-color-secondary-950: #075655;--eun-color-on-secondary-950: #ffffff;--eun-color-secondary-alpha-5: rgba(14, 165, 164, 0.05);--eun-color-secondary-alpha-10: rgba(14, 165, 164, 0.1);--eun-color-secondary-alpha-20: rgba(14, 165, 164, 0.2);--eun-color-secondary-alpha-30: rgba(14, 165, 164, 0.3);--eun-color-secondary-alpha-40: rgba(14, 165, 164, 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: #f8f4fd;--eun-divider-tint: #d8d7e6;--eun-border-tint: #d8d7e6;--eun-content-hover-tint: #e7e5ef;--eun-content-pressed-tint: #dedce7}.eunomia-violet-theme--dark{--eun-color-primary-50: #3a1b69;--eun-color-on-primary-50: #ffffff;--eun-color-primary-100: #45207f;--eun-color-on-primary-100: #ffffff;--eun-color-primary-200: #512695;--eun-color-on-primary-200: #ffffff;--eun-color-primary-300: #612db1;--eun-color-on-primary-300: #ffffff;--eun-color-primary-400: #6830be;--eun-color-on-primary-400: #ffffff;--eun-color-primary-500: #8b5bd5;--eun-color-on-primary-500: #ffffff;--eun-color-primary-600: #763fcd;--eun-color-on-primary-600: #ffffff;--eun-color-primary-700: #804cd0;--eun-color-on-primary-700: #ffffff;--eun-color-primary-800: #9368d7;--eun-color-on-primary-800: #000000de;--eun-color-primary-900: #a47ede;--eun-color-on-primary-900: #000000de;--eun-color-primary-950: #b495e3;--eun-color-on-primary-950: #000000de;--eun-color-primary-alpha-5: rgba(139, 91, 213, 0.05);--eun-color-primary-alpha-10: rgba(139, 91, 213, 0.1);--eun-color-primary-alpha-20: rgba(139, 91, 213, 0.2);--eun-color-primary-alpha-30: rgba(139, 91, 213, 0.3);--eun-color-primary-alpha-40: rgba(139, 91, 213, 0.4);--eun-color-secondary-50: #357777;--eun-color-on-secondary-50: #ffffff;--eun-color-secondary-100: #409191;--eun-color-on-secondary-100: #000000de;--eun-color-secondary-200: #4baaaa;--eun-color-on-secondary-200: #000000de;--eun-color-secondary-300: #59cac9;--eun-color-on-secondary-300: #000000de;--eun-color-secondary-400: #60d8d8;--eun-color-on-secondary-400: #000000de;--eun-color-secondary-500: #65e6e5;--eun-color-on-secondary-500: #000000de;--eun-color-secondary-600: #6fe7e7;--eun-color-on-secondary-600: #000000de;--eun-color-secondary-700: #78e9e8;--eun-color-on-secondary-700: #000000de;--eun-color-secondary-800: #8dedec;--eun-color-on-secondary-800: #000000de;--eun-color-secondary-900: #9eefee;--eun-color-on-secondary-900: #000000de;--eun-color-secondary-950: #aff2f1;--eun-color-on-secondary-950: #000000de;--eun-color-secondary-alpha-5: rgba(101, 230, 229, 0.05);--eun-color-secondary-alpha-10: rgba(101, 230, 229, 0.1);--eun-color-secondary-alpha-20: rgba(101, 230, 229, 0.2);--eun-color-secondary-alpha-30: rgba(101, 230, 229, 0.3);--eun-color-secondary-alpha-40: rgba(101, 230, 229, 0.4);--eun-content-hover: rgba(255, 255, 255, 0.08);--eun-content-pressed: rgba(255, 255, 255, 0.14);--eun-surface-color: var(--eun-color-grey-0);--eun-border-color: color-mix( in srgb, var(--eun-text-color) 12%, var(--eun-surface-color) );--eun-divider-color: var(--eun-border-color);--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: #2a2d40;--eun-border-tint: color-mix( in srgb, var(--eun-color-primary-500) 5%, var(--eun-border-color) );--eun-divider-tint: var(--eun-border-tint);--eun-content-hover-tint: rgba(248, 245, 252, 0.08);--eun-content-pressed-tint: rgba(248, 245, 252, 0.14)}
package/dist/components/action/button/button.d.ts CHANGED
@@ -34,7 +34,7 @@ declare const EunomiaButton_base: import("../../../utils/constructor.type.js").C
34
34
  * @prop {string} command - The command sent to the element targeted by commandFor when the button is clicked, following the Invoker Commands API
35
35
  * @prop {string} commandFor - The id of the element that command is sent to
36
36
  * @attr {string} aria-label - The accessible label for the button. When the button opens a link in a new tab, this automatically gets a note appended announcing it. Ignored with a slotted anchor, which takes it instead
37
- * @prop {'default' | 'fill' | 'outline' | 'flat' | 'raised' | 'ghost'} [appearance='fill'] - The button's surface style. Fill is a solid, colored background with light text. Default is a paler tint of the same color. Outline keeps the color as a border instead of a fill. Flat always renders a muted, low emphasis surface regardless of color. Raised adds a drop shadow. Ghost shows no surface at rest, only gaining a border and a tinted background on hover, focus, or press
37
+ * @prop {'soft' | 'fill' | 'outline' | 'flat' | 'raised' | 'ghost'} [appearance='fill'] - The button's surface style. Fill is a solid, colored background with light text. Soft is a paler tint of the same color. Outline keeps the color as a border instead of a fill. Flat always renders a muted, low emphasis surface regardless of color. Raised adds a drop shadow. Ghost shows no surface at rest, only gaining a border and a tinted background on hover, focus, or press
38
38
  * @fires click - Fired when the button is activated by mouse, Enter, or Space
39
39
  * @fires {NavigationEvent} eunnavigate - Fired before following href, so a client-side router can intercept the navigation. Not fired for downloads, and cancelable
40
40
  * @cssprop [--button-background] - Sets the background color
@@ -90,7 +90,7 @@ export declare class EunomiaButton extends EunomiaButton_base {
90
90
  severity?: EunomiaSeverity;
91
91
  /**
92
92
  * The button's surface treatment. `fill` is a solid, opaque
93
- * `color`-colored background with light text ; `default` is a pale
93
+ * `color`-colored background with light text ; `soft` is a pale
94
94
  * tinted wash of the same color ; `outline` drops the fill for a colored
95
95
  * border ; `flat` always renders the same muted, low-emphasis surface
96
96
  * regardless of `color` ; `raised` adds a drop shadow ; `ghost` has no
package/dist/components/action/button/button.js CHANGED
@@ -58,7 +58,7 @@ export const EunomiaButtonTagName = "eun-button";
58
58
  * @prop {string} command - The command sent to the element targeted by commandFor when the button is clicked, following the Invoker Commands API
59
59
  * @prop {string} commandFor - The id of the element that command is sent to
60
60
  * @attr {string} aria-label - The accessible label for the button. When the button opens a link in a new tab, this automatically gets a note appended announcing it. Ignored with a slotted anchor, which takes it instead
61
- * @prop {'default' | 'fill' | 'outline' | 'flat' | 'raised' | 'ghost'} [appearance='fill'] - The button's surface style. Fill is a solid, colored background with light text. Default is a paler tint of the same color. Outline keeps the color as a border instead of a fill. Flat always renders a muted, low emphasis surface regardless of color. Raised adds a drop shadow. Ghost shows no surface at rest, only gaining a border and a tinted background on hover, focus, or press
61
+ * @prop {'soft' | 'fill' | 'outline' | 'flat' | 'raised' | 'ghost'} [appearance='fill'] - The button's surface style. Fill is a solid, colored background with light text. Soft is a paler tint of the same color. Outline keeps the color as a border instead of a fill. Flat always renders a muted, low emphasis surface regardless of color. Raised adds a drop shadow. Ghost shows no surface at rest, only gaining a border and a tinted background on hover, focus, or press
62
62
  * @fires click - Fired when the button is activated by mouse, Enter, or Space
63
63
  * @fires {NavigationEvent} eunnavigate - Fired before following href, so a client-side router can intercept the navigation. Not fired for downloads, and cancelable
64
64
  * @cssprop [--button-background] - Sets the background color
@@ -92,7 +92,7 @@ let EunomiaButton = class EunomiaButton extends ButtonMixin(CommandMixin(Disable
92
92
  this.loadingLabel = "Loading…";
93
93
  /**
94
94
  * The button's surface treatment. `fill` is a solid, opaque
95
- * `color`-colored background with light text ; `default` is a pale
95
+ * `color`-colored background with light text ; `soft` is a pale
96
96
  * tinted wash of the same color ; `outline` drops the fill for a colored
97
97
  * border ; `flat` always renders the same muted, low-emphasis surface
98
98
  * regardless of `color` ; `raised` adds a drop shadow ; `ghost` has no
@@ -226,11 +226,7 @@ let EunomiaButton = class EunomiaButton extends ButtonMixin(CommandMixin(Disable
226
226
  const mainContent = html `
227
227
  <slot name="start">
228
228
  ${iconName
229
- ? html `<eun-icon
230
- class="auto-icon"
231
- name=${iconName}
232
- size="16"
233
- ></eun-icon>`
229
+ ? html `<eun-icon class="auto-icon" name=${iconName}></eun-icon>`
234
230
  : nothing}
235
231
  </slot>
236
232
  <slot @slotchange=${this.handleDefaultSlotChange}></slot>
package/dist/components/action/button/button.styles.js CHANGED
@@ -83,8 +83,8 @@ const base = css `
83
83
  }
84
84
  :host([size="s"]) {
85
85
  --_defaultFontSize: var(--eun-font-size-xs, 10px);
86
- --_defaultPaddingBlock: calc(var(--eun-space-s) / 2);
87
- --_defaultPaddingInline: var(--eun-space-s);
86
+ --_defaultPaddingBlock: calc(var(--eun-space-s, 8px) / 2);
87
+ --_defaultPaddingInline: var(--eun-space-s, 8px);
88
88
  --_defaultLineHeight: 10px;
89
89
  --_defaultBorderRadius: var(--eun-border-radius-s, 999px);
90
90
  }
@@ -243,7 +243,7 @@ const appearances = css `
243
243
  --_fg: var(--_onSolid);
244
244
  --_bd: transparent;
245
245
  }
246
- :host([appearance="default"]) {
246
+ :host([appearance="soft"]) {
247
247
  --_bg: var(--_tint);
248
248
  --_bg-hover: var(--_tint-hover);
249
249
  --_bg-active: var(--_tint-active);
package/dist/components/action/dropdown-button/dropdown-button.d.ts CHANGED
@@ -58,7 +58,7 @@ export type EunomiaDropdownPlacement = "top-start" | "top" | "top-end" | "right"
58
58
  * @prop {boolean} [fixedColor=false] - Keeps a light or dark trigger button white or black in every theme. Without it, they follow the grey scale, which flips with the active theme. Has no effect on the other colors
59
59
  * @attr {boolean} [fixed-color=false] - Keeps a light or dark trigger button white or black in every theme. Without it, they follow the grey scale, which flips with the active theme. Has no effect on the other colors
60
60
  * @prop {boolean} [rounded=false] - Whether the trigger button has fully rounded corners
61
- * @prop {'default' | 'fill' | 'outline' | 'flat' | 'raised' | 'ghost'} [appearance='default'] - The trigger button's surface style, using the same values as the button component. Defaults to a paler tint rather than a solid fill, since a menu trigger reads better as a lighter weight control than a standalone primary action
61
+ * @prop {'soft' | 'fill' | 'outline' | 'flat' | 'raised' | 'ghost'} [appearance='fill'] - The trigger button's surface style, using the same values as the button component
62
62
  * @prop {EunomiaDropdownPlacement} [placement='bottom-start'] - Where the menu opens relative to the trigger
63
63
  * @prop {boolean} [open=false] - Whether the menu is currently open. Read-only in practice (set from the menu's own native toggle handling), reflected as an attribute so a consumer's own CSS can select on it, e.g. to keep a hover-revealed trigger visible while its menu is open
64
64
  * @attr {string} aria-label - The accessible label for the trigger button, required when it has no visible label or slotted content, such as an icon only trigger
@@ -148,10 +148,8 @@ export declare class EunomiaDropdownButton extends LitElement implements Dropdow
148
148
  /**
149
149
  * The trigger button's surface treatment, forwarded to the trigger
150
150
  * `eun-button` — see its own `appearance` doc for the full list of
151
- * values. Defaults to `default` (a pale tinted wash) rather than
152
- * `eun-button`'s own `fill` default — a menu trigger reads better as a
153
- * lighter-weight control than a standalone primary action button.
154
- * @default default
151
+ * values.
152
+ * @default fill
155
153
  */
156
154
  appearance: EunomiaButtonAppearance;
157
155
  /**
@@ -332,7 +330,7 @@ export declare class EunomiaDropdownButton extends LitElement implements Dropdow
332
330
  * The key of a direct menu entry, whichever mechanism produced it : an
333
331
  * `options` entry's `<li>` carries it as `data-key` (see
334
332
  * {@link renderOption}) ; a `eun-dropdown-item` carries it as its own
335
- * `key` property.
333
+ * `value` property.
336
334
  *
337
335
  * @param entry the entry to read the key from.
338
336
  * @private