@ebay/skin 16.7.1 → 16.8.0-0

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 (143) hide show
  1. package/.storybook/preview-head.html +152 -11
  2. package/_cdn/skin/v16.8.0-0/skin-default.min.css +41 -0
  3. package/_cdn/skin/v16.8.0-0/skin-full.min.css +88 -0
  4. package/_cdn/skin/v16.8.0-0/skin-headless.min.css +6 -0
  5. package/_cdn/skin/v16.8.0-0/skin-legacy.min.css +41 -0
  6. package/dist/alert-dialog/alert-dialog.css +8 -10
  7. package/dist/avatar/avatar.css +9 -9
  8. package/dist/breadcrumbs/breadcrumbs.css +6 -6
  9. package/dist/button/button.css +10 -28
  10. package/dist/calendar/calendar.css +7 -7
  11. package/dist/carousel/carousel.css +10 -26
  12. package/dist/chip/chip.css +7 -7
  13. package/dist/combobox/combobox.css +6 -4
  14. package/dist/confirm-dialog/confirm-dialog.css +9 -11
  15. package/dist/cta-button/cta-button.css +8 -6
  16. package/dist/date-textbox/date-textbox.css +4 -4
  17. package/dist/details/details.css +3 -6
  18. package/dist/drawer-dialog/drawer-dialog.css +4 -3
  19. package/dist/field/field.css +5 -5
  20. package/dist/filter-button/filter-button.css +2 -2
  21. package/dist/filter-menu/filter-menu.css +2 -2
  22. package/dist/filter-menu-button/filter-menu-button.css +6 -9
  23. package/dist/floating-label/floating-label.css +1 -1
  24. package/dist/fullscreen-dialog/fullscreen-dialog.css +6 -5
  25. package/dist/global/global.css +2 -2
  26. package/dist/icon/icon.css +28 -0
  27. package/dist/infotip/infotip.css +5 -5
  28. package/dist/inline-notice/inline-notice.css +4 -6
  29. package/dist/legacy-textbox/legacy-textbox.css +1 -1
  30. package/dist/lightbox-dialog/lightbox-dialog.css +15 -17
  31. package/dist/listbox/listbox.css +3 -6
  32. package/dist/listbox-button/listbox-button.css +2 -5
  33. package/dist/menu/menu.css +2 -2
  34. package/dist/menu-button/menu-button.css +2 -2
  35. package/dist/mixins/typography-mixins.less +24 -24
  36. package/dist/mixins/utility-mixins.less +1 -0
  37. package/dist/page-grid/page-grid.css +5 -5
  38. package/dist/page-notice/page-notice.css +16 -21
  39. package/dist/pagination/pagination.css +9 -17
  40. package/dist/panel-dialog/panel-dialog.css +7 -6
  41. package/dist/progress-bar/progress-bar.css +2 -2
  42. package/dist/progress-stepper/progress-stepper.css +11 -14
  43. package/dist/section-notice/section-notice.css +17 -19
  44. package/dist/section-title/section-title.css +19 -20
  45. package/dist/segmented-buttons/segmented-buttons.css +11 -12
  46. package/dist/select/select.css +4 -4
  47. package/dist/signal/signal.css +2 -2
  48. package/dist/snackbar-dialog/snackbar-dialog.css +8 -14
  49. package/dist/svg/icon/icon-ai-spectrum-16-colored.svg +24 -0
  50. package/dist/svg/icon/icon-ai-spectrum-20-colored.svg +24 -0
  51. package/dist/svg/icon/icon-ai-spectrum-24-colored.svg +24 -0
  52. package/dist/svg/icon/icon-ai-spectrum-filled-16-colored.svg +22 -0
  53. package/dist/svg/icon/icon-ai-spectrum-filled-20-colored.svg +22 -0
  54. package/dist/svg/icon/icon-ai-spectrum-filled-24-colored.svg +22 -0
  55. package/dist/svg/icon/icon-ai-spectrum-thin-16-colored.svg +24 -0
  56. package/dist/svg/icon/icon-close-12.svg +3 -1
  57. package/dist/svg/icons.svg +150 -0
  58. package/dist/tabs/tabs.css +6 -10
  59. package/dist/textbox/textbox.css +12 -17
  60. package/dist/toast-dialog/toast-dialog.css +9 -10
  61. package/dist/toggle-button/toggle-button.css +17 -17
  62. package/dist/toggle-button-group/toggle-button-group.css +4 -4
  63. package/dist/tokens/evo-core.css +36 -0
  64. package/dist/tooltip/tooltip.css +5 -5
  65. package/dist/tourtip/tourtip.css +6 -6
  66. package/dist/typography/typography.css +23 -23
  67. package/dist/utility/utility.css +2 -0
  68. package/dist/variables/variables.less +6 -5
  69. package/dist/video/video.css +2 -5
  70. package/package.json +9 -9
  71. package/scripts/generate-images.js +18 -1
  72. package/src/less/alert-dialog/alert-dialog.less +6 -8
  73. package/src/less/avatar/avatar.less +9 -9
  74. package/src/less/breadcrumbs/breadcrumbs.less +6 -6
  75. package/src/less/button/button.less +5 -29
  76. package/src/less/calendar/calendar.less +7 -7
  77. package/src/less/carousel/carousel.less +6 -37
  78. package/src/less/chip/chip.less +7 -7
  79. package/src/less/combobox/combobox.less +6 -4
  80. package/src/less/confirm-dialog/confirm-dialog.less +7 -9
  81. package/src/less/cta-button/cta-button.less +4 -4
  82. package/src/less/date-textbox/date-textbox.less +5 -5
  83. package/src/less/details/details.less +2 -7
  84. package/src/less/drawer-dialog/drawer-dialog.less +1 -1
  85. package/src/less/field/field.less +4 -5
  86. package/src/less/filter-menu-button/filter-menu-button.less +1 -6
  87. package/src/less/floating-label/floating-label.less +1 -1
  88. package/src/less/global/global.less +2 -2
  89. package/src/less/icon/generated/icon.less +28 -0
  90. package/src/less/infotip/infotip.less +3 -3
  91. package/src/less/infotip/stories/infotip.stories.js +26 -0
  92. package/src/less/inline-notice/inline-notice.less +3 -9
  93. package/src/less/legacy-textbox/legacy-textbox.less +1 -1
  94. package/src/less/lightbox-dialog/lightbox-dialog.less +6 -10
  95. package/src/less/listbox/listbox.less +2 -7
  96. package/src/less/listbox-button/listbox-button.less +1 -6
  97. package/src/less/menu/menu.less +2 -2
  98. package/src/less/menu-button/menu-button.less +2 -2
  99. package/src/less/mixins/private/bubble-mixins.less +5 -4
  100. package/src/less/mixins/private/button-mixins.less +3 -3
  101. package/src/less/mixins/private/dialog-mixins.less +10 -10
  102. package/src/less/mixins/private/filter-button-mixins.less +2 -2
  103. package/src/less/mixins/private/filter-menu-mixins.less +1 -1
  104. package/src/less/mixins/public/typography-mixins.less +24 -24
  105. package/src/less/mixins/public/utility-mixins.less +1 -0
  106. package/src/less/page-notice/page-notice.less +14 -23
  107. package/src/less/pagination/pagination.less +7 -18
  108. package/src/less/panel-dialog/panel-dialog.less +1 -1
  109. package/src/less/progress-bar/progress-bar.less +2 -2
  110. package/src/less/progress-stepper/progress-stepper.less +8 -14
  111. package/src/less/section-notice/section-notice.less +15 -20
  112. package/src/less/section-title/section-title.less +10 -12
  113. package/src/less/segmented-buttons/segmented-buttons.less +6 -15
  114. package/src/less/select/select.less +4 -4
  115. package/src/less/signal/signal.less +2 -2
  116. package/src/less/snackbar-dialog/snackbar-dialog.less +6 -16
  117. package/src/less/tabs/tabs.less +5 -15
  118. package/src/less/textbox/stories/rtl/textbox.stories.js +1 -1
  119. package/src/less/textbox/stories/textbox.stories.js +1 -1
  120. package/src/less/textbox/textbox.less +14 -18
  121. package/src/less/toast-dialog/toast-dialog.less +8 -13
  122. package/src/less/toggle-button/toggle-button.less +17 -17
  123. package/src/less/toggle-button-group/toggle-button-group.less +4 -4
  124. package/src/less/tooltip/tooltip.less +1 -1
  125. package/src/less/tourtip/tourtip.less +3 -3
  126. package/src/less/typography/typography.less +2 -2
  127. package/src/less/variables/variables.less +6 -5
  128. package/src/less/video/video.less +1 -8
  129. package/src/svg/icon/icon-ai-spectrum-16-colored.svg +24 -0
  130. package/src/svg/icon/icon-ai-spectrum-20-colored.svg +24 -0
  131. package/src/svg/icon/icon-ai-spectrum-24-colored.svg +24 -0
  132. package/src/svg/icon/icon-ai-spectrum-filled-16-colored.svg +22 -0
  133. package/src/svg/icon/icon-ai-spectrum-filled-20-colored.svg +22 -0
  134. package/src/svg/icon/icon-ai-spectrum-filled-24-colored.svg +22 -0
  135. package/src/svg/icon/icon-ai-spectrum-thin-16-colored.svg +24 -0
  136. package/src/svg/icon/icon-close-12.svg +3 -1
  137. package/src/svg/icons.svg +150 -0
  138. package/src/tokens/evo-core.css +36 -0
  139. package/svg.svg +150 -0
  140. package/_cdn/skin/v16.7.1/skin-default.min.css +0 -41
  141. package/_cdn/skin/v16.7.1/skin-full.min.css +0 -88
  142. package/_cdn/skin/v16.7.1/skin-headless.min.css +0 -6
  143. package/_cdn/skin/v16.7.1/skin-legacy.min.css +0 -41
package/src/svg/icon/icon-ai-spectrum-filled-20-colored.svg ADDED
@@ -0,0 +1,22 @@
1
+ <svg viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg">
2
+ <path
3
+ d="M11.013 1.819c-.234-1.092-1.792-1.092-2.026 0L8.306 4.99A4.317 4.317 0 0 1 4.99 8.306l-3.172.681c-1.092.234-1.092 1.792 0 2.026l3.172.681a4.317 4.317 0 0 1 3.315 3.315l.681 3.172c.234 1.092 1.792 1.092 2.026 0l.681-3.172a4.317 4.317 0 0 1 3.315-3.315l3.172-.681c1.092-.234 1.092-1.792 0-2.026l-3.172-.681a4.317 4.317 0 0 1-3.315-3.315l-.681-3.172Z"
4
+ fill="url(#ref-ai-spectrum-filled-20-colored)"
5
+ />
6
+ <defs>
7
+ <linearGradient
8
+ id="ref-ai-spectrum-filled-20-colored"
9
+ x1="26.984"
10
+ y1="14.065"
11
+ x2="14.21"
12
+ y2="27.71"
13
+ gradientUnits="userSpaceOnUse"
14
+ >
15
+ <stop offset=".098" stop-color="#FFD80E" />
16
+ <stop offset=".267" stop-color="#FF4242" />
17
+ <stop offset=".418" stop-color="#993EE0" />
18
+ <stop offset=".562" stop-color="#0968F6" />
19
+ <stop offset=".785" stop-color="#4EE04B" />
20
+ </linearGradient>
21
+ </defs>
22
+ </svg>
package/src/svg/icon/icon-ai-spectrum-filled-24-colored.svg ADDED
@@ -0,0 +1,22 @@
1
+ <svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg">
2
+ <path
3
+ d="M13.238 2c-.286-1.333-2.19-1.334-2.476 0l-.833 3.878a5.277 5.277 0 0 1-4.051 4.051L2 10.762c-1.334.286-1.335 2.19 0 2.476l3.877.833a5.277 5.277 0 0 1 4.051 4.051L10.762 22c.286 1.334 2.19 1.334 2.476 0l.833-3.878a5.277 5.277 0 0 1 4.051-4.051L22 13.238c1.334-.286 1.334-2.19 0-2.476l-3.878-.833a5.277 5.277 0 0 1-4.051-4.051L13.238 2Z"
4
+ fill="url(#ref-ai-spectrum-filled-24-colored)"
5
+ />
6
+ <defs>
7
+ <linearGradient
8
+ id="ref-ai-spectrum-filled-24-colored"
9
+ x1="32.758"
10
+ y1="16.968"
11
+ x2="17.145"
12
+ y2="33.645"
13
+ gradientUnits="userSpaceOnUse"
14
+ >
15
+ <stop offset=".098" stop-color="#FFD80E" />
16
+ <stop offset=".267" stop-color="#FF4242" />
17
+ <stop offset=".418" stop-color="#993EE0" />
18
+ <stop offset=".562" stop-color="#0968F6" />
19
+ <stop offset=".785" stop-color="#4EE04B" />
20
+ </linearGradient>
21
+ </defs>
22
+ </svg>
package/src/svg/icon/icon-ai-spectrum-thin-16-colored.svg ADDED
@@ -0,0 +1,24 @@
1
+ <svg viewBox="0 0 16 16" xmlns="http://www.w3.org/2000/svg">
2
+ <path
3
+ fill-rule="evenodd"
4
+ clip-rule="evenodd"
5
+ d="M8 4.959A4.86 4.86 0 0 1 4.959 8 4.859 4.859 0 0 1 8 11.041 4.859 4.859 0 0 1 11.041 8 4.859 4.859 0 0 1 8 4.959Zm.788-3.322c-.182-.85-1.394-.85-1.576 0l-.53 2.467a3.358 3.358 0 0 1-2.578 2.578l-2.467.53c-.85.182-.85 1.394 0 1.576l2.467.53a3.358 3.358 0 0 1 2.578 2.578l.53 2.467c.182.85 1.394.85 1.576 0l.53-2.467a3.358 3.358 0 0 1 2.578-2.578l2.467-.53c.85-.182.85-1.394 0-1.576l-2.467-.53a3.358 3.358 0 0 1-2.578-2.578l-.53-2.467Z"
6
+ fill="url(#ref-ai-spectrum-thin-16-colored)"
7
+ />
8
+ <defs>
9
+ <linearGradient
10
+ id="ref-ai-spectrum-thin-16-colored"
11
+ x1="21.21"
12
+ y1="11.161"
13
+ x2="11.274"
14
+ y2="21.774"
15
+ gradientUnits="userSpaceOnUse"
16
+ >
17
+ <stop offset=".098" stop-color="#FFD80E" />
18
+ <stop offset=".267" stop-color="#FF4242" />
19
+ <stop offset=".418" stop-color="#993EE0" />
20
+ <stop offset=".562" stop-color="#0968F6" />
21
+ <stop offset=".785" stop-color="#4EE04B" />
22
+ </linearGradient>
23
+ </defs>
24
+ </svg>
package/src/svg/icon/icon-close-12.svg CHANGED
@@ -1,3 +1,5 @@
1
1
  <svg viewBox="0 0 13 12" xmlns="http://www.w3.org/2000/svg">
2
- <path d="M2.78033 1.21967C2.48744 0.926777 2.01256 0.926777 1.71967 1.21967C1.42678 1.51256 1.42678 1.98744 1.71967 2.28033L5.43934 6L1.71967 9.71967C1.42678 10.0126 1.42678 10.4874 1.71967 10.7803C2.01256 11.0732 2.48744 11.0732 2.78033 10.7803L6.5 7.06066L10.2197 10.7803C10.5126 11.0732 10.9874 11.0732 11.2803 10.7803C11.5732 10.4874 11.5732 10.0126 11.2803 9.71967L7.56066 6L11.2803 2.28033C11.5732 1.98744 11.5732 1.51256 11.2803 1.21967C10.9874 0.926777 10.5126 0.926777 10.2197 1.21967L6.5 4.93934L2.78033 1.21967Z" />
2
+ <path
3
+ d="M2.78033 1.21967C2.48744 0.926777 2.01256 0.926777 1.71967 1.21967C1.42678 1.51256 1.42678 1.98744 1.71967 2.28033L5.43934 6L1.71967 9.71967C1.42678 10.0126 1.42678 10.4874 1.71967 10.7803C2.01256 11.0732 2.48744 11.0732 2.78033 10.7803L6.5 7.06066L10.2197 10.7803C10.5126 11.0732 10.9874 11.0732 11.2803 10.7803C11.5732 10.4874 11.5732 10.0126 11.2803 9.71967L7.56066 6L11.2803 2.28033C11.5732 1.98744 11.5732 1.51256 11.2803 1.21967C10.9874 0.926777 10.5126 0.926777 10.2197 1.21967L6.5 4.93934L2.78033 1.21967Z"
4
+ />
3
5
  </svg>
package/src/svg/icons.svg CHANGED
@@ -1,5 +1,105 @@
1
1
  <?xml version="1.0" encoding="utf-8"?>
2
2
  <svg xmlns="http://www.w3.org/2000/svg">
3
+ <defs>
4
+ <linearGradient
5
+ id="ref-ai-spectrum-16-colored"
6
+ x1="21.21"
7
+ y1="11.161"
8
+ x2="11.274"
9
+ y2="21.774"
10
+ gradientUnits="userSpaceOnUse"
11
+ >
12
+ <stop offset=".098" stop-color="#FFD80E" />
13
+ <stop offset=".267" stop-color="#FF4242" />
14
+ <stop offset=".418" stop-color="#993EE0" />
15
+ <stop offset=".562" stop-color="#0968F6" />
16
+ <stop offset=".785" stop-color="#4EE04B" />
17
+ </linearGradient>
18
+ <linearGradient
19
+ id="ref-ai-spectrum-thin-16-colored"
20
+ x1="21.21"
21
+ y1="11.161"
22
+ x2="11.274"
23
+ y2="21.774"
24
+ gradientUnits="userSpaceOnUse"
25
+ >
26
+ <stop offset=".098" stop-color="#FFD80E" />
27
+ <stop offset=".267" stop-color="#FF4242" />
28
+ <stop offset=".418" stop-color="#993EE0" />
29
+ <stop offset=".562" stop-color="#0968F6" />
30
+ <stop offset=".785" stop-color="#4EE04B" />
31
+ </linearGradient>
32
+ <linearGradient
33
+ id="ref-ai-spectrum-filled-16-colored"
34
+ x1="21.21"
35
+ y1="11.161"
36
+ x2="11.274"
37
+ y2="21.774"
38
+ gradientUnits="userSpaceOnUse"
39
+ >
40
+ <stop offset=".098" stop-color="#FFD80E" />
41
+ <stop offset=".267" stop-color="#FF4242" />
42
+ <stop offset=".418" stop-color="#993EE0" />
43
+ <stop offset=".562" stop-color="#0968F6" />
44
+ <stop offset=".785" stop-color="#4EE04B" />
45
+ </linearGradient>
46
+ <linearGradient
47
+ id="ref-ai-spectrum-filled-24-colored"
48
+ x1="32.758"
49
+ y1="16.968"
50
+ x2="17.145"
51
+ y2="33.645"
52
+ gradientUnits="userSpaceOnUse"
53
+ >
54
+ <stop offset=".098" stop-color="#FFD80E" />
55
+ <stop offset=".267" stop-color="#FF4242" />
56
+ <stop offset=".418" stop-color="#993EE0" />
57
+ <stop offset=".562" stop-color="#0968F6" />
58
+ <stop offset=".785" stop-color="#4EE04B" />
59
+ </linearGradient>
60
+ <linearGradient
61
+ id="ref-ai-spectrum-24-colored"
62
+ x1="32.758"
63
+ y1="16.968"
64
+ x2="17.145"
65
+ y2="33.645"
66
+ gradientUnits="userSpaceOnUse"
67
+ >
68
+ <stop offset=".098" stop-color="#FFD80E" />
69
+ <stop offset=".267" stop-color="#FF4242" />
70
+ <stop offset=".418" stop-color="#993EE0" />
71
+ <stop offset=".562" stop-color="#0968F6" />
72
+ <stop offset=".785" stop-color="#4EE04B" />
73
+ </linearGradient>
74
+ <linearGradient
75
+ id="ref-ai-spectrum-20-colored"
76
+ x1="26.984"
77
+ y1="14.065"
78
+ x2="14.21"
79
+ y2="27.71"
80
+ gradientUnits="userSpaceOnUse"
81
+ >
82
+ <stop offset=".098" stop-color="#FFD80E" />
83
+ <stop offset=".267" stop-color="#FF4242" />
84
+ <stop offset=".418" stop-color="#993EE0" />
85
+ <stop offset=".562" stop-color="#0968F6" />
86
+ <stop offset=".785" stop-color="#4EE04B" />
87
+ </linearGradient>
88
+ <linearGradient
89
+ id="ref-ai-spectrum-filled-20-colored"
90
+ x1="26.984"
91
+ y1="14.065"
92
+ x2="14.21"
93
+ y2="27.71"
94
+ gradientUnits="userSpaceOnUse"
95
+ >
96
+ <stop offset=".098" stop-color="#FFD80E" />
97
+ <stop offset=".267" stop-color="#FF4242" />
98
+ <stop offset=".418" stop-color="#993EE0" />
99
+ <stop offset=".562" stop-color="#0968F6" />
100
+ <stop offset=".785" stop-color="#4EE04B" />
101
+ </linearGradient>
102
+ </defs>
3
103
  <symbol viewBox="0 0 16 16" id="icon-add-16">
4
104
  <path
5
105
  d="M14 7H9V2a1 1 0 0 0-2 0v5H2a1 1 0 0 0 0 2h5v5a1 1 0 1 0 2 0V9h5a1 1 0 1 0 0-2Z"
@@ -123,6 +223,56 @@
123
223
  d="M10.762 2c.286-1.333 2.19-1.334 2.476 0l.833 3.878a5.277 5.277 0 0 0 4.051 4.051l3.878.833c1.334.286 1.334 2.19 0 2.476l-3.878.833a5.277 5.277 0 0 0-4.051 4.051L13.238 22c-.286 1.334-2.19 1.334-2.476 0l-.833-3.878a5.277 5.277 0 0 0-4.051-4.051L2 13.238c-1.334-.286-1.335-2.19 0-2.476l3.877-.833a5.277 5.277 0 0 0 4.051-4.051L10.762 2Z"
124
224
  />
125
225
  </symbol>
226
+ <symbol viewBox="0 0 16 16" id="icon-ai-spectrum-16-colored">
227
+ <path
228
+ fill-rule="evenodd"
229
+ clip-rule="evenodd"
230
+ d="M6.682 4.104a3.358 3.358 0 0 1-2.578 2.578l-2.467.53c-.85.182-.85 1.394 0 1.576l2.467.53a3.358 3.358 0 0 1 2.578 2.578l.53 2.467c.182.85 1.394.85 1.576 0l.53-2.467a3.358 3.358 0 0 1 2.578-2.578l2.467-.53c.85-.182.85-1.394 0-1.576l-2.467-.53a3.358 3.358 0 0 1-2.578-2.578l-.53-2.467c-.182-.85-1.394-.85-1.576 0l-.53 2.467ZM8 6.145A5.364 5.364 0 0 1 6.145 8 5.364 5.364 0 0 1 8 9.855 5.364 5.364 0 0 1 9.855 8 5.364 5.364 0 0 1 8 6.145Z"
231
+ fill="url(#ref-ai-spectrum-16-colored)"
232
+ />
233
+ </symbol>
234
+ <symbol viewBox="0 0 20 20" id="icon-ai-spectrum-20-colored">
235
+ <path
236
+ fill-rule="evenodd"
237
+ clip-rule="evenodd"
238
+ d="M10 6.303A6.32 6.32 0 0 1 6.303 10 6.32 6.32 0 0 1 10 13.697 6.32 6.32 0 0 1 13.697 10 6.32 6.32 0 0 1 10 6.303Zm1.013-4.484c-.234-1.092-1.792-1.092-2.026 0L8.306 4.99A4.317 4.317 0 0 1 4.99 8.306l-3.172.681c-1.092.234-1.092 1.792 0 2.026l3.172.681a4.317 4.317 0 0 1 3.315 3.315l.681 3.172c.234 1.092 1.792 1.092 2.026 0l.681-3.172a4.317 4.317 0 0 1 3.315-3.315l3.172-.681c1.092-.234 1.092-1.792 0-2.026l-3.172-.681a4.317 4.317 0 0 1-3.315-3.315l-.681-3.172Z"
239
+ fill="url(#ref-ai-spectrum-20-colored)"
240
+ />
241
+ </symbol>
242
+ <symbol viewBox="0 0 24 24" id="icon-ai-spectrum-24-colored">
243
+ <path
244
+ fill-rule="evenodd"
245
+ clip-rule="evenodd"
246
+ d="m12 5.76-.115.538a7.276 7.276 0 0 1-5.587 5.587L5.76 12l.537.115a7.276 7.276 0 0 1 5.587 5.587l.115.537.115-.537a7.276 7.276 0 0 1 5.587-5.587L18.24 12l-.537-.115a7.276 7.276 0 0 1-5.587-5.587L12 5.76ZM13.238 2c-.286-1.334-2.19-1.333-2.476 0l-.833 3.878a5.277 5.277 0 0 1-4.051 4.051L2 10.762c-1.335.286-1.334 2.19 0 2.476l3.877.833a5.277 5.277 0 0 1 4.051 4.051L10.762 22c.286 1.334 2.19 1.334 2.476 0l.833-3.878a5.277 5.277 0 0 1 4.051-4.051L22 13.238c1.334-.286 1.334-2.19 0-2.476l-3.878-.833a5.277 5.277 0 0 1-4.051-4.051L13.238 2Z"
247
+ fill="url(#ref-ai-spectrum-24-colored)"
248
+ />
249
+ </symbol>
250
+ <symbol viewBox="0 0 16 16" id="icon-ai-spectrum-filled-16-colored">
251
+ <path
252
+ d="M8.788 1.637c-.182-.85-1.394-.85-1.576 0l-.53 2.467a3.358 3.358 0 0 1-2.578 2.578l-2.467.53c-.85.182-.85 1.394 0 1.576l2.467.53a3.358 3.358 0 0 1 2.578 2.578l.53 2.467c.182.85 1.394.85 1.576 0l.53-2.467a3.358 3.358 0 0 1 2.578-2.578l2.467-.53c.85-.182.85-1.394 0-1.576l-2.467-.53a3.358 3.358 0 0 1-2.578-2.578l-.53-2.467Z"
253
+ fill="url(#ref-ai-spectrum-filled-16-colored)"
254
+ />
255
+ </symbol>
256
+ <symbol viewBox="0 0 20 20" id="icon-ai-spectrum-filled-20-colored">
257
+ <path
258
+ d="M11.013 1.819c-.234-1.092-1.792-1.092-2.026 0L8.306 4.99A4.317 4.317 0 0 1 4.99 8.306l-3.172.681c-1.092.234-1.092 1.792 0 2.026l3.172.681a4.317 4.317 0 0 1 3.315 3.315l.681 3.172c.234 1.092 1.792 1.092 2.026 0l.681-3.172a4.317 4.317 0 0 1 3.315-3.315l3.172-.681c1.092-.234 1.092-1.792 0-2.026l-3.172-.681a4.317 4.317 0 0 1-3.315-3.315l-.681-3.172Z"
259
+ fill="url(#ref-ai-spectrum-filled-20-colored)"
260
+ />
261
+ </symbol>
262
+ <symbol viewBox="0 0 24 24" id="icon-ai-spectrum-filled-24-colored">
263
+ <path
264
+ d="M13.238 2c-.286-1.333-2.19-1.334-2.476 0l-.833 3.878a5.277 5.277 0 0 1-4.051 4.051L2 10.762c-1.334.286-1.335 2.19 0 2.476l3.877.833a5.277 5.277 0 0 1 4.051 4.051L10.762 22c.286 1.334 2.19 1.334 2.476 0l.833-3.878a5.277 5.277 0 0 1 4.051-4.051L22 13.238c1.334-.286 1.334-2.19 0-2.476l-3.878-.833a5.277 5.277 0 0 1-4.051-4.051L13.238 2Z"
265
+ fill="url(#ref-ai-spectrum-filled-24-colored)"
266
+ />
267
+ </symbol>
268
+ <symbol viewBox="0 0 16 16" id="icon-ai-spectrum-thin-16-colored">
269
+ <path
270
+ fill-rule="evenodd"
271
+ clip-rule="evenodd"
272
+ d="M8 4.959A4.86 4.86 0 0 1 4.959 8 4.859 4.859 0 0 1 8 11.041 4.859 4.859 0 0 1 11.041 8 4.859 4.859 0 0 1 8 4.959Zm.788-3.322c-.182-.85-1.394-.85-1.576 0l-.53 2.467a3.358 3.358 0 0 1-2.578 2.578l-2.467.53c-.85.182-.85 1.394 0 1.576l2.467.53a3.358 3.358 0 0 1 2.578 2.578l.53 2.467c.182.85 1.394.85 1.576 0l.53-2.467a3.358 3.358 0 0 1 2.578-2.578l2.467-.53c.85-.182.85-1.394 0-1.576l-2.467-.53a3.358 3.358 0 0 1-2.578-2.578l-.53-2.467Z"
273
+ fill="url(#ref-ai-spectrum-thin-16-colored)"
274
+ />
275
+ </symbol>
126
276
  <symbol viewBox="0 0 16 16" id="icon-ai-thin-16">
127
277
  <path
128
278
  fill-rule="evenodd"
package/src/tokens/evo-core.css CHANGED
@@ -86,4 +86,40 @@
86
86
  --opacity-100: 0.08;
87
87
  --opacity-150: 0.12;
88
88
  --opacity-200: 0.16;
89
+ --font-size-10: 0.625rem;
90
+ --font-size-12: 0.75rem;
91
+ --font-size-14: 0.875rem;
92
+ --font-size-16: 1rem;
93
+ --font-size-18: 1.125rem;
94
+ --font-size-20: 1.25rem;
95
+ --font-size-24: 1.5rem;
96
+ --font-size-30: 1.875rem;
97
+ --font-size-36: 2.25rem;
98
+ --font-size-46: 2.875rem;
99
+ --font-size-64: 4rem;
100
+ --font-size-smallest: var(--font-size-10);
101
+ --font-size-small: var(--font-size-12);
102
+ --font-size-default: var(--font-size-14);
103
+ --font-size-medium: var(--font-size-16);
104
+ --font-size-large-1: var(--font-size-20);
105
+ --font-size-large-2: var(--font-size-24);
106
+ --font-size-giant-1: var(--font-size-30);
107
+ --font-size-giant-2: var(--font-size-36);
108
+ --font-size-giant-3: var(--font-size-46);
109
+ --font-size-giant-4: var(--font-size-64);
110
+ --font-weight-regular: 500;
111
+ --font-weight-bold: 700;
112
+ --spacing-25: 2px;
113
+ --spacing-50: 4px;
114
+ --spacing-75: 6px;
115
+ --spacing-100: 8px;
116
+ --spacing-125: 10px;
117
+ --spacing-150: 12px;
118
+ --spacing-200: 16px;
119
+ --spacing-250: 20px;
120
+ --spacing-300: 24px;
121
+ --spacing-400: 32px;
122
+ --spacing-450: 36px;
123
+ --spacing-600: 48px;
124
+ --spacing-800: 64px;
89
125
  }
package/svg.svg CHANGED
@@ -1,5 +1,105 @@
1
1
  <?xml version="1.0" encoding="utf-8"?>
2
2
  <svg xmlns="http://www.w3.org/2000/svg">
3
+ <defs>
4
+ <linearGradient
5
+ id="ref-ai-spectrum-16-colored"
6
+ x1="21.21"
7
+ y1="11.161"
8
+ x2="11.274"
9
+ y2="21.774"
10
+ gradientUnits="userSpaceOnUse"
11
+ >
12
+ <stop offset=".098" stop-color="#FFD80E" />
13
+ <stop offset=".267" stop-color="#FF4242" />
14
+ <stop offset=".418" stop-color="#993EE0" />
15
+ <stop offset=".562" stop-color="#0968F6" />
16
+ <stop offset=".785" stop-color="#4EE04B" />
17
+ </linearGradient>
18
+ <linearGradient
19
+ id="ref-ai-spectrum-thin-16-colored"
20
+ x1="21.21"
21
+ y1="11.161"
22
+ x2="11.274"
23
+ y2="21.774"
24
+ gradientUnits="userSpaceOnUse"
25
+ >
26
+ <stop offset=".098" stop-color="#FFD80E" />
27
+ <stop offset=".267" stop-color="#FF4242" />
28
+ <stop offset=".418" stop-color="#993EE0" />
29
+ <stop offset=".562" stop-color="#0968F6" />
30
+ <stop offset=".785" stop-color="#4EE04B" />
31
+ </linearGradient>
32
+ <linearGradient
33
+ id="ref-ai-spectrum-filled-16-colored"
34
+ x1="21.21"
35
+ y1="11.161"
36
+ x2="11.274"
37
+ y2="21.774"
38
+ gradientUnits="userSpaceOnUse"
39
+ >
40
+ <stop offset=".098" stop-color="#FFD80E" />
41
+ <stop offset=".267" stop-color="#FF4242" />
42
+ <stop offset=".418" stop-color="#993EE0" />
43
+ <stop offset=".562" stop-color="#0968F6" />
44
+ <stop offset=".785" stop-color="#4EE04B" />
45
+ </linearGradient>
46
+ <linearGradient
47
+ id="ref-ai-spectrum-filled-24-colored"
48
+ x1="32.758"
49
+ y1="16.968"
50
+ x2="17.145"
51
+ y2="33.645"
52
+ gradientUnits="userSpaceOnUse"
53
+ >
54
+ <stop offset=".098" stop-color="#FFD80E" />
55
+ <stop offset=".267" stop-color="#FF4242" />
56
+ <stop offset=".418" stop-color="#993EE0" />
57
+ <stop offset=".562" stop-color="#0968F6" />
58
+ <stop offset=".785" stop-color="#4EE04B" />
59
+ </linearGradient>
60
+ <linearGradient
61
+ id="ref-ai-spectrum-24-colored"
62
+ x1="32.758"
63
+ y1="16.968"
64
+ x2="17.145"
65
+ y2="33.645"
66
+ gradientUnits="userSpaceOnUse"
67
+ >
68
+ <stop offset=".098" stop-color="#FFD80E" />
69
+ <stop offset=".267" stop-color="#FF4242" />
70
+ <stop offset=".418" stop-color="#993EE0" />
71
+ <stop offset=".562" stop-color="#0968F6" />
72
+ <stop offset=".785" stop-color="#4EE04B" />
73
+ </linearGradient>
74
+ <linearGradient
75
+ id="ref-ai-spectrum-20-colored"
76
+ x1="26.984"
77
+ y1="14.065"
78
+ x2="14.21"
79
+ y2="27.71"
80
+ gradientUnits="userSpaceOnUse"
81
+ >
82
+ <stop offset=".098" stop-color="#FFD80E" />
83
+ <stop offset=".267" stop-color="#FF4242" />
84
+ <stop offset=".418" stop-color="#993EE0" />
85
+ <stop offset=".562" stop-color="#0968F6" />
86
+ <stop offset=".785" stop-color="#4EE04B" />
87
+ </linearGradient>
88
+ <linearGradient
89
+ id="ref-ai-spectrum-filled-20-colored"
90
+ x1="26.984"
91
+ y1="14.065"
92
+ x2="14.21"
93
+ y2="27.71"
94
+ gradientUnits="userSpaceOnUse"
95
+ >
96
+ <stop offset=".098" stop-color="#FFD80E" />
97
+ <stop offset=".267" stop-color="#FF4242" />
98
+ <stop offset=".418" stop-color="#993EE0" />
99
+ <stop offset=".562" stop-color="#0968F6" />
100
+ <stop offset=".785" stop-color="#4EE04B" />
101
+ </linearGradient>
102
+ </defs>
3
103
  <symbol viewBox="0 0 16 16" id="icon-add-16">
4
104
  <path
5
105
  d="M14 7H9V2a1 1 0 0 0-2 0v5H2a1 1 0 0 0 0 2h5v5a1 1 0 1 0 2 0V9h5a1 1 0 1 0 0-2Z"
@@ -123,6 +223,56 @@
123
223
  d="M10.762 2c.286-1.333 2.19-1.334 2.476 0l.833 3.878a5.277 5.277 0 0 0 4.051 4.051l3.878.833c1.334.286 1.334 2.19 0 2.476l-3.878.833a5.277 5.277 0 0 0-4.051 4.051L13.238 22c-.286 1.334-2.19 1.334-2.476 0l-.833-3.878a5.277 5.277 0 0 0-4.051-4.051L2 13.238c-1.334-.286-1.335-2.19 0-2.476l3.877-.833a5.277 5.277 0 0 0 4.051-4.051L10.762 2Z"
124
224
  />
125
225
  </symbol>
226
+ <symbol viewBox="0 0 16 16" id="icon-ai-spectrum-16-colored">
227
+ <path
228
+ fill-rule="evenodd"
229
+ clip-rule="evenodd"
230
+ d="M6.682 4.104a3.358 3.358 0 0 1-2.578 2.578l-2.467.53c-.85.182-.85 1.394 0 1.576l2.467.53a3.358 3.358 0 0 1 2.578 2.578l.53 2.467c.182.85 1.394.85 1.576 0l.53-2.467a3.358 3.358 0 0 1 2.578-2.578l2.467-.53c.85-.182.85-1.394 0-1.576l-2.467-.53a3.358 3.358 0 0 1-2.578-2.578l-.53-2.467c-.182-.85-1.394-.85-1.576 0l-.53 2.467ZM8 6.145A5.364 5.364 0 0 1 6.145 8 5.364 5.364 0 0 1 8 9.855 5.364 5.364 0 0 1 9.855 8 5.364 5.364 0 0 1 8 6.145Z"
231
+ fill="url(#ref-ai-spectrum-16-colored)"
232
+ />
233
+ </symbol>
234
+ <symbol viewBox="0 0 20 20" id="icon-ai-spectrum-20-colored">
235
+ <path
236
+ fill-rule="evenodd"
237
+ clip-rule="evenodd"
238
+ d="M10 6.303A6.32 6.32 0 0 1 6.303 10 6.32 6.32 0 0 1 10 13.697 6.32 6.32 0 0 1 13.697 10 6.32 6.32 0 0 1 10 6.303Zm1.013-4.484c-.234-1.092-1.792-1.092-2.026 0L8.306 4.99A4.317 4.317 0 0 1 4.99 8.306l-3.172.681c-1.092.234-1.092 1.792 0 2.026l3.172.681a4.317 4.317 0 0 1 3.315 3.315l.681 3.172c.234 1.092 1.792 1.092 2.026 0l.681-3.172a4.317 4.317 0 0 1 3.315-3.315l3.172-.681c1.092-.234 1.092-1.792 0-2.026l-3.172-.681a4.317 4.317 0 0 1-3.315-3.315l-.681-3.172Z"
239
+ fill="url(#ref-ai-spectrum-20-colored)"
240
+ />
241
+ </symbol>
242
+ <symbol viewBox="0 0 24 24" id="icon-ai-spectrum-24-colored">
243
+ <path
244
+ fill-rule="evenodd"
245
+ clip-rule="evenodd"
246
+ d="m12 5.76-.115.538a7.276 7.276 0 0 1-5.587 5.587L5.76 12l.537.115a7.276 7.276 0 0 1 5.587 5.587l.115.537.115-.537a7.276 7.276 0 0 1 5.587-5.587L18.24 12l-.537-.115a7.276 7.276 0 0 1-5.587-5.587L12 5.76ZM13.238 2c-.286-1.334-2.19-1.333-2.476 0l-.833 3.878a5.277 5.277 0 0 1-4.051 4.051L2 10.762c-1.335.286-1.334 2.19 0 2.476l3.877.833a5.277 5.277 0 0 1 4.051 4.051L10.762 22c.286 1.334 2.19 1.334 2.476 0l.833-3.878a5.277 5.277 0 0 1 4.051-4.051L22 13.238c1.334-.286 1.334-2.19 0-2.476l-3.878-.833a5.277 5.277 0 0 1-4.051-4.051L13.238 2Z"
247
+ fill="url(#ref-ai-spectrum-24-colored)"
248
+ />
249
+ </symbol>
250
+ <symbol viewBox="0 0 16 16" id="icon-ai-spectrum-filled-16-colored">
251
+ <path
252
+ d="M8.788 1.637c-.182-.85-1.394-.85-1.576 0l-.53 2.467a3.358 3.358 0 0 1-2.578 2.578l-2.467.53c-.85.182-.85 1.394 0 1.576l2.467.53a3.358 3.358 0 0 1 2.578 2.578l.53 2.467c.182.85 1.394.85 1.576 0l.53-2.467a3.358 3.358 0 0 1 2.578-2.578l2.467-.53c.85-.182.85-1.394 0-1.576l-2.467-.53a3.358 3.358 0 0 1-2.578-2.578l-.53-2.467Z"
253
+ fill="url(#ref-ai-spectrum-filled-16-colored)"
254
+ />
255
+ </symbol>
256
+ <symbol viewBox="0 0 20 20" id="icon-ai-spectrum-filled-20-colored">
257
+ <path
258
+ d="M11.013 1.819c-.234-1.092-1.792-1.092-2.026 0L8.306 4.99A4.317 4.317 0 0 1 4.99 8.306l-3.172.681c-1.092.234-1.092 1.792 0 2.026l3.172.681a4.317 4.317 0 0 1 3.315 3.315l.681 3.172c.234 1.092 1.792 1.092 2.026 0l.681-3.172a4.317 4.317 0 0 1 3.315-3.315l3.172-.681c1.092-.234 1.092-1.792 0-2.026l-3.172-.681a4.317 4.317 0 0 1-3.315-3.315l-.681-3.172Z"
259
+ fill="url(#ref-ai-spectrum-filled-20-colored)"
260
+ />
261
+ </symbol>
262
+ <symbol viewBox="0 0 24 24" id="icon-ai-spectrum-filled-24-colored">
263
+ <path
264
+ d="M13.238 2c-.286-1.333-2.19-1.334-2.476 0l-.833 3.878a5.277 5.277 0 0 1-4.051 4.051L2 10.762c-1.334.286-1.335 2.19 0 2.476l3.877.833a5.277 5.277 0 0 1 4.051 4.051L10.762 22c.286 1.334 2.19 1.334 2.476 0l.833-3.878a5.277 5.277 0 0 1 4.051-4.051L22 13.238c1.334-.286 1.334-2.19 0-2.476l-3.878-.833a5.277 5.277 0 0 1-4.051-4.051L13.238 2Z"
265
+ fill="url(#ref-ai-spectrum-filled-24-colored)"
266
+ />
267
+ </symbol>
268
+ <symbol viewBox="0 0 16 16" id="icon-ai-spectrum-thin-16-colored">
269
+ <path
270
+ fill-rule="evenodd"
271
+ clip-rule="evenodd"
272
+ d="M8 4.959A4.86 4.86 0 0 1 4.959 8 4.859 4.859 0 0 1 8 11.041 4.859 4.859 0 0 1 11.041 8 4.859 4.859 0 0 1 8 4.959Zm.788-3.322c-.182-.85-1.394-.85-1.576 0l-.53 2.467a3.358 3.358 0 0 1-2.578 2.578l-2.467.53c-.85.182-.85 1.394 0 1.576l2.467.53a3.358 3.358 0 0 1 2.578 2.578l.53 2.467c.182.85 1.394.85 1.576 0l.53-2.467a3.358 3.358 0 0 1 2.578-2.578l2.467-.53c.85-.182.85-1.394 0-1.576l-2.467-.53a3.358 3.358 0 0 1-2.578-2.578l-.53-2.467Z"
273
+ fill="url(#ref-ai-spectrum-thin-16-colored)"
274
+ />
275
+ </symbol>
126
276
  <symbol viewBox="0 0 16 16" id="icon-ai-thin-16">
127
277
  <path
128
278
  fill-rule="evenodd"