amis 1.3.5-beta.6 → 1.4.2-beta.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (352) hide show
  1. package/README.md +1 -1
  2. package/lib/Schema.d.ts +17 -0
  3. package/lib/Schema.js.map +1 -1
  4. package/lib/components/Alert.js +3 -1
  5. package/lib/components/Alert.js.map +2 -2
  6. package/lib/components/Badge.d.ts +16 -3
  7. package/lib/components/Badge.js +53 -4
  8. package/lib/components/Badge.js.map +2 -2
  9. package/lib/components/Button.d.ts +24 -22
  10. package/lib/components/Button.js +13 -7
  11. package/lib/components/Button.js.map +2 -2
  12. package/lib/components/Checkbox.d.ts +1 -1
  13. package/lib/components/Checkbox.js +1 -1
  14. package/lib/components/Checkbox.js.map +2 -2
  15. package/lib/components/Collapse.js +1 -1
  16. package/lib/components/Collapse.js.map +2 -2
  17. package/lib/components/DatePicker.js +1 -1
  18. package/lib/components/DatePicker.js.map +2 -2
  19. package/lib/components/DateRangePicker.js +1 -1
  20. package/lib/components/DateRangePicker.js.map +2 -2
  21. package/lib/components/Drawer.js +1 -1
  22. package/lib/components/Drawer.js.map +2 -2
  23. package/lib/components/InputBox.js +1 -1
  24. package/lib/components/InputBox.js.map +2 -2
  25. package/lib/components/Link.d.ts +91 -0
  26. package/lib/components/Link.js +44 -0
  27. package/lib/components/Link.js.map +13 -0
  28. package/lib/components/Modal.js +1 -1
  29. package/lib/components/Modal.js.map +2 -2
  30. package/lib/components/MonthRangePicker.js +1 -1
  31. package/lib/components/MonthRangePicker.js.map +2 -2
  32. package/lib/components/RichText.d.ts +6 -1
  33. package/lib/components/RichText.js +207 -8
  34. package/lib/components/RichText.js.map +2 -2
  35. package/lib/components/Select.d.ts +7 -0
  36. package/lib/components/Select.js +3 -0
  37. package/lib/components/Select.js.map +2 -2
  38. package/lib/components/SparkLine.d.ts +85 -84
  39. package/lib/components/SparkLine.js +2 -2
  40. package/lib/components/SparkLine.js.map +2 -2
  41. package/lib/components/Steps.d.ts +3 -3
  42. package/lib/components/Steps.js.map +1 -1
  43. package/lib/components/Toast.js +2 -2
  44. package/lib/components/Toast.js.map +2 -2
  45. package/lib/components/Tree.js +5 -3
  46. package/lib/components/Tree.js.map +2 -2
  47. package/lib/components/WithRemoteConfig.d.ts +8 -0
  48. package/lib/components/WithRemoteConfig.js +28 -2
  49. package/lib/components/WithRemoteConfig.js.map +2 -2
  50. package/lib/components/calendar/DaysView.js +2 -2
  51. package/lib/components/calendar/DaysView.js.map +2 -2
  52. package/lib/components/condition-builder/Field.js +0 -1
  53. package/lib/components/condition-builder/Field.js.map +2 -2
  54. package/lib/components/condition-builder/Value.js +2 -1
  55. package/lib/components/condition-builder/Value.js.map +2 -2
  56. package/lib/components/condition-builder/types.d.ts +5 -0
  57. package/lib/components/condition-builder/types.js.map +1 -1
  58. package/lib/components/icons.js +14 -0
  59. package/lib/components/icons.js.map +2 -2
  60. package/lib/factory.d.ts +5 -1
  61. package/lib/factory.js +9 -4
  62. package/lib/factory.js.map +2 -2
  63. package/lib/helper.css.map +1 -1
  64. package/lib/icons/clock.js +10 -0
  65. package/lib/icons/loading-outline.js +7 -0
  66. package/lib/icons/status-close.js +11 -0
  67. package/lib/icons/status-fail.js +11 -0
  68. package/lib/icons/status-info.js +10 -0
  69. package/lib/icons/status-success.js +11 -0
  70. package/lib/icons/status-warning.js +10 -0
  71. package/lib/index.js +1 -1
  72. package/lib/locale/de-DE.js +3 -0
  73. package/lib/locale/de-DE.js.map +2 -2
  74. package/lib/locale/en-US.js +4 -1
  75. package/lib/locale/en-US.js.map +2 -2
  76. package/lib/locale/zh-CN.js +5 -2
  77. package/lib/locale/zh-CN.js.map +2 -2
  78. package/lib/renderers/Action.d.ts +16 -1
  79. package/lib/renderers/Action.js +5 -5
  80. package/lib/renderers/Action.js.map +2 -2
  81. package/lib/renderers/CRUD.d.ts +2 -2
  82. package/lib/renderers/CRUD.js +32 -26
  83. package/lib/renderers/CRUD.js.map +2 -2
  84. package/lib/renderers/Collapse.d.ts +1 -1
  85. package/lib/renderers/Collapse.js +7 -3
  86. package/lib/renderers/Collapse.js.map +2 -2
  87. package/lib/renderers/Dialog.d.ts +0 -252
  88. package/lib/renderers/Dialog.js +1 -4
  89. package/lib/renderers/Dialog.js.map +2 -2
  90. package/lib/renderers/Drawer.js +0 -3
  91. package/lib/renderers/Drawer.js.map +2 -2
  92. package/lib/renderers/DropDownButton.d.ts +13 -1
  93. package/lib/renderers/DropDownButton.js +9 -5
  94. package/lib/renderers/DropDownButton.js.map +2 -2
  95. package/lib/renderers/Form/ButtonGroupSelect.js +3 -0
  96. package/lib/renderers/Form/ButtonGroupSelect.js.map +2 -2
  97. package/lib/renderers/Form/Checkbox.d.ts +5 -0
  98. package/lib/renderers/Form/Checkbox.js +4 -0
  99. package/lib/renderers/Form/Checkbox.js.map +2 -2
  100. package/lib/renderers/Form/Combo.js +2 -2
  101. package/lib/renderers/Form/Combo.js.map +2 -2
  102. package/lib/renderers/Form/DiffEditor.d.ts +0 -2
  103. package/lib/renderers/Form/Editor.d.ts +0 -2
  104. package/lib/renderers/Form/Editor.js +1 -1
  105. package/lib/renderers/Form/Editor.js.map +2 -2
  106. package/lib/renderers/Form/InputExcel.d.ts +5 -0
  107. package/lib/renderers/Form/InputExcel.js +24 -3
  108. package/lib/renderers/Form/InputExcel.js.map +2 -2
  109. package/lib/renderers/Form/InputFile.js +2 -2
  110. package/lib/renderers/Form/InputFile.js.map +2 -2
  111. package/lib/renderers/Form/InputImage.d.ts +8 -0
  112. package/lib/renderers/Form/InputImage.js +7 -4
  113. package/lib/renderers/Form/InputImage.js.map +2 -2
  114. package/lib/renderers/Form/InputTable.d.ts +23 -5
  115. package/lib/renderers/Form/InputTable.js +32 -3
  116. package/lib/renderers/Form/InputTable.js.map +2 -2
  117. package/lib/renderers/Form/Options.js +6 -3
  118. package/lib/renderers/Form/Options.js.map +2 -2
  119. package/lib/renderers/Form/Picker.js +2 -2
  120. package/lib/renderers/Form/Picker.js.map +2 -2
  121. package/lib/renderers/Form/wrapControl.js +2 -2
  122. package/lib/renderers/Form/wrapControl.js.map +2 -2
  123. package/lib/renderers/IFrame.js +2 -2
  124. package/lib/renderers/IFrame.js.map +2 -2
  125. package/lib/renderers/Image.d.ts +1 -0
  126. package/lib/renderers/Image.js +15 -1
  127. package/lib/renderers/Image.js.map +2 -2
  128. package/lib/renderers/Json.js +5 -1
  129. package/lib/renderers/Json.js.map +2 -2
  130. package/lib/renderers/Link.d.ts +16 -3
  131. package/lib/renderers/Link.js +16 -13
  132. package/lib/renderers/Link.js.map +2 -2
  133. package/lib/renderers/Log.d.ts +2 -2
  134. package/lib/renderers/Log.js +7 -1
  135. package/lib/renderers/Log.js.map +2 -2
  136. package/lib/renderers/Nav.d.ts +81 -25
  137. package/lib/renderers/Nav.js +272 -29
  138. package/lib/renderers/Nav.js.map +2 -2
  139. package/lib/renderers/Page.js +4 -1
  140. package/lib/renderers/Page.js.map +2 -2
  141. package/lib/renderers/Service.d.ts +10 -1
  142. package/lib/renderers/Service.js +85 -3
  143. package/lib/renderers/Service.js.map +2 -2
  144. package/lib/renderers/SparkLine.d.ts +4 -0
  145. package/lib/renderers/SparkLine.js.map +2 -2
  146. package/lib/renderers/Steps.d.ts +4 -4
  147. package/lib/renderers/Steps.js +5 -2
  148. package/lib/renderers/Steps.js.map +2 -2
  149. package/lib/renderers/Table/ColumnToggler.d.ts +113 -0
  150. package/lib/renderers/Table/ColumnToggler.js +216 -0
  151. package/lib/renderers/Table/ColumnToggler.js.map +13 -0
  152. package/lib/renderers/Table/ItemActionsWrapper.d.ts +11 -0
  153. package/lib/renderers/Table/ItemActionsWrapper.js +31 -0
  154. package/lib/renderers/Table/ItemActionsWrapper.js.map +13 -0
  155. package/lib/renderers/Table/TableBody.d.ts +5 -1
  156. package/lib/renderers/Table/TableBody.js +5 -1
  157. package/lib/renderers/Table/TableBody.js.map +2 -2
  158. package/lib/renderers/Table/TableCell.js +3 -1
  159. package/lib/renderers/Table/TableCell.js.map +2 -2
  160. package/lib/renderers/Table/TableContent.d.ts +1 -1
  161. package/lib/renderers/Table/TableContent.js +4 -0
  162. package/lib/renderers/Table/TableContent.js.map +2 -2
  163. package/lib/renderers/Table/index.d.ts +22 -4
  164. package/lib/renderers/Table/index.js +196 -81
  165. package/lib/renderers/Table/index.js.map +2 -2
  166. package/lib/store/app.d.ts +0 -1
  167. package/lib/store/combo.d.ts +0 -2
  168. package/lib/store/crud.d.ts +3 -3
  169. package/lib/store/crud.js +41 -36
  170. package/lib/store/crud.js.map +2 -2
  171. package/lib/store/form.d.ts +0 -1
  172. package/lib/store/modal.d.ts +1 -1
  173. package/lib/store/modal.js +4 -0
  174. package/lib/store/modal.js.map +2 -2
  175. package/lib/store/root.d.ts +0 -1
  176. package/lib/store/service.d.ts +0 -1
  177. package/lib/store/service.js +0 -13
  178. package/lib/store/service.js.map +2 -2
  179. package/lib/store/table.d.ts +258 -3
  180. package/lib/store/table.js +83 -7
  181. package/lib/store/table.js.map +2 -2
  182. package/lib/themes/ang-ie11.css +941 -98
  183. package/lib/themes/ang.css +941 -98
  184. package/lib/themes/ang.css.map +1 -1
  185. package/lib/themes/antd-ie11.css +941 -98
  186. package/lib/themes/antd.css +941 -98
  187. package/lib/themes/antd.css.map +1 -1
  188. package/lib/themes/cxd-ie11.css +1580 -411
  189. package/lib/themes/cxd.css +1580 -411
  190. package/lib/themes/cxd.css.map +1 -1
  191. package/lib/themes/dark-ie11.css +941 -98
  192. package/lib/themes/dark.css +941 -98
  193. package/lib/themes/dark.css.map +1 -1
  194. package/lib/themes/default.css +1580 -411
  195. package/lib/themes/default.css.map +1 -1
  196. package/lib/utils/api.js +16 -4
  197. package/lib/utils/api.js.map +2 -2
  198. package/lib/utils/attachmentAdpator.d.ts +7 -0
  199. package/lib/utils/attachmentAdpator.js +82 -0
  200. package/lib/utils/attachmentAdpator.js.map +13 -0
  201. package/lib/utils/handleAction.d.ts +7 -0
  202. package/lib/utils/handleAction.js +30 -0
  203. package/lib/utils/handleAction.js.map +13 -0
  204. package/lib/utils/helper.d.ts +1 -1
  205. package/lib/utils/helper.js +3 -3
  206. package/lib/utils/helper.js.map +2 -2
  207. package/lib/utils/tpl-builtin.d.ts +1 -1
  208. package/lib/utils/tpl-builtin.js +25 -15
  209. package/lib/utils/tpl-builtin.js.map +2 -2
  210. package/lib/utils/validations.js +62 -5
  211. package/lib/utils/validations.js.map +2 -2
  212. package/package.json +1 -2
  213. package/schema.json +633 -273
  214. package/scss/_mixins.scss +29 -0
  215. package/scss/_properties.scss +64 -13
  216. package/scss/_utilities.scss +4 -0
  217. package/scss/components/_badge.scss +67 -2
  218. package/scss/components/_button.scss +34 -3
  219. package/scss/components/_collapse.scss +26 -8
  220. package/scss/components/_column-toggler.scss +234 -0
  221. package/scss/components/_dropdown.scss +2 -1
  222. package/scss/components/_image-gallery.scss +1 -1
  223. package/scss/components/_images.scss +2 -1
  224. package/scss/components/_link.scss +6 -0
  225. package/scss/components/_markdown.scss +266 -0
  226. package/scss/components/_nav.scss +236 -154
  227. package/scss/components/_page.scss +5 -4
  228. package/scss/components/_progress.scss +2 -0
  229. package/scss/components/_spinner.scss +6 -2
  230. package/scss/components/_steps.scss +1 -1
  231. package/scss/components/_table.scss +25 -1
  232. package/scss/components/form/_color.scss +1 -0
  233. package/scss/components/form/_date-range.scss +2 -0
  234. package/scss/components/form/_date.scss +2 -0
  235. package/scss/components/form/_fieldset.scss +1 -2
  236. package/scss/components/form/_file.scss +5 -4
  237. package/scss/components/form/_group.scss +4 -0
  238. package/scss/components/form/_image.scss +7 -2
  239. package/scss/components/form/_list.scss +1 -0
  240. package/scss/components/form/_location.scss +1 -1
  241. package/scss/components/form/_text.scss +13 -0
  242. package/scss/components/form/_textarea.scss +10 -0
  243. package/scss/components/form/_transfer.scss +2 -0
  244. package/scss/themes/_common.scss +3 -0
  245. package/scss/themes/_cxd-colors.scss +56 -0
  246. package/scss/themes/_cxd-variables.scss +217 -92
  247. package/scss/themes/cxd.scss +366 -0
  248. package/sdk/ang-ie11.css +1192 -176
  249. package/sdk/ang.css +1175 -118
  250. package/sdk/antd-ie11.css +1177 -163
  251. package/sdk/antd.css +1175 -118
  252. package/sdk/charts.js +13 -13
  253. package/sdk/color-picker.js +67 -67
  254. package/sdk/cropperjs.js +2 -2
  255. package/sdk/cxd-ie11.css +2538 -1222
  256. package/sdk/cxd.css +1825 -401
  257. package/sdk/dark-ie11.css +1192 -176
  258. package/sdk/dark.css +1175 -118
  259. package/sdk/exceljs.js +1 -1
  260. package/sdk/helper.css.map +1 -1
  261. package/sdk/ie11-patch.css +1 -0
  262. package/sdk/locale/de-DE.js +3 -0
  263. package/sdk/markdown.js +69 -69
  264. package/sdk/papaparse.js +1 -1
  265. package/sdk/renderers/Form/CityDB.js +1 -1
  266. package/sdk/rest.js +22 -24
  267. package/sdk/rich-text.js +62 -64
  268. package/sdk/sdk-ie11.css +2538 -1222
  269. package/sdk/sdk.css +1825 -401
  270. package/sdk/sdk.js +1139 -1113
  271. package/sdk/thirds/hls.js/hls.js +1 -1
  272. package/sdk/thirds/mpegts.js/mpegts.js +1 -1
  273. package/sdk/tinymce.js +57 -57
  274. package/src/Schema.ts +18 -0
  275. package/src/components/Alert.tsx +3 -1
  276. package/src/components/Badge.tsx +124 -21
  277. package/src/components/Button.tsx +23 -7
  278. package/src/components/Checkbox.tsx +5 -2
  279. package/src/components/Collapse.tsx +14 -9
  280. package/src/components/DatePicker.tsx +1 -1
  281. package/src/components/DateRangePicker.tsx +23 -11
  282. package/src/components/Drawer.tsx +3 -2
  283. package/src/components/InputBox.tsx +1 -1
  284. package/src/components/Link.tsx +94 -0
  285. package/src/components/Modal.tsx +3 -2
  286. package/src/components/MonthRangePicker.tsx +10 -2
  287. package/src/components/RichText.tsx +244 -3
  288. package/src/components/Select.tsx +4 -0
  289. package/src/components/SparkLine.tsx +4 -1
  290. package/src/components/Steps.tsx +3 -3
  291. package/src/components/Toast.tsx +5 -5
  292. package/src/components/Tree.tsx +6 -8
  293. package/src/components/WithRemoteConfig.tsx +37 -2
  294. package/src/components/calendar/DaysView.tsx +2 -2
  295. package/src/components/condition-builder/Field.tsx +1 -2
  296. package/src/components/condition-builder/Value.tsx +3 -0
  297. package/src/components/condition-builder/types.ts +6 -0
  298. package/src/components/icons.tsx +15 -0
  299. package/src/factory.tsx +13 -3
  300. package/src/icons/clock.svg +1 -0
  301. package/src/icons/loading-outline.svg +4 -0
  302. package/src/icons/status-close.svg +10 -0
  303. package/src/icons/status-fail.svg +10 -0
  304. package/src/icons/status-info.svg +8 -0
  305. package/src/icons/status-success.svg +10 -0
  306. package/src/icons/status-warning.svg +8 -0
  307. package/src/locale/de-DE.ts +3 -0
  308. package/src/locale/en-US.ts +4 -1
  309. package/src/locale/zh-CN.ts +5 -2
  310. package/src/renderers/Action.tsx +71 -13
  311. package/src/renderers/CRUD.tsx +44 -59
  312. package/src/renderers/Collapse.tsx +6 -2
  313. package/src/renderers/Dialog.tsx +1 -5
  314. package/src/renderers/Drawer.tsx +0 -4
  315. package/src/renderers/DropDownButton.tsx +34 -12
  316. package/src/renderers/Form/ButtonGroupSelect.tsx +3 -0
  317. package/src/renderers/Form/Checkbox.tsx +8 -0
  318. package/src/renderers/Form/Combo.tsx +2 -3
  319. package/src/renderers/Form/Editor.tsx +19 -20
  320. package/src/renderers/Form/InputExcel.tsx +28 -3
  321. package/src/renderers/Form/InputFile.tsx +2 -1
  322. package/src/renderers/Form/InputImage.tsx +28 -10
  323. package/src/renderers/Form/InputTable.tsx +88 -9
  324. package/src/renderers/Form/Options.tsx +16 -5
  325. package/src/renderers/Form/Picker.tsx +3 -2
  326. package/src/renderers/Form/wrapControl.tsx +2 -2
  327. package/src/renderers/IFrame.tsx +2 -1
  328. package/src/renderers/Image.tsx +10 -0
  329. package/src/renderers/Json.tsx +10 -1
  330. package/src/renderers/Link.tsx +36 -11
  331. package/src/renderers/Log.tsx +16 -3
  332. package/src/renderers/Nav.tsx +340 -56
  333. package/src/renderers/Page.tsx +3 -1
  334. package/src/renderers/Service.tsx +101 -3
  335. package/src/renderers/SparkLine.tsx +5 -0
  336. package/src/renderers/Steps.tsx +12 -9
  337. package/src/renderers/Table/ColumnToggler.tsx +544 -0
  338. package/src/renderers/Table/ItemActionsWrapper.tsx +44 -0
  339. package/src/renderers/Table/TableBody.tsx +3 -2
  340. package/src/renderers/Table/TableCell.tsx +16 -1
  341. package/src/renderers/Table/TableContent.tsx +3 -1
  342. package/src/renderers/Table/index.tsx +240 -60
  343. package/src/store/crud.ts +34 -38
  344. package/src/store/modal.ts +4 -0
  345. package/src/store/service.ts +0 -19
  346. package/src/store/table.ts +103 -4
  347. package/src/utils/api.ts +24 -4
  348. package/src/utils/attachmentAdpator.ts +90 -0
  349. package/src/utils/handleAction.ts +41 -0
  350. package/src/utils/helper.ts +4 -3
  351. package/src/utils/tpl-builtin.ts +48 -17
  352. package/src/utils/validations.ts +80 -12
@@ -3,8 +3,8 @@
3
3
  --black: #1c2b36;
4
4
  --white: #fff;
5
5
  --primary: #7266ba;
6
- --primary-onHover: #5b4eac;
7
- --primary-onActive: #564aa3;
6
+ --primary-onHover: #4f86f4;
7
+ --primary-onActive: #1c53c1;
8
8
  --secondary: #6c757d;
9
9
  --secondary-onHover: #5a6268;
10
10
  --secondary-onActive: #545b62;
@@ -139,6 +139,10 @@
139
139
  --Avatar-width: 2.5rem;
140
140
  --Badge-size: var(--gap-md);
141
141
  --Badge-color: var(--white);
142
+ --Badge--success-bg: var(--success);
143
+ --Badge--info-bg: var(--info);
144
+ --Badge--warning-bg: var(--warning);
145
+ --Badge--danger-bg: var(--danger);
142
146
  --Button--danger-bg: var(--danger);
143
147
  --Button--danger-border: var(--Button--danger-bg);
144
148
  --Button--danger-color: var(--button-color);
@@ -160,12 +164,12 @@
160
164
  --Button--default-bg: var(--white);
161
165
  --Button--default-border: var(--borderColor);
162
166
  --Button--default-color: var(--text-color);
163
- --Button--default-onActive-bg: #e6e6e6;
164
- --Button--default-onActive-border: #adb4bf;
165
- --Button--default-onActive-color: var(--Button--default-color);
166
- --Button--default-onHover-bg: #ececec;
167
- --Button--default-onHover-border: #b4bbc5;
168
- --Button--default-onHover-color: var(--Button--default-color);
167
+ --Button--default-onActive-bg: var(--white);
168
+ --Button--default-onActive-border: var(--primary-onActive);
169
+ --Button--default-onActive-color: var(--primary-onActive);
170
+ --Button--default-onHover-bg: var(--white);
171
+ --Button--default-onHover-border: var(--primary);
172
+ --Button--default-onHover-color: var(--primary);
169
173
  --Button--iconOnly-minWidthRate: 4 / 3;
170
174
  --Button--info-bg: var(--info);
171
175
  --Button--info-border: var(--Button--info-bg);
@@ -198,7 +202,8 @@
198
202
  --Button--light-onHover-color: var(--Button--light-color);
199
203
  --Button--link-color: var(--primary);
200
204
  --Button--link-onDisabled-color: #4b5563;
201
- --Button--link-onHover-color: var(--text--loud-color);
205
+ --Button--link-onHover-color: var(--primary-onHover);
206
+ --Button--link-onActive-color: var(--primary-onActive);
202
207
  --Button--md-fontSize: var(--Button-fontSize);
203
208
  --Button--md-height: var(--Button-height);
204
209
  --Button--md-lineHeight: var(--Button-lineHeight);
@@ -213,10 +218,10 @@
213
218
  --Button--primary-border: var(--Button--primary-bg);
214
219
  --Button--primary-color: var(--button-color);
215
220
  --Button--primary-onActive-bg: var(--primary-onActive);
216
- --Button--primary-onActive-border: #52469b;
221
+ --Button--primary-onActive-border: var(--primary-onActive);
217
222
  --Button--primary-onActive-color: var(--Button--primary-color);
218
223
  --Button--primary-onHover-bg: var(--primary-onHover);
219
- --Button--primary-onHover-border: var(--primary-onActive);
224
+ --Button--primary-onHover-border: var(--primary-onHover);
220
225
  --Button--primary-onHover-color: var(--Button--primary-color);
221
226
  --Button--secondary-bg: var(--secondary);
222
227
  --Button--secondary-border: var(--Button--secondary-bg);
@@ -247,6 +252,14 @@
247
252
  --Button--success-onHover-bg: var(--success-onHover);
248
253
  --Button--success-onHover-border: var(--success-onActive);
249
254
  --Button--success-onHover-color: var(--Button--success-color);
255
+ --Button--enhance-border: var(--primary);
256
+ --Button--enhance-color: var(--primary);
257
+ --Button--enhance-onActive-bg: var(--white);
258
+ --Button--enhance-onActive-border: var(--primary-onActive);
259
+ --Button--enhance-onActive-color: var(--primary-onActive);
260
+ --Button--enhance-onHover-bg: var(--white);
261
+ --Button--enhance-onHover-border: var(--primary-onHover);
262
+ --Button--enhance-onHover-color: var(--primary-onHover);
250
263
  --Button--warning-bg: var(--warning);
251
264
  --Button--warning-border: var(--Button--warning-bg);
252
265
  --Button--warning-color: var(--button-color);
@@ -277,12 +290,16 @@
277
290
  --Button-lineHeight: var(--Form-input-lineHeight);
278
291
  --Button-mimWidth: auto;
279
292
  --Button-onActive-boxShadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
293
+ --Button-transition: all 0.3s cubic-bezier(0.645, 0.045, 0.355, 1);
294
+ --Button-animation-spin: spin 1s infinite linear;
280
295
  --Button-onActive-color: var(--primary);
281
296
  --Button-onActive-border: var(--primary);
282
297
  --Button-onDisabled-borderColor: #dee2e6;
283
298
  --Button-onDisabled-opacity: 0.65;
299
+ --Button-onDisabled-bg: #f2f3f3;
284
300
  --Button-onFocus-boxShadow: none;
285
301
  --Button-paddingX: 0.75rem;
302
+ --Button-paddingX-right: 0.625rem;
286
303
  --Button-paddingY: calc(
287
304
  (
288
305
  var(--Button-height) - var(--Button-borderWidth) * 2 -
@@ -468,6 +485,19 @@
468
485
  --Combo-toolbarBtn-paddingY: 0.125rem;
469
486
  --Copyable-iconColor: var(--icon-color);
470
487
  --Copyable-onHover-iconColor: var(--icon-onHover-color);
488
+ --Collapse-border: none;
489
+ --Collapse-border-color: var(--borderColorLight);
490
+ --Collapse-header-fontSize: var(--fontSizeMd);
491
+ --Collapse-header-fontWeight: var(--fontWeightNormal);
492
+ --Collapse-header-padding: 1.125rem 0 var(--gap-xs) 0;
493
+ --Collapse-header-bg: transparent;
494
+ --Collapse-header-onHover-bg: transparent;
495
+ --Collapse-header-collapsed-borderBottom: var(--borderWidth) solid
496
+ var(--Collapse-border-color);
497
+ --Collapse-content-padding: 1.125rem 0;
498
+ --Collapse-content-color: var(--body-color);
499
+ --Collapse-content-fontSize: var(--body-size);
500
+ --Collapse-content-fontWeight: var(--body-weight);
471
501
  --Crud-toolbar-gap: var(--gap-xs);
472
502
  --Crud-toolbar-height: 1.875rem;
473
503
  --Crud-toolbar-lineHeight: var(--lineHeightBase);
@@ -493,6 +523,7 @@
493
523
  ) / 2 - var(--DatePicker-borderWidth)
494
524
  );
495
525
  --DatePicker-placeholderColor: var(--Form-input-placeholderColor);
526
+ --LocationPicker-borderRadius: var(--Form-input-borderWidth);
496
527
  --Divider-borderStyle: dashed;
497
528
  --Drawer-bg: var(--background);
498
529
  --Drawer-body-padding: var(--gap-base);
@@ -526,8 +557,9 @@
526
557
  --DropDown-menu-paddingX: 0;
527
558
  --DropDown-menu-paddingY: var(--gap-xs);
528
559
  --DropDown-menuItem-onHover-bg: var(--ListMenu-item--onHover-bg);
529
- --DropDown-menuItem-onHover-color: inherit;
530
- --DropDown-menuItem-onActive-color: var(--info);
560
+ --DropDown-menuItem-color: var(--text-color);
561
+ --DropDown-menuItem-onHover-color: var(--primary);
562
+ --DropDown-menuItem-onActive-color: var(--primary);
531
563
  --DropDown-menuItem-onDisabled-color: var(--text--muted-color);
532
564
  --DropDown-menuItem-paddingX: var(--gap-sm);
533
565
  --DropDown-menuItem-paddingY: calc(
@@ -589,6 +621,7 @@
589
621
  ) / 2
590
622
  );
591
623
  --Form-input-placeholderColor: var(--text--muted-color);
624
+ --Form-input-onDisabled-color: var(--text--muted-color);
592
625
  --Form-item-gap: var(--gap-base);
593
626
  --Form-label-paddingTop: calc(
594
627
  (
@@ -647,6 +680,7 @@
647
680
  --IconPicker-tabs-bg: #f0f3f4;
648
681
  --ImageControl-addBtn-bg: var(--Button--default-bg);
649
682
  --ImageControl-addBtn-border: var(--Button--default-border);
683
+ --ImageControl-addBtn-borderRadius: 0;
650
684
  --ImageControl-addBtn-color: var(--Button--default-color);
651
685
  --ImageControl-addBtn-onActive-bg: #e6e6e6;
652
686
  --ImageControl-addBtn-onActive-border: #adb4bf;
@@ -659,6 +693,8 @@
659
693
  --ImageControl-addBtn-onHover-bg: #ececec;
660
694
  --ImageControl-addBtn-onHover-border: #b4bbc5;
661
695
  --ImageControl-addBtn-onHover-color: var(--Button--default-color);
696
+ --ImageControl-progress-borderRadius: 0;
697
+ --FileControl-progress-borderRadius: 0;
662
698
  --InputGroup-addOn-bg: var(--Form-input-addOnBg);
663
699
  --InputGroup-addOn-borderColor: var(--Form-input-borderColor);
664
700
  --InputGroup-addOn-borderRadius: var(--Form-input-borderRadius);
@@ -774,6 +810,7 @@
774
810
  --ListControl-item-bg: var(--white);
775
811
  --ListControl-item-borderColor: var(--borderColor);
776
812
  --ListControl-item-borderWidth: var(--borderWidth);
813
+ --ListControl-item-borderRadius: 0.1875rem;
777
814
  --ListControl-item-color: var(--text-color);
778
815
  --ListControl-item-onActive-after-borderColor: var(--primary);
779
816
  --ListControl-item-onActive-before-bg: var(--white);
@@ -1041,6 +1078,8 @@
1041
1078
  --Table-toolbar-marginX: 0;
1042
1079
  --Table-toolbar-marginY: var(--gap-base);
1043
1080
  --Table-tree-borderColor: var(--Table-borderColor);
1081
+ --Table-searchableForm-backgroundColor: #f6f7f8;
1082
+ --Table-searchableForm-borderRadius: 0.25rem;
1044
1083
  --TableCell--edge-paddingX: var(--gap-md);
1045
1084
  --TableCell-filterBtn--onActive-color: var(--primary);
1046
1085
  --TableCell-filterBtn-width: 1rem;
@@ -1226,6 +1265,14 @@
1226
1265
  --Steps-sub-title-color: var(--text-color);
1227
1266
  --Steps-line-bg: var(--Steps-bg);
1228
1267
  --Steps-line-success-bg: var(--Steps-status-success);
1268
+ --Progress-borderRadius: var(--borderRadius);
1269
+ --ColumnToggler-backgroundColor: var(--white);
1270
+ --ColumnToggler-borderRadius: 0.25rem;
1271
+ --ColumnToggler-lineHeight: 1.5rem;
1272
+ --ColumnToggler-title-fontColor: #080e1a;
1273
+ --ColumnToggler-fontColor: #151a26;
1274
+ --ColumnToggler-item-backgroundColor: #f6f7f8;
1275
+ --ColumnToggler-item-backgroundColor-onHover: rgba(36, 104, 242, 0.1);
1229
1276
  }
1230
1277
 
1231
1278
  /* Reset
@@ -2983,6 +3030,15 @@ img.a-AsideNav-itemIcon {
2983
3030
  .a-Button > .pull-right {
2984
3031
  margin-left: var(--Button-paddingX);
2985
3032
  }
3033
+ .a-Button .a-Button--loading:first-child:not(:last-child):not(.pull-right),
3034
+ .a-Button > svg.icon:not(:last-child):not(.pull-right),
3035
+ .a-Button > .pull-left {
3036
+ margin-right: var(--Button-paddingX);
3037
+ }
3038
+ .a-Button .a-Button--loading:last-child:not(:first-child):not(.pull-left),
3039
+ .a-Button > .pull-right {
3040
+ margin-left: var(--Button-paddingX);
3041
+ }
2986
3042
  .a-Button img.a-Button-icon {
2987
3043
  height: var(--Button-fontSize);
2988
3044
  vertical-align: middle;
@@ -2995,14 +3051,21 @@ img.a-AsideNav-itemIcon {
2995
3051
  box-shadow: var(--Button-onFocus-boxShadow);
2996
3052
  }
2997
3053
  .a-Button.is-disabled, .a-Button:disabled {
2998
- opacity: var(--Button-onDisabled-opacity);
2999
3054
  filter: grayscale(100%);
3000
3055
  box-shadow: none;
3001
3056
  cursor: not-allowed;
3057
+ color: var(--text--muted-color);
3058
+ pointer-events: auto;
3059
+ border: var(--Button-borderWidth) solid var(--Button-onDisabled-borderColor);
3060
+ background: var(--Button-onDisabled-bg);
3002
3061
  }
3003
3062
  .a-Button:not(:disabled):not(.is-disabled) {
3004
3063
  cursor: pointer;
3005
3064
  }
3065
+ .a-Button.cxd-Button--link.is-disabled {
3066
+ background: transparent;
3067
+ border: none;
3068
+ }
3006
3069
  .a-Button > .pull-left,
3007
3070
  .a-Button > .pull-right {
3008
3071
  line-height: inherit;
@@ -3030,6 +3093,11 @@ fieldset:disabled a.a-Button {
3030
3093
  background: var(--Button--primary-onHover-bg);
3031
3094
  border-color: var(--Button--primary-onHover-border);
3032
3095
  }
3096
+ .a-Button--primary:not(:disabled):not(.is-disabled):hover:active {
3097
+ color: var(--Button--primary-onActive-color);
3098
+ background: var(--Button--primary-onActive-bg);
3099
+ border-color: var(--Button--primary-onActive-border);
3100
+ }
3033
3101
  .a-Button--primary:hover:focus {
3034
3102
  box-shadow: var(--Button-boxShadow);
3035
3103
  }
@@ -3046,6 +3114,11 @@ fieldset:disabled a.a-Button {
3046
3114
  background: var(--Button--secondary-onHover-bg);
3047
3115
  border-color: var(--Button--secondary-onHover-border);
3048
3116
  }
3117
+ .a-Button--secondary:not(:disabled):not(.is-disabled):hover:active {
3118
+ color: var(--Button--secondary-onActive-color);
3119
+ background: var(--Button--secondary-onActive-bg);
3120
+ border-color: var(--Button--secondary-onActive-border);
3121
+ }
3049
3122
  .a-Button--secondary:hover:focus {
3050
3123
  box-shadow: var(--Button-boxShadow);
3051
3124
  }
@@ -3062,10 +3135,36 @@ fieldset:disabled a.a-Button {
3062
3135
  background: var(--Button--success-onHover-bg);
3063
3136
  border-color: var(--Button--success-onHover-border);
3064
3137
  }
3138
+ .a-Button--success:not(:disabled):not(.is-disabled):hover:active {
3139
+ color: var(--Button--success-onActive-color);
3140
+ background: var(--Button--success-onActive-bg);
3141
+ border-color: var(--Button--success-onActive-border);
3142
+ }
3065
3143
  .a-Button--success:hover:focus {
3066
3144
  box-shadow: var(--Button-boxShadow);
3067
3145
  }
3068
3146
 
3147
+ .a-Button--enhance {
3148
+ color: var(--Button--enhance-color);
3149
+ background: var(--Button--enhance-bg);
3150
+ border-color: var(--Button--enhance-border);
3151
+ box-shadow: var(--Button-boxShadow);
3152
+ text-shadow: var(--Button-textShadow);
3153
+ }
3154
+ .a-Button--enhance:not(:disabled):not(.is-disabled):hover {
3155
+ color: var(--Button--enhance-onHover-color);
3156
+ background: var(--Button--enhance-onHover-bg);
3157
+ border-color: var(--Button--enhance-onHover-border);
3158
+ }
3159
+ .a-Button--enhance:not(:disabled):not(.is-disabled):hover:active {
3160
+ color: var(--Button--enhance-onActive-color);
3161
+ background: var(--Button--enhance-onActive-bg);
3162
+ border-color: var(--Button--enhance-onActive-border);
3163
+ }
3164
+ .a-Button--enhance:hover:focus {
3165
+ box-shadow: var(--Button-boxShadow);
3166
+ }
3167
+
3069
3168
  .a-Button--info {
3070
3169
  color: var(--Button--info-color);
3071
3170
  background: var(--Button--info-bg);
@@ -3078,6 +3177,11 @@ fieldset:disabled a.a-Button {
3078
3177
  background: var(--Button--info-onHover-bg);
3079
3178
  border-color: var(--Button--info-onHover-border);
3080
3179
  }
3180
+ .a-Button--info:not(:disabled):not(.is-disabled):hover:active {
3181
+ color: var(--Button--info-onActive-color);
3182
+ background: var(--Button--info-onActive-bg);
3183
+ border-color: var(--Button--info-onActive-border);
3184
+ }
3081
3185
  .a-Button--info:hover:focus {
3082
3186
  box-shadow: var(--Button-boxShadow);
3083
3187
  }
@@ -3094,6 +3198,11 @@ fieldset:disabled a.a-Button {
3094
3198
  background: var(--Button--warning-onHover-bg);
3095
3199
  border-color: var(--Button--warning-onHover-border);
3096
3200
  }
3201
+ .a-Button--warning:not(:disabled):not(.is-disabled):hover:active {
3202
+ color: var(--Button--warning-onActive-color);
3203
+ background: var(--Button--warning-onActive-bg);
3204
+ border-color: var(--Button--warning-onActive-border);
3205
+ }
3097
3206
  .a-Button--warning:hover:focus {
3098
3207
  box-shadow: var(--Button-boxShadow);
3099
3208
  }
@@ -3110,6 +3219,11 @@ fieldset:disabled a.a-Button {
3110
3219
  background: var(--Button--danger-onHover-bg);
3111
3220
  border-color: var(--Button--danger-onHover-border);
3112
3221
  }
3222
+ .a-Button--danger:not(:disabled):not(.is-disabled):hover:active {
3223
+ color: var(--Button--danger-onActive-color);
3224
+ background: var(--Button--danger-onActive-bg);
3225
+ border-color: var(--Button--danger-onActive-border);
3226
+ }
3113
3227
  .a-Button--danger:hover:focus {
3114
3228
  box-shadow: var(--Button-boxShadow);
3115
3229
  }
@@ -3126,6 +3240,11 @@ fieldset:disabled a.a-Button {
3126
3240
  background: var(--Button--light-onHover-bg);
3127
3241
  border-color: var(--Button--light-onHover-border);
3128
3242
  }
3243
+ .a-Button--light:not(:disabled):not(.is-disabled):hover:active {
3244
+ color: var(--Button--light-onActive-color);
3245
+ background: var(--Button--light-onActive-bg);
3246
+ border-color: var(--Button--light-onActive-border);
3247
+ }
3129
3248
  .a-Button--light:hover:focus {
3130
3249
  box-shadow: var(--Button-boxShadow);
3131
3250
  }
@@ -3142,6 +3261,11 @@ fieldset:disabled a.a-Button {
3142
3261
  background: var(--Button--dark-onHover-bg);
3143
3262
  border-color: var(--Button--dark-onHover-border);
3144
3263
  }
3264
+ .a-Button--dark:not(:disabled):not(.is-disabled):hover:active {
3265
+ color: var(--Button--dark-onActive-color);
3266
+ background: var(--Button--dark-onActive-bg);
3267
+ border-color: var(--Button--dark-onActive-border);
3268
+ }
3145
3269
  .a-Button--dark:hover:focus {
3146
3270
  box-shadow: var(--Button-boxShadow);
3147
3271
  }
@@ -3158,6 +3282,11 @@ fieldset:disabled a.a-Button {
3158
3282
  background: var(--Button--default-onHover-bg);
3159
3283
  border-color: var(--Button--default-onHover-border);
3160
3284
  }
3285
+ .a-Button--default:not(:disabled):not(.is-disabled):hover:active {
3286
+ color: var(--Button--default-onActive-color);
3287
+ background: var(--Button--default-onActive-bg);
3288
+ border-color: var(--Button--default-onActive-border);
3289
+ }
3161
3290
  .a-Button--default:hover:focus {
3162
3291
  box-shadow: var(--Button-boxShadow);
3163
3292
  }
@@ -3178,6 +3307,15 @@ fieldset:disabled a.a-Button {
3178
3307
  .a-Button--xs > .pull-right {
3179
3308
  margin-left: var(--Button--xs-paddingX);
3180
3309
  }
3310
+ .a-Button--xs .a-Button--loading:first-child:not(:last-child):not(.pull-right),
3311
+ .a-Button--xs > svg.icon:not(:last-child):not(.pull-right),
3312
+ .a-Button--xs > .pull-left {
3313
+ margin-right: var(--Button--xs-paddingX);
3314
+ }
3315
+ .a-Button--xs .a-Button--loading:last-child:not(:first-child):not(.pull-left),
3316
+ .a-Button--xs > .pull-right {
3317
+ margin-left: var(--Button--xs-paddingX);
3318
+ }
3181
3319
  .a-Button--xs img.a-Button-icon {
3182
3320
  height: var(--Button-fontSize);
3183
3321
  vertical-align: middle;
@@ -3202,6 +3340,15 @@ fieldset:disabled a.a-Button {
3202
3340
  .a-Button--sm > .pull-right {
3203
3341
  margin-left: var(--Button--sm-paddingX);
3204
3342
  }
3343
+ .a-Button--sm .a-Button--loading:first-child:not(:last-child):not(.pull-right),
3344
+ .a-Button--sm > svg.icon:not(:last-child):not(.pull-right),
3345
+ .a-Button--sm > .pull-left {
3346
+ margin-right: var(--Button--sm-paddingX);
3347
+ }
3348
+ .a-Button--sm .a-Button--loading:last-child:not(:first-child):not(.pull-left),
3349
+ .a-Button--sm > .pull-right {
3350
+ margin-left: var(--Button--sm-paddingX);
3351
+ }
3205
3352
  .a-Button--sm img.a-Button-icon {
3206
3353
  height: var(--Button-fontSize);
3207
3354
  vertical-align: middle;
@@ -3226,6 +3373,15 @@ fieldset:disabled a.a-Button {
3226
3373
  .a-Button--md > .pull-right {
3227
3374
  margin-left: var(--Button--md-paddingX);
3228
3375
  }
3376
+ .a-Button--md .a-Button--loading:first-child:not(:last-child):not(.pull-right),
3377
+ .a-Button--md > svg.icon:not(:last-child):not(.pull-right),
3378
+ .a-Button--md > .pull-left {
3379
+ margin-right: var(--Button--md-paddingX);
3380
+ }
3381
+ .a-Button--md .a-Button--loading:last-child:not(:first-child):not(.pull-left),
3382
+ .a-Button--md > .pull-right {
3383
+ margin-left: var(--Button--md-paddingX);
3384
+ }
3229
3385
  .a-Button--md img.a-Button-icon {
3230
3386
  height: var(--Button-fontSize);
3231
3387
  vertical-align: middle;
@@ -3250,6 +3406,15 @@ fieldset:disabled a.a-Button {
3250
3406
  .a-Button--lg > .pull-right {
3251
3407
  margin-left: var(--Button--lg-paddingX);
3252
3408
  }
3409
+ .a-Button--lg .a-Button--loading:first-child:not(:last-child):not(.pull-right),
3410
+ .a-Button--lg > svg.icon:not(:last-child):not(.pull-right),
3411
+ .a-Button--lg > .pull-left {
3412
+ margin-right: var(--Button--lg-paddingX);
3413
+ }
3414
+ .a-Button--lg .a-Button--loading:last-child:not(:first-child):not(.pull-left),
3415
+ .a-Button--lg > .pull-right {
3416
+ margin-left: var(--Button--lg-paddingX);
3417
+ }
3253
3418
  .a-Button--lg img.a-Button-icon {
3254
3419
  height: var(--Button-fontSize);
3255
3420
  vertical-align: middle;
@@ -3274,6 +3439,13 @@ fieldset:disabled a.a-Button {
3274
3439
  line-height: 1;
3275
3440
  }
3276
3441
 
3442
+ .a-Button--loading {
3443
+ transition: --Button-transition;
3444
+ }
3445
+ .a-Button--loading svg {
3446
+ animation: var(--Button-animation-spin);
3447
+ }
3448
+
3277
3449
  .a-Button--link {
3278
3450
  width: auto;
3279
3451
  min-width: auto;
@@ -3285,13 +3457,16 @@ fieldset:disabled a.a-Button {
3285
3457
  }
3286
3458
  .a-Button--link:hover:focus {
3287
3459
  color: var(--Button--link-onHover-color);
3288
- text-decoration: var(--link-onHover-decoration);
3460
+ box-shadow: none;
3461
+ }
3462
+ .a-Button--link:hover:active {
3463
+ color: var(--Button--link-onActive-color);
3289
3464
  box-shadow: none;
3290
3465
  }
3291
3466
  .a-Button--link:disabled, .a-Button--link.is-disabled {
3292
3467
  color: var(--text--muted-color);
3293
3468
  pointer-events: none;
3294
- background: transparent;
3469
+ background: var(--Button-onDisabled-bg);
3295
3470
  }
3296
3471
 
3297
3472
  .a-Button--block {
@@ -3360,7 +3535,7 @@ input[type=button].a-Button--block {
3360
3535
  display: inline-block;
3361
3536
  position: relative;
3362
3537
  }
3363
- .a-Badge-text, .a-Badge-dot {
3538
+ .a-Badge-text, .a-Badge-dot, .a-Badge-ribbon {
3364
3539
  background: var(--danger);
3365
3540
  position: absolute;
3366
3541
  top: 0;
@@ -3369,7 +3544,6 @@ input[type=button].a-Button--block {
3369
3544
  transform-origin: 100% 0;
3370
3545
  z-index: auto;
3371
3546
  border-radius: calc(var(--Badge-size) / 2);
3372
- box-shadow: 0 0 0 1px #fff;
3373
3547
  }
3374
3548
  .a-Badge--top-left {
3375
3549
  top: 0;
@@ -3391,6 +3565,18 @@ input[type=button].a-Button--block {
3391
3565
  right: 0;
3392
3566
  transform: translate(50%, 50%);
3393
3567
  }
3568
+ .a-Badge--danger {
3569
+ background: var(--Badge--danger-bg);
3570
+ }
3571
+ .a-Badge--info {
3572
+ background: var(--Badge--info-bg);
3573
+ }
3574
+ .a-Badge--success {
3575
+ background: var(--Badge--success-bg);
3576
+ }
3577
+ .a-Badge--warning {
3578
+ background: var(--Badge--warning-bg);
3579
+ }
3394
3580
  .a-Badge-text {
3395
3581
  color: var(--Badge-color);
3396
3582
  height: var(--Badge-size);
@@ -3405,6 +3591,49 @@ input[type=button].a-Button--block {
3405
3591
  height: var(--Badge-size);
3406
3592
  border-radius: 50%;
3407
3593
  }
3594
+ .a-Badge-ribbon-out {
3595
+ overflow: hidden;
3596
+ position: absolute;
3597
+ top: 0;
3598
+ bottom: 0;
3599
+ right: 0;
3600
+ }
3601
+ .a-Badge-ribbon {
3602
+ color: var(--Badge-color);
3603
+ height: var(--Badge-size);
3604
+ line-height: var(--Badge-size);
3605
+ transform: translateX(calc(50% - 5px)) rotate(45deg) scale(0.7);
3606
+ transform-origin: 50% 0;
3607
+ border-radius: 0;
3608
+ text-align: center;
3609
+ width: 62.5rem;
3610
+ top: 5px;
3611
+ }
3612
+ .a-Badge-ribbon-out--top-left, .a-Badge-ribbon-out--bottom-left {
3613
+ left: 0;
3614
+ right: auto;
3615
+ }
3616
+ .a-Badge-ribbon--top-left {
3617
+ transform: translateX(calc(-50% + 5px)) rotate(-45deg) scale(0.7);
3618
+ left: 0;
3619
+ right: auto;
3620
+ }
3621
+ .a-Badge-ribbon--bottom-left {
3622
+ transform: translateX(calc(-50% + 5px)) rotate(45deg) scale(0.7);
3623
+ transform-origin: 50% 100%;
3624
+ left: 0;
3625
+ right: auto;
3626
+ bottom: 5px;
3627
+ top: auto;
3628
+ }
3629
+ .a-Badge-ribbon--bottom-right {
3630
+ transform: translateX(calc(50% - 5px)) rotate(-45deg) scale(0.7);
3631
+ transform-origin: 50% 100%;
3632
+ left: auto;
3633
+ right: 0;
3634
+ bottom: 5px;
3635
+ top: auto;
3636
+ }
3408
3637
  @keyframes badgeDotAnimation {
3409
3638
  0% {
3410
3639
  transform: scale(0.8);
@@ -4475,6 +4704,15 @@ input[type=button].a-Button--block {
4475
4704
  .a-ArrayInput-addBtn > .pull-right {
4476
4705
  margin-left: var(--Combo-addBtn-paddingX);
4477
4706
  }
4707
+ .a-ArrayInput-addBtn .a-Button--loading:first-child:not(:last-child):not(.pull-right),
4708
+ .a-ArrayInput-addBtn > svg.icon:not(:last-child):not(.pull-right),
4709
+ .a-ArrayInput-addBtn > .pull-left {
4710
+ margin-right: var(--Combo-addBtn-paddingX);
4711
+ }
4712
+ .a-ArrayInput-addBtn .a-Button--loading:last-child:not(:first-child):not(.pull-left),
4713
+ .a-ArrayInput-addBtn > .pull-right {
4714
+ margin-left: var(--Combo-addBtn-paddingX);
4715
+ }
4478
4716
  .a-ArrayInput-addBtn img.a-Button-icon {
4479
4717
  height: var(--Button-fontSize);
4480
4718
  vertical-align: middle;
@@ -4484,6 +4722,11 @@ input[type=button].a-Button--block {
4484
4722
  background: var(--Combo-addBtn-onHover-bg);
4485
4723
  border-color: var(--Combo-addBtn-onHover-border);
4486
4724
  }
4725
+ .a-ArrayInput-addBtn:not(:disabled):not(.is-disabled):hover:active {
4726
+ color: var(--Combo-addBtn-onActive-color);
4727
+ background: var(--Combo-addBtn-onActive-bg);
4728
+ border-color: var(--Combo-addBtn-onActive-border);
4729
+ }
4487
4730
  .a-ArrayInput-addBtn:hover:focus {
4488
4731
  box-shadow: var(--Button-boxShadow);
4489
4732
  }
@@ -4939,27 +5182,31 @@ input[type=button].a-Button--block {
4939
5182
  }
4940
5183
 
4941
5184
  .a-Nav {
5185
+ position: relative;
5186
+ }
5187
+ .a-Nav .a-Nav-list {
4942
5188
  list-style: none;
4943
5189
  user-select: none;
4944
5190
  margin: 0;
4945
5191
  padding: 0;
4946
5192
  position: relative;
4947
5193
  }
4948
- .a-Nav .a-Nav-itemIcon {
5194
+ .a-Nav .a-Nav-list .a-Nav-itemIcon {
4949
5195
  margin-right: var(--gap-sm);
4950
5196
  }
4951
- .a-Nav img.a-Nav-itemIcon {
5197
+ .a-Nav .a-Nav-list img.a-Nav-itemIcon {
4952
5198
  height: var(--Tabs-linkFontSize);
4953
5199
  vertical-align: middle;
4954
5200
  }
4955
- .a-Nav--tabs {
5201
+ .a-Nav .a-Nav-list--tabs {
4956
5202
  border-bottom: var(--Tabs-borderWidth) solid var(--Tabs-borderColor);
4957
5203
  }
4958
- .a-Nav--tabs .a-Nav-item {
5204
+ .a-Nav .a-Nav-list--tabs .a-Nav-item {
4959
5205
  margin-bottom: calc(var(--Tabs-borderWidth) * -1);
4960
5206
  display: inline-block;
5207
+ position: relative;
4961
5208
  }
4962
- .a-Nav--tabs .a-Nav-item > a {
5209
+ .a-Nav .a-Nav-list--tabs .a-Nav-item > a {
4963
5210
  font-size: var(--Tabs-linkFontSize);
4964
5211
  display: block;
4965
5212
  outline: none;
@@ -4969,124 +5216,185 @@ input[type=button].a-Button--block {
4969
5216
  color: var(--Tabs-color);
4970
5217
  text-decoration: none;
4971
5218
  margin-right: 0.125rem;
4972
- padding: var(--gap-sm) var(--gap-base);
5219
+ padding: var(--gap-sm) var(--gap-xl);
4973
5220
  cursor: pointer;
4974
5221
  }
4975
- .a-Nav--tabs .a-Nav-item:hover > a,
4976
- .a-Nav--tabs .a-Nav-item > a:focus {
5222
+ .a-Nav .a-Nav-list--tabs .a-Nav-item:hover > a,
5223
+ .a-Nav .a-Nav-list--tabs .a-Nav-item > a:focus {
4977
5224
  border-color: var(--Tabs-onHover-borderColor);
4978
5225
  text-decoration: none;
4979
5226
  }
4980
- .a-Nav--tabs .a-Nav-item.disabled > a, .a-Nav--tabs .a-Nav-item.is-disabled > a {
5227
+ .a-Nav .a-Nav-list--tabs .a-Nav-item.disabled > a, .a-Nav .a-Nav-list--tabs .a-Nav-item.is-disabled > a {
4981
5228
  color: var(--Tabs-onDisabled-color);
4982
5229
  background: transparent;
4983
5230
  border-color: transparent;
4984
5231
  pointer-events: none;
4985
5232
  }
4986
- .a-Nav--tabs .a-Nav-item.active > a, .a-Nav--tabs .a-Nav-item.is-active > a {
5233
+ .a-Nav .a-Nav-list--tabs .a-Nav-item.active > a, .a-Nav .a-Nav-list--tabs .a-Nav-item.is-active > a {
4987
5234
  color: var(--Tabs-onActive-color);
4988
5235
  background: var(--Tabs-onActive-bg);
4989
5236
  border-color: var(--Tabs-onActive-borderColor);
4990
5237
  border-bottom-color: var(--Tabs-content-bg);
4991
5238
  }
4992
- .a-Nav--stacked {
5239
+ .a-Nav .a-Nav-list--stacked {
4993
5240
  min-height: 3.125rem;
4994
5241
  }
4995
- .a-Nav--stacked .a-Nav-item {
5242
+ .a-Nav .a-Nav-list--stacked .a-Nav-item, .a-Nav .a-Nav-list--stacked .a-Badge {
4996
5243
  position: relative;
5244
+ display: flex;
5245
+ flex-wrap: wrap;
5246
+ align-items: stretch;
5247
+ width: 100%;
4997
5248
  }
4998
- .a-Nav--stacked .a-Nav-item > a {
4999
- display: block;
5249
+ .a-Nav .a-Nav-list--stacked .a-Nav-item .a-Nav-itemDrager, .a-Nav .a-Nav-list--stacked .a-Badge .a-Nav-itemDrager {
5250
+ cursor: move;
5251
+ position: absolute;
5252
+ left: 0;
5253
+ top: 0.6875rem;
5254
+ display: none;
5255
+ }
5256
+ .a-Nav .a-Nav-list--stacked .a-Nav-item .a-Nav-itemDrager > .icon, .a-Nav .a-Nav-list--stacked .a-Nav-item .a-Nav-itemDrager > .a-Badge > .icon, .a-Nav .a-Nav-list--stacked .a-Badge .a-Nav-itemDrager > .icon, .a-Nav .a-Nav-list--stacked .a-Badge .a-Nav-itemDrager > .a-Badge > .icon {
5257
+ color: var(--icon-color);
5258
+ }
5259
+ .a-Nav .a-Nav-list--stacked .a-Nav-item .a-Nav-itemDrager > .icon:hover, .a-Nav .a-Nav-list--stacked .a-Nav-item .a-Nav-itemDrager > .a-Badge > .icon:hover, .a-Nav .a-Nav-list--stacked .a-Badge .a-Nav-itemDrager > .icon:hover, .a-Nav .a-Nav-list--stacked .a-Badge .a-Nav-itemDrager > .a-Badge > .icon:hover {
5260
+ color: var(--icon-onHover-color);
5261
+ }
5262
+ .a-Nav .a-Nav-list--stacked .a-Nav-item .a-Nav-itemDrager svg, .a-Nav .a-Nav-list--stacked .a-Badge .a-Nav-itemDrager svg {
5263
+ width: 1rem;
5264
+ height: 1rem;
5265
+ }
5266
+ .a-Nav .a-Nav-list--stacked .a-Nav-item > .a-Nav-item-badgeText, .a-Nav .a-Nav-list--stacked .a-Badge > .a-Nav-item-badgeText {
5267
+ position: absolute;
5268
+ top: 0;
5269
+ bottom: 0;
5270
+ width: 2.1875rem;
5271
+ overflow: hidden;
5272
+ }
5273
+ .a-Nav .a-Nav-list--stacked .a-Nav-item > .a-Nav-item-badgeText > span, .a-Nav .a-Nav-list--stacked .a-Badge > .a-Nav-item-badgeText > span {
5274
+ position: absolute;
5275
+ top: 0.125rem;
5276
+ left: -0.8125rem;
5277
+ transform: rotate(-45deg);
5278
+ width: 3.125rem;
5279
+ font-size: 12px;
5280
+ text-align: center;
5281
+ color: var(--white);
5282
+ background: var(--success);
5283
+ }
5284
+ .a-Nav .a-Nav-list--stacked .a-Nav-item > .a-Nav-item-atcions, .a-Nav .a-Nav-list--stacked .a-Badge > .a-Nav-item-atcions {
5285
+ display: flex;
5286
+ align-items: center;
5287
+ }
5288
+ .a-Nav .a-Nav-list--stacked .a-Nav-item > a,
5289
+ .a-Nav .a-Nav-list--stacked .a-Nav-item > .a-Badge > a, .a-Nav .a-Nav-list--stacked .a-Badge > a,
5290
+ .a-Nav .a-Nav-list--stacked .a-Badge > .a-Badge > a {
5291
+ display: flex;
5292
+ align-items: center;
5000
5293
  outline: none;
5001
5294
  color: var(--Nav-item-color);
5002
5295
  text-decoration: none;
5003
- padding: var(--gap-sm) var(--gap-base);
5296
+ padding: var(--gap-sm) var(--gap-sm);
5004
5297
  cursor: pointer;
5005
5298
  background: var(--Nav-item-bg);
5006
5299
  border-radius: var(--Nav-item-borderRadius);
5007
5300
  text-overflow: ellipsis;
5301
+ flex: 1;
5008
5302
  }
5009
- .a-Nav--stacked .a-Nav-item > a::after {
5010
- border-left: var(--Nav-item-onActive-borderLeft);
5011
- position: absolute;
5012
- left: 0;
5013
- top: 0;
5014
- content: "";
5015
- width: 1px;
5016
- height: 100%;
5017
- transform: scaleY(0.0001);
5018
- transition: transform 0.15s cubic-bezier(0.215, 0.61, 0.355, 1), opacity 0.15s cubic-bezier(0.215, 0.61, 0.355, 1);
5019
- }
5020
- .a-Nav--stacked .a-Nav-item.has-sub > a {
5021
- padding-right: calc(var(--gap-base) + var(--gap-sm));
5022
- }
5023
- .a-Nav--stacked .a-Nav-item > a:hover,
5024
- .a-Nav--stacked .a-Nav-item > a:focus {
5303
+ .a-Nav .a-Nav-list--stacked .a-Nav-item > a:hover,
5304
+ .a-Nav .a-Nav-list--stacked .a-Nav-item > a:focus,
5305
+ .a-Nav .a-Nav-list--stacked .a-Nav-item > a:hover + .a-Nav-item-atcions,
5306
+ .a-Nav .a-Nav-list--stacked .a-Nav-item > a:focus + .a-Nav-item-atcions,
5307
+ .a-Nav .a-Nav-list--stacked .a-Nav-item > .a-Badge > a:hover,
5308
+ .a-Nav .a-Nav-list--stacked .a-Nav-item > .a-Badge > a:focus,
5309
+ .a-Nav .a-Nav-list--stacked .a-Nav-item > .a-Badge > a:hover + .a-Nav-item-atcions,
5310
+ .a-Nav .a-Nav-list--stacked .a-Nav-item > .a-Badge > a:focus + .a-Nav-item-atcions, .a-Nav .a-Nav-list--stacked .a-Badge > a:hover,
5311
+ .a-Nav .a-Nav-list--stacked .a-Badge > a:focus,
5312
+ .a-Nav .a-Nav-list--stacked .a-Badge > a:hover + .a-Nav-item-atcions,
5313
+ .a-Nav .a-Nav-list--stacked .a-Badge > a:focus + .a-Nav-item-atcions,
5314
+ .a-Nav .a-Nav-list--stacked .a-Badge > .a-Badge > a:hover,
5315
+ .a-Nav .a-Nav-list--stacked .a-Badge > .a-Badge > a:focus,
5316
+ .a-Nav .a-Nav-list--stacked .a-Badge > .a-Badge > a:hover + .a-Nav-item-atcions,
5317
+ .a-Nav .a-Nav-list--stacked .a-Badge > .a-Badge > a:focus + .a-Nav-item-atcions {
5025
5318
  border-color: var(--Nav-item-onHover-color);
5026
5319
  text-decoration: none;
5027
5320
  background: var(--Nav-item-onHover-bg);
5321
+ z-index: 9999;
5322
+ }
5323
+ .a-Nav .a-Nav-list--stacked .a-Nav-item > a:hover > .a-Nav-itemDrager,
5324
+ .a-Nav .a-Nav-list--stacked .a-Nav-item > a:focus > .a-Nav-itemDrager,
5325
+ .a-Nav .a-Nav-list--stacked .a-Nav-item > .a-Badge > a:hover > .a-Nav-itemDrager,
5326
+ .a-Nav .a-Nav-list--stacked .a-Nav-item > .a-Badge > a:focus > .a-Nav-itemDrager, .a-Nav .a-Nav-list--stacked .a-Badge > a:hover > .a-Nav-itemDrager,
5327
+ .a-Nav .a-Nav-list--stacked .a-Badge > a:focus > .a-Nav-itemDrager,
5328
+ .a-Nav .a-Nav-list--stacked .a-Badge > .a-Badge > a:hover > .a-Nav-itemDrager,
5329
+ .a-Nav .a-Nav-list--stacked .a-Badge > .a-Badge > a:focus > .a-Nav-itemDrager {
5330
+ display: block;
5028
5331
  }
5029
- .a-Nav--stacked .a-Nav-item.disabled > a, .a-Nav--stacked .a-Nav-item.is-disabled > a {
5332
+ .a-Nav .a-Nav-list--stacked .a-Nav-item.disabled > a, .a-Nav .a-Nav-list--stacked .a-Nav-item.is-disabled > a, .a-Nav .a-Nav-list--stacked .a-Nav-item.disabled > .a-Badge > a, .a-Nav .a-Nav-list--stacked .a-Nav-item.is-disabled > .a-Badge > a, .a-Nav .a-Nav-list--stacked .a-Badge.disabled > a, .a-Nav .a-Nav-list--stacked .a-Badge.is-disabled > a, .a-Nav .a-Nav-list--stacked .a-Badge.disabled > .a-Badge > a, .a-Nav .a-Nav-list--stacked .a-Badge.is-disabled > .a-Badge > a {
5030
5333
  color: var(--Nav-item-onDisabled-color);
5031
5334
  background: transparent;
5032
5335
  pointer-events: none;
5033
5336
  }
5034
- .a-Nav--stacked .a-Nav-item.active > a, .a-Nav--stacked .a-Nav-item.is-active > a {
5337
+ .a-Nav .a-Nav-list--stacked .a-Nav-item.active, .a-Nav .a-Nav-list--stacked .a-Nav-item.is-active, .a-Nav .a-Nav-list--stacked .a-Badge.active, .a-Nav .a-Nav-list--stacked .a-Badge.is-active {
5338
+ background: var(--Nav-item-onActive-bg) !important;
5339
+ }
5340
+ .a-Nav .a-Nav-list--stacked .a-Nav-item.active > a, .a-Nav .a-Nav-list--stacked .a-Nav-item.is-active > .a-Nav-item-atcions, .a-Nav .a-Nav-list--stacked .a-Nav-item.is-active > a, .a-Nav .a-Nav-list--stacked .a-Nav-item.active > .a-Badge > a, .a-Nav .a-Nav-list--stacked .a-Nav-item.is-active > .a-Badge > .a-Nav-item-atcions, .a-Nav .a-Nav-list--stacked .a-Nav-item.is-active > .a-Badge > a, .a-Nav .a-Nav-list--stacked .a-Badge.active > a, .a-Nav .a-Nav-list--stacked .a-Badge.is-active > .a-Nav-item-atcions, .a-Nav .a-Nav-list--stacked .a-Badge.is-active > a, .a-Nav .a-Nav-list--stacked .a-Badge.active > .a-Badge > a, .a-Nav .a-Nav-list--stacked .a-Badge.is-active > .a-Badge > .a-Nav-item-atcions, .a-Nav .a-Nav-list--stacked .a-Badge.is-active > .a-Badge > a {
5035
5341
  color: var(--Nav-item-onActive-color);
5036
- background: var(--Nav-item-onActive-bg);
5037
- padding-left: 0.75rem;
5038
5342
  position: relative;
5039
5343
  }
5040
- .a-Nav--stacked .a-Nav-item.active > a::after, .a-Nav--stacked .a-Nav-item.is-active > a::after {
5344
+ .a-Nav .a-Nav-list--stacked .a-Nav-item.active > a::after, .a-Nav .a-Nav-list--stacked .a-Nav-item.is-active > .a-Nav-item-atcions::after, .a-Nav .a-Nav-list--stacked .a-Nav-item.is-active > a::after, .a-Nav .a-Nav-list--stacked .a-Nav-item.active > .a-Badge > a::after, .a-Nav .a-Nav-list--stacked .a-Nav-item.is-active > .a-Badge > .a-Nav-item-atcions::after, .a-Nav .a-Nav-list--stacked .a-Nav-item.is-active > .a-Badge > a::after, .a-Nav .a-Nav-list--stacked .a-Badge.active > a::after, .a-Nav .a-Nav-list--stacked .a-Badge.is-active > .a-Nav-item-atcions::after, .a-Nav .a-Nav-list--stacked .a-Badge.is-active > a::after, .a-Nav .a-Nav-list--stacked .a-Badge.active > .a-Badge > a::after, .a-Nav .a-Nav-list--stacked .a-Badge.is-active > .a-Badge > .a-Nav-item-atcions::after, .a-Nav .a-Nav-list--stacked .a-Badge.is-active > .a-Badge > a::after {
5041
5345
  transform: scaleY(1);
5042
5346
  }
5043
- .a-Nav--stacked .a-Nav-item.is-unfolded > .a-Nav-itemToggler {
5347
+ .a-Nav .a-Nav-list--stacked .a-Nav-item.is-unfolded > a .a-Nav-itemToggler, .a-Nav .a-Nav-list--stacked .a-Nav-item.is-unfolded > .a-Badge > a .a-Nav-itemToggler, .a-Nav .a-Nav-list--stacked .a-Badge.is-unfolded > a .a-Nav-itemToggler, .a-Nav .a-Nav-list--stacked .a-Badge.is-unfolded > .a-Badge > a .a-Nav-itemToggler {
5044
5348
  transform: rotate(180deg) scale(0.8);
5045
5349
  }
5046
- .a-Nav--stacked .a-Nav-item.is-unfolded > .a-Nav-subItems {
5350
+ .a-Nav .a-Nav-list--stacked .a-Nav-item.is-unfolded > .a-Nav-subItems, .a-Nav .a-Nav-list--stacked .a-Nav-item.is-unfolded > .a-Badge > .a-Nav-subItems, .a-Nav .a-Nav-list--stacked .a-Badge.is-unfolded > .a-Nav-subItems, .a-Nav .a-Nav-list--stacked .a-Badge.is-unfolded > .a-Badge > .a-Nav-subItems {
5047
5351
  display: block;
5048
5352
  }
5049
- .a-Nav--stacked .a-Nav-item .a-Nav-spinner {
5353
+ .a-Nav .a-Nav-list--stacked .a-Nav-item .a-Nav-spinner, .a-Nav .a-Nav-list--stacked .a-Badge .a-Nav-spinner {
5050
5354
  position: absolute;
5051
5355
  right: 0.625rem;
5052
5356
  top: 0.5rem;
5053
5357
  }
5054
- .a-Nav--stacked .a-Nav-item .a-Nav-itemToggler {
5055
- position: absolute;
5056
- right: 0;
5057
- top: 0.1875rem;
5058
- width: 1.875rem;
5059
- height: 1.875rem;
5358
+ .a-Nav .a-Nav-list--stacked .a-Nav-item .a-Nav-itemToggler, .a-Nav .a-Nav-list--stacked .a-Badge .a-Nav-itemToggler {
5359
+ float: left;
5360
+ margin-right: 0.625rem;
5361
+ height: 1.5rem;
5060
5362
  text-align: center;
5061
- line-height: 1.875rem;
5363
+ line-height: 1.5rem;
5062
5364
  vertical-align: middle;
5063
5365
  cursor: pointer;
5064
5366
  transform: scale(0.8);
5065
5367
  transition: transform var(--animation-duration);
5066
5368
  }
5067
- .a-Nav--stacked .a-Nav-item .a-Nav-itemToggler > svg {
5369
+ .a-Nav .a-Nav-list--stacked .a-Nav-item .a-Nav-itemToggler > svg, .a-Nav .a-Nav-list--stacked .a-Badge .a-Nav-itemToggler > svg {
5068
5370
  width: 10px;
5069
5371
  height: 10px;
5070
5372
  top: 0;
5071
5373
  }
5072
- .a-Nav--stacked .a-Nav-item .a-Nav-subItems {
5374
+ .a-Nav .a-Nav-list--stacked .a-Nav-item .a-Nav-subItems, .a-Nav .a-Nav-list--stacked .a-Badge .a-Nav-subItems {
5073
5375
  display: none;
5074
5376
  padding-left: 0;
5075
5377
  list-style: none;
5378
+ width: 100%;
5076
5379
  }
5077
- .a-Nav--stacked .a-Nav-item .a-Nav-item {
5380
+ .a-Nav .a-Nav-list--stacked .a-Nav-item .a-Nav-item, .a-Nav .a-Nav-list--stacked .a-Badge .a-Nav-item {
5078
5381
  font-size: var(--Nav-subItem-fontSize);
5079
5382
  }
5383
+ .a-Nav .a-Nav-dropIndicator {
5384
+ position: absolute;
5385
+ background: var(--Nav-item-onActive-color);
5386
+ height: 2px;
5387
+ }
5080
5388
 
5081
5389
  .a-Page {
5082
5390
  width: 100%;
5083
5391
  height: 100%;
5392
+ background: var(--Page-main-bg);
5084
5393
  }
5085
5394
  .a-Page-header {
5086
5395
  padding: var(--Page-header-paddingY) var(--Page-header-paddingX);
5087
5396
  }
5088
5397
  .a-Page-main {
5089
- background: var(--Page-main-bg);
5090
5398
  height: 100%;
5091
5399
  display: flex;
5092
5400
  flex-direction: column;
@@ -5099,10 +5407,8 @@ input[type=button].a-Button--block {
5099
5407
  }
5100
5408
  .a-Page-main > .a-Page-header {
5101
5409
  border-bottom: var(--borderWidth) solid var(--borderColor);
5102
- background: var(--Page-header-bg);
5103
5410
  }
5104
5411
  .a-Page-headerRow {
5105
- background: var(--Page-header-bg);
5106
5412
  border-bottom: var(--borderWidth) solid var(--borderColor);
5107
5413
  display: flex;
5108
5414
  flex-direction: row;
@@ -5142,10 +5448,6 @@ input[type=button].a-Button--block {
5142
5448
  margin-left: var(--gap-xs);
5143
5449
  }
5144
5450
 
5145
- .a-Page-aside {
5146
- background: var(--Page-aside-bg);
5147
- }
5148
-
5149
5451
  @media (min-width: 768px) {
5150
5452
  .a-Page-aside {
5151
5453
  min-width: var(--Page-aside-width);
@@ -5650,8 +5952,12 @@ input[type=button].a-Button--block {
5650
5952
  .a-Spinner--icon {
5651
5953
  background: transparent;
5652
5954
  animation: spin 2s linear infinite;
5653
- width: auto;
5654
- height: auto;
5955
+ width: var(--fontSizeLg);
5956
+ height: var(--fontSizeLg);
5957
+ }
5958
+ .a-Spinner--icon svg.icon {
5959
+ width: var(--fontSizeLg);
5960
+ height: var(--fontSizeLg);
5655
5961
  }
5656
5962
 
5657
5963
  .a-Spinner--overlay {
@@ -5821,7 +6127,7 @@ input[type=button].a-Button--block {
5821
6127
  height: var(--DropDown-menu-height);
5822
6128
  vertical-align: middle;
5823
6129
  user-select: none;
5824
- color: var(--link-color);
6130
+ color: var(--DropDown-menuItem-color);
5825
6131
  text-decoration: var(--link-decoration);
5826
6132
  }
5827
6133
  .a-DropDown-menuItem:hover, .a-DropDown-menu > li:hover {
@@ -5829,6 +6135,7 @@ input[type=button].a-Button--block {
5829
6135
  color: var(--DropDown-menuItem-onHover-color);
5830
6136
  }
5831
6137
  .a-DropDown-menuItem.is-active, .a-DropDown-menu > li.is-active {
6138
+ background: var(--DropDown-menuItem-onHover-bg);
5832
6139
  color: var(--DropDown-menuItem-onActive-color);
5833
6140
  }
5834
6141
  .a-DropDown-menuItem:not(.is-disabled), .a-DropDown-menuItem:not(.disabled), .a-DropDown-menu > li:not(.is-disabled), .a-DropDown-menu > li:not(.disabled) {
@@ -5866,22 +6173,27 @@ input[type=button].a-Button--block {
5866
6173
  }
5867
6174
 
5868
6175
  .a-Collapse {
5869
- border: none;
6176
+ border: var(--Collapse-border);
5870
6177
  padding: 0;
5871
6178
  margin-bottom: var(--Form-item-gap);
5872
6179
  }
5873
6180
  .a-Collapse-header {
5874
- font-size: var(--fontSizeMd);
5875
- font-weight: var(--fontWeightNormal);
6181
+ font-size: var(--Collapse-header-fontSize);
6182
+ font-weight: var(--Collapse-header-fontWeight);
5876
6183
  color: var(--text--loud-color);
5877
- padding: var(--gap-xs) 0;
5878
- border-bottom: var(--borderWidth) solid var(--borderColorLight);
6184
+ padding: var(--Collapse-header-padding);
6185
+ margin: 0;
6186
+ border-bottom: var(--borderWidth) solid var(--Collapse-border-color);
6187
+ background: var(--Collapse-header-bg);
6188
+ }
6189
+ .a-Collapse-header:hover {
6190
+ background: var(--Collapse-header-onHover-bg);
5879
6191
  }
5880
6192
  .a-Collapse-arrow {
5881
6193
  display: inline-block;
5882
6194
  width: 1rem;
5883
6195
  text-align: center;
5884
- margin-left: var(--gap-xs);
6196
+ margin-right: 0.5rem;
5885
6197
  cursor: pointer;
5886
6198
  }
5887
6199
  .a-Collapse-arrow:before {
@@ -5897,10 +6209,16 @@ input[type=button].a-Button--block {
5897
6209
  transform: rotate(135deg);
5898
6210
  transform-origin: 50% 50%;
5899
6211
  }
6212
+ .a-Collapse-TplField {
6213
+ display: inline-block;
6214
+ }
5900
6215
  .a-Collapse.is-collapsed .a-Collapse-arrow:before {
5901
6216
  transform: rotate(45deg);
5902
6217
  transform-origin: 0% 50%;
5903
6218
  }
6219
+ .a-Collapse.is-collapsed .a-Collapse-header {
6220
+ border-bottom: var(--Collapse-header-collapsed-borderBottom);
6221
+ }
5904
6222
  .a-Collapse--collapsable .a-Collapse-header {
5905
6223
  cursor: pointer;
5906
6224
  user-select: none;
@@ -5921,13 +6239,19 @@ input[type=button].a-Button--block {
5921
6239
  transform: rotate(135deg);
5922
6240
  transform-origin: 0% 50%;
5923
6241
  }
5924
- .a-Collapse-content {
6242
+ .a-Collapse-contentWrapper {
5925
6243
  transition: height var(--animation-duration) ease;
5926
6244
  }
5927
- .a-Collapse-content.in, .a-Collapse-content.out {
6245
+ .a-Collapse-contentWrapper.in, .a-Collapse-contentWrapper.out {
5928
6246
  height: 0;
5929
6247
  overflow: hidden;
5930
6248
  }
6249
+ .a-Collapse-content {
6250
+ padding: var(--Collapse-content-padding);
6251
+ color: var(--body-color);
6252
+ font-size: var(--Collapse-content-fontSize);
6253
+ font-weight: var(--Collapse-content-fontWeight);
6254
+ }
5931
6255
 
5932
6256
  .a-ColorField {
5933
6257
  display: inline-block;
@@ -6791,6 +7115,17 @@ input[type=button].a-Button--block {
6791
7115
  vertical-align: middle !important;
6792
7116
  text-align: center;
6793
7117
  }
7118
+ .a-Table-searchableForm {
7119
+ background: var(--Table-searchableForm-backgroundColor);
7120
+ border-radius: var(--Table-searchableForm-borderRadius);
7121
+ }
7122
+ .a-Table-searchableForm-footer {
7123
+ padding: var(--Panel-footerPadding);
7124
+ clear: both;
7125
+ }
7126
+ .a-Table-searchableForm-checkbox > div > .a-CheckboxControl {
7127
+ padding-top: 0;
7128
+ }
6794
7129
  .a-Table-header {
6795
7130
  padding: var(--Table-toolbar-marginY) var(--Table-toolbar-marginX);
6796
7131
  }
@@ -6925,6 +7260,7 @@ input[type=button].a-Button--block {
6925
7260
  border-bottom: var(--Table-borderWidth) solid var(--Table-borderColor);
6926
7261
  }
6927
7262
  .a-Table-table > tbody > tr {
7263
+ position: relative;
6928
7264
  background: transparent;
6929
7265
  }
6930
7266
  .a-Table-table > tbody > tr + tr {
@@ -7825,7 +8161,7 @@ input[type=button].a-Button--block {
7825
8161
  top: var(--Table-borderWidth);
7826
8162
  bottom: 0;
7827
8163
  right: 0;
7828
- padding-left: 3.125rem;
8164
+ padding-left: 5rem;
7829
8165
  padding-right: var(--TableCell-paddingX);
7830
8166
  display: flex;
7831
8167
  align-items: center;
@@ -7918,6 +8254,11 @@ input[type=button].a-Button--block {
7918
8254
  visibility: hidden;
7919
8255
  position: absolute;
7920
8256
  }
8257
+ .a-Table-badge {
8258
+ position: absolute;
8259
+ top: 0;
8260
+ left: 0;
8261
+ }
7921
8262
 
7922
8263
  .a-InputTable-toolbar {
7923
8264
  display: flex;
@@ -7945,6 +8286,203 @@ input[type=button].a-Button--block {
7945
8286
  margin-right: 0.625rem;
7946
8287
  }
7947
8288
 
8289
+ .a-ColumnToggler {
8290
+ position: relative;
8291
+ display: inline-block;
8292
+ }
8293
+ .a-ColumnToggler-caret {
8294
+ margin-left: var(--DropDown-caret-marginLeft);
8295
+ display: inline-block;
8296
+ vertical-align: top;
8297
+ transition: transform var(--animation-duration) ease;
8298
+ }
8299
+ .a-ColumnToggler-caret > svg {
8300
+ width: 0.625rem;
8301
+ height: 0.625rem;
8302
+ top: 0.125em;
8303
+ }
8304
+ .a-ColumnToggler.is-opened .a-ColumnToggler-caret {
8305
+ transform: rotate(180deg);
8306
+ }
8307
+ .a-ColumnToggler.is-actived > .a-Button {
8308
+ color: var(--link-color);
8309
+ }
8310
+ .a-ColumnToggler--block {
8311
+ display: block;
8312
+ }
8313
+ .a-ColumnToggler--block .a-Button {
8314
+ display: block;
8315
+ }
8316
+ .a-ColumnToggler-menu {
8317
+ position: absolute;
8318
+ z-index: 1000;
8319
+ top: 100%;
8320
+ left: 0;
8321
+ margin: 0.0625rem 0 0;
8322
+ background: var(--DropDown-menu-bg);
8323
+ list-style: none;
8324
+ padding: var(--DropDown-menu-paddingY) var(--DropDown-menu-paddingX);
8325
+ border: var(--DropDown-menu-borderWidth) solid var(--DropDown-menu-borderColor);
8326
+ border-radius: var(--DropDown-menu-borderRadius);
8327
+ box-shadow: var(--DropDown-menu-boxShadow);
8328
+ min-width: var(--DropDown-menu-minWidth);
8329
+ text-align: left;
8330
+ }
8331
+ .a-ColumnToggler--alignRight .a-ColumnToggler-menu {
8332
+ left: auto;
8333
+ right: 0;
8334
+ }
8335
+ .a-ColumnToggler-menuItem, .a-ColumnToggler-menu > li {
8336
+ padding: var(--DropDown-menuItem-paddingY) var(--DropDown-menuItem-paddingX);
8337
+ white-space: nowrap;
8338
+ box-sizing: border-box;
8339
+ height: var(--DropDown-menu-height);
8340
+ vertical-align: middle;
8341
+ user-select: none;
8342
+ color: var(--link-color);
8343
+ text-decoration: var(--link-decoration);
8344
+ }
8345
+ .a-ColumnToggler-menuItem:hover, .a-ColumnToggler-menu > li:hover {
8346
+ background: var(--DropDown-menuItem-onHover-bg);
8347
+ color: var(--DropDown-menuItem-onHover-color);
8348
+ }
8349
+ .a-ColumnToggler-menuItem.is-active, .a-ColumnToggler-menu > li.is-active {
8350
+ color: var(--DropDown-menuItem-onActive-color);
8351
+ }
8352
+ .a-ColumnToggler-menuItem:not(.is-disabled), .a-ColumnToggler-menuItem:not(.disabled), .a-ColumnToggler-menu > li:not(.is-disabled), .a-ColumnToggler-menu > li:not(.disabled) {
8353
+ cursor: pointer;
8354
+ }
8355
+ .a-ColumnToggler-menuItem.is-disabled, .a-ColumnToggler-menu > li.is-disabled {
8356
+ cursor: not-allowed;
8357
+ color: var(--DropDown-menuItem-onDisabled-color);
8358
+ filter: grayscale(80%);
8359
+ }
8360
+ .a-ColumnToggler-menuItem.a-DropDown-divider, .a-ColumnToggler-menu > li.a-DropDown-divider {
8361
+ height: 0.0625rem;
8362
+ margin: 0.5625rem 0;
8363
+ overflow: hidden;
8364
+ background: var(--DropDown-menu-borderColor);
8365
+ padding: 0;
8366
+ }
8367
+ .a-ColumnToggler-menu > li a {
8368
+ color: inherit;
8369
+ display: block;
8370
+ text-decoration: none;
8371
+ }
8372
+ .a-ColumnToggler-popover {
8373
+ border: none;
8374
+ box-shadow: none;
8375
+ }
8376
+ .a-ColumnToggler > .a-Button {
8377
+ min-width: unset;
8378
+ }
8379
+ .a-ColumnToggler-modal {
8380
+ display: flex;
8381
+ flex-flow: column nowrap;
8382
+ justify-content: space-between;
8383
+ align-items: center;
8384
+ width: 25rem;
8385
+ padding: var(--ColumnToggler-lineHeight);
8386
+ margin-top: calc(50vh - 100px);
8387
+ border-radius: var(--ColumnToggler-borderRadius);
8388
+ background: var(--ColumnToggler-backgroundColor);
8389
+ box-shadow: 0 4px 5px 0 rgba(21, 26, 38, 0.06), 0 1px 10px 0 rgba(21, 26, 38, 0.05), 0 2px 4px -1px rgba(21, 26, 38, 0.04);
8390
+ }
8391
+ .a-ColumnToggler-modal-header {
8392
+ width: 100%;
8393
+ display: flex;
8394
+ flex-flow: row nowrap;
8395
+ justify-content: space-between;
8396
+ align-items: center;
8397
+ }
8398
+ .a-ColumnToggler-modal-header a,
8399
+ .a-ColumnToggler-modal-header span {
8400
+ display: inline-block;
8401
+ }
8402
+ .a-ColumnToggler-modal-header .a-ColumnToggler-modal-title {
8403
+ opacity: 0.95;
8404
+ font-size: var(--fontSizeMd);
8405
+ color: var(--ColumnToggler-title-fontColor);
8406
+ line-height: var(--ColumnToggler-lineHeight);
8407
+ font-weight: bold;
8408
+ }
8409
+ .a-ColumnToggler-modal-content {
8410
+ padding: 0;
8411
+ width: 100%;
8412
+ list-style: none;
8413
+ margin: 0.5rem 0;
8414
+ }
8415
+ .a-ColumnToggler-modal-content .a-ColumnToggler-menuItem {
8416
+ color: var(--ColumnToggler-title-fontColor);
8417
+ background: var(--ColumnToggler-item-backgroundColor);
8418
+ border-radius: 0.125rem;
8419
+ font-size: var(--fontSizeSm);
8420
+ padding: 0.25rem 0.5rem;
8421
+ height: var(--ColumnToggler-lineHeight);
8422
+ width: calc((100% - 24px) / 3);
8423
+ float: left;
8424
+ margin: 0.25rem;
8425
+ text-overflow: ellipsis;
8426
+ white-space: nowrap;
8427
+ overflow: hidden;
8428
+ }
8429
+ .a-ColumnToggler-modal-content .a-ColumnToggler-menuItem:hover {
8430
+ background: var(--ColumnToggler-item-backgroundColor-onHover);
8431
+ }
8432
+ .a-ColumnToggler-modal-content .a-ColumnToggler-menuItem--dragging {
8433
+ border: 1px solid var(--link-color);
8434
+ }
8435
+ .a-ColumnToggler-modal-content .a-ColumnToggler-menuItem label > i {
8436
+ height: var(--fontSizeLg);
8437
+ width: var(--fontSizeLg);
8438
+ vertical-align: top;
8439
+ }
8440
+ .a-ColumnToggler-modal-content .a-ColumnToggler-menuItem-dragBar {
8441
+ margin-left: 0;
8442
+ margin-right: var(--gap-xs);
8443
+ cursor: move;
8444
+ color: #d8d8d8;
8445
+ }
8446
+ .a-ColumnToggler-modal-footer {
8447
+ width: 100%;
8448
+ display: flex;
8449
+ flex-flow: row nowrap;
8450
+ justify-content: space-between;
8451
+ align-items: center;
8452
+ }
8453
+ .a-ColumnToggler-modal-footer .a-ColumnToggler-modeSelect {
8454
+ color: var(--ColumnToggler-fontColor);
8455
+ font-size: var(--fontSizeSm);
8456
+ }
8457
+ .a-ColumnToggler-modal-footer .a-ColumnToggler-modeSelect.is-actived {
8458
+ color: var(--link-color);
8459
+ }
8460
+ .a-ColumnToggler-modal-footer > div {
8461
+ display: flex;
8462
+ flex-flow: row nowrap;
8463
+ justify-content: space-between;
8464
+ align-items: center;
8465
+ }
8466
+ .a-ColumnToggler-modal-footer > div:first-child {
8467
+ justify-content: flex-start;
8468
+ }
8469
+ .a-ColumnToggler-modal-footer > div:first-child a {
8470
+ display: inline-block;
8471
+ }
8472
+ .a-ColumnToggler-modal-footer > div:last-child {
8473
+ justify-content: flex-end;
8474
+ }
8475
+ .a-ColumnToggler-modal-footer > div:last-child button {
8476
+ width: 72px;
8477
+ }
8478
+
8479
+ .a-ColumnToggler-tooltip {
8480
+ border: none;
8481
+ }
8482
+ .a-ColumnToggler-tooltip .a-Tooltip-arrow::before {
8483
+ border-top-color: transparent;
8484
+ }
8485
+
7948
8486
  .a-List {
7949
8487
  position: relative;
7950
8488
  }
@@ -8624,6 +9162,7 @@ input[type=button].a-Button--block {
8624
9162
  height: 10px;
8625
9163
  background: #ebebeb;
8626
9164
  overflow: hidden;
9165
+ border-radius: var(--Progress-borderRadius);
8627
9166
  }
8628
9167
  .a-Progress-bar {
8629
9168
  float: left;
@@ -8635,6 +9174,7 @@ input[type=button].a-Button--block {
8635
9174
  text-align: center;
8636
9175
  background: var(--primary);
8637
9176
  transition: width var(--animation-duration) ease;
9177
+ border-radius: var(--Progress-borderRadius);
8638
9178
  }
8639
9179
  .a-Progress-bar--stripe {
8640
9180
  background-image: linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);
@@ -9241,7 +9781,7 @@ input[type=button].a-Button--block {
9241
9781
  display: none;
9242
9782
  }
9243
9783
  .a-ImageGallery-item.is-active {
9244
- border: 1px solid #108cee;
9784
+ border: 1px solid var(--primary);
9245
9785
  }
9246
9786
  .a-ImageGallery-item.is-active:after {
9247
9787
  display: none;
@@ -9266,6 +9806,7 @@ input[type=button].a-Button--block {
9266
9806
  }
9267
9807
  .a-Image-thumbWrap {
9268
9808
  position: relative;
9809
+ height: 100%;
9269
9810
  }
9270
9811
  .a-Image-image {
9271
9812
  display: block;
@@ -9362,7 +9903,7 @@ input[type=button].a-Button--block {
9362
9903
  color: var(--text--loud-color);
9363
9904
  }
9364
9905
  .a-Image-overlay {
9365
- background: rgba(0, 0, 0, 0.6);
9906
+ background: rgba(8, 14, 26, 0.5);
9366
9907
  position: absolute;
9367
9908
  width: 100%;
9368
9909
  height: 100%;
@@ -9891,7 +10432,7 @@ input[type=button].a-Button--block {
9891
10432
  height: 1px;
9892
10433
  left: 100%;
9893
10434
  width: 9999px;
9894
- padding-right: 10px;
10435
+ padding-right: 0.625rem;
9895
10436
  background-color: var(--Steps-line-bg);
9896
10437
  }
9897
10438
  .a-Steps .a-StepsItem-containerWrapper .a-StepsItem-body .a-StepsItem-title.is-success:after {
@@ -10005,8 +10546,6 @@ fieldset.a-Collapse > legend {
10005
10546
  border-bottom: 0;
10006
10547
  display: flex;
10007
10548
  flex-direction: row;
10008
- justify-content: space-between;
10009
- width: 100%;
10010
10549
  }
10011
10550
  fieldset.a-Collapse--xs {
10012
10551
  padding: 20px 5px 5px 5px;
@@ -10077,6 +10616,9 @@ fieldset.a-Collapse--lg:after {
10077
10616
  .a-Form-group {
10078
10617
  margin-bottom: var(--Form-item-gap);
10079
10618
  }
10619
+ .a-Form-group:last-child {
10620
+ margin-bottom: 0;
10621
+ }
10080
10622
  .a-Form-value > .a-Form-group {
10081
10623
  margin-bottom: var(--Form-input-marginBottom);
10082
10624
  }
@@ -10607,6 +11149,13 @@ fieldset.a-Collapse--lg:after {
10607
11149
  .has-error--maxLength .a-TextControl-counter {
10608
11150
  color: var(--danger);
10609
11151
  }
11152
+ .a-TextControl-input:hover {
11153
+ border-color: var(--Form-input-onHover-borderColor);
11154
+ }
11155
+
11156
+ .a-TextControl.is-disabled-input input {
11157
+ color: var(--Form-input-onDisabled-color);
11158
+ }
10610
11159
 
10611
11160
  .a-TextareaControl {
10612
11161
  position: relative;
@@ -10634,10 +11183,16 @@ fieldset.a-Collapse--lg:after {
10634
11183
  .a-TextareaControl > textarea::placeholder {
10635
11184
  color: var(--Form-input-placeholderColor);
10636
11185
  }
11186
+ .a-TextareaControl > textarea:hover {
11187
+ border-color: var(--Form-input-onHover-borderColor);
11188
+ }
10637
11189
  .a-TextareaControl > textarea:focus, .a-TextareaControl.is-focused > textarea {
10638
11190
  border-color: var(--Form-input-onFocused-borderColor);
10639
11191
  box-shadow: var(--Form-input-boxShadow);
10640
11192
  }
11193
+ .a-TextareaControl > textarea:focus:hover, .a-TextareaControl.is-focused > textarea:hover {
11194
+ border-color: var(--Form-input-onFocused-borderColor);
11195
+ }
10641
11196
  .a-TextareaControl.is-disabled > textarea, .a-TextareaControl > textarea[disabled] {
10642
11197
  background: #e5e7eb;
10643
11198
  color: var(--text--muted-color);
@@ -11825,6 +12380,7 @@ fieldset.a-Collapse--lg:after {
11825
12380
  color: var(--ListControl-item-color);
11826
12381
  transition: var(--ListControl-item-transition);
11827
12382
  max-width: calc(12.5rem + 2 * var(--ListControl-item-paddingX));
12383
+ border-radius: var(--ListControl-item-borderRadius);
11828
12384
  }
11829
12385
  .a-ListControl-item:not(.is-disabled) {
11830
12386
  cursor: pointer;
@@ -11914,7 +12470,7 @@ fieldset.a-Collapse--lg:after {
11914
12470
  white-space: nowrap;
11915
12471
  color: var(--DatePicker-color);
11916
12472
  background: var(--DatePicker-bg);
11917
- border-radius: var(--DatePicker-borderRadius);
12473
+ border-radius: var(--LocationPicker-borderRadius);
11918
12474
  }
11919
12475
  .a-LocationPicker:not(.is-disabled) {
11920
12476
  cursor: pointer;
@@ -12045,6 +12601,7 @@ fieldset.a-Collapse--lg:after {
12045
12601
  padding: var(--ColorPicker-paddingY) var(--ColorPicker-paddingX);
12046
12602
  background: var(--ColorPicker-bg);
12047
12603
  color: var(--ColorPicker-color);
12604
+ border-radius: var(--borderRadius);
12048
12605
  }
12049
12606
  .a-ColorPicker:not(.is-disabled) {
12050
12607
  cursor: pointer;
@@ -12182,6 +12739,8 @@ fieldset.a-Collapse--lg:after {
12182
12739
  .a-DatePicker-toggler {
12183
12740
  cursor: pointer;
12184
12741
  color: var(--DatePicker-iconColor);
12742
+ display: inline-flex;
12743
+ align-items: center;
12185
12744
  }
12186
12745
  .a-DatePicker-toggler:hover {
12187
12746
  color: var(--DatePicker-onHover-iconColor);
@@ -12434,6 +12993,11 @@ fieldset.a-Collapse--lg:after {
12434
12993
  background: var(--Calendar-btn-onHover-bg);
12435
12994
  border-color: var(--Calendar-btn-onHover-border);
12436
12995
  }
12996
+ .rdtBtn:not(:disabled):not(.is-disabled):hover:active {
12997
+ color: var(--Calendar-btn-onActive-color);
12998
+ background: var(--Calendar-btn-onActive-bg);
12999
+ border-color: var(--Calendar-btn-onActive-border);
13000
+ }
12437
13001
  .rdtBtn:hover:focus {
12438
13002
  box-shadow: var(--Button-boxShadow);
12439
13003
  }
@@ -12452,6 +13016,11 @@ fieldset.a-Collapse--lg:after {
12452
13016
  background: var(--Calendar-btnCancel-onHover-bg);
12453
13017
  border-color: var(--Calendar-btnCancel-onHover-border);
12454
13018
  }
13019
+ .rdtBtnCancel:not(:disabled):not(.is-disabled):hover:active {
13020
+ color: var(--Calendar-btnCancel-onActive-color);
13021
+ background: var(--Calendar-btnCancel-onActive-bg);
13022
+ border-color: var(--Calendar-btnCancel-onActive-border);
13023
+ }
12455
13024
  .rdtBtnCancel:hover:focus {
12456
13025
  box-shadow: var(--Button-boxShadow);
12457
13026
  }
@@ -12619,6 +13188,8 @@ td.rdtQuarter.rdtDisabled > span {
12619
13188
  .a-DateRangePicker-toggler {
12620
13189
  cursor: pointer;
12621
13190
  color: var(--DatePicker-iconColor);
13191
+ display: inline-flex;
13192
+ align-items: center;
12622
13193
  }
12623
13194
  .a-DateRangePicker-toggler:hover {
12624
13195
  color: var(--DatePicker-onHover-iconColor);
@@ -12723,9 +13294,11 @@ td.rdtQuarter.rdtDisabled > span {
12723
13294
  width: 7.5rem;
12724
13295
  height: 7.5rem;
12725
13296
  display: inline-flex;
13297
+ flex-direction: column;
12726
13298
  justify-content: center;
12727
13299
  align-items: center;
12728
13300
  border: var(--borderWidth) solid var(--borderColor);
13301
+ border-radius: var(--ImageControl-addBtn-borderRadius);
12729
13302
  cursor: pointer;
12730
13303
  margin-right: var(--gap-base);
12731
13304
  color: var(--ImageControl-addBtn-color);
@@ -12739,13 +13312,19 @@ td.rdtQuarter.rdtDisabled > span {
12739
13312
  background: var(--ImageControl-addBtn-onHover-bg);
12740
13313
  border-color: var(--ImageControl-addBtn-onHover-border);
12741
13314
  }
13315
+ .a-ImageControl-addBtn:not(:disabled):not(.is-disabled):hover:active {
13316
+ color: var(--ImageControl-addBtn-onActive-color);
13317
+ background: var(--ImageControl-addBtn-onActive-bg);
13318
+ border-color: var(--ImageControl-addBtn-onActive-border);
13319
+ }
12742
13320
  .a-ImageControl-addBtn:hover:focus {
12743
13321
  box-shadow: var(--Button-boxShadow);
12744
13322
  }
12745
13323
  .a-ImageControl-addBtn > svg {
12746
- width: 2.5rem;
12747
- height: 2.5rem;
13324
+ width: 1.5rem;
13325
+ height: 1.5rem;
12748
13326
  top: 0;
13327
+ margin-bottom: 0.5rem;
12749
13328
  }
12750
13329
  .a-ImageControl-addBtn.is-disabled {
12751
13330
  pointer-events: none;
@@ -12779,6 +13358,7 @@ td.rdtQuarter.rdtDisabled > span {
12779
13358
  }
12780
13359
  .a-ImageControl-item {
12781
13360
  border: var(--borderWidth) solid var(--borderColor);
13361
+ border-radius: var(--ImageControl-addBtn-borderRadius);
12782
13362
  vertical-align: top;
12783
13363
  padding: var(--gap-xs);
12784
13364
  display: inline-block;
@@ -12829,6 +13409,7 @@ td.rdtQuarter.rdtDisabled > span {
12829
13409
  }
12830
13410
  .a-ImageControl-progressValue {
12831
13411
  height: 5px;
13412
+ border-radius: var(--ImageControl-progress-borderRadius);
12832
13413
  display: block;
12833
13414
  background: var(--info);
12834
13415
  min-width: 10%;
@@ -12921,12 +13502,12 @@ td.rdtQuarter.rdtDisabled > span {
12921
13502
  outline: none;
12922
13503
  }
12923
13504
  .a-FileControl-selectBtn {
12924
- width: 7.5rem;
13505
+ display: flex;
13506
+ align-items: center;
12925
13507
  }
12926
13508
  .a-FileControl-selectBtn > svg {
12927
- margin-right: 10px;
12928
- width: pxrem(16px);
12929
- height: pxrem(16px);
13509
+ width: 0.875rem;
13510
+ height: 0.875rem;
12930
13511
  }
12931
13512
  .a-FileControl-description {
12932
13513
  margin-left: 10px;
@@ -13019,6 +13600,7 @@ td.rdtQuarter.rdtDisabled > span {
13019
13600
  .a-FileControl-progress > span {
13020
13601
  display: block;
13021
13602
  background: var(--info);
13603
+ border-radius: var(--FileControl-progress-borderRadius);
13022
13604
  height: 100%;
13023
13605
  min-width: 10%;
13024
13606
  transition: ease-out width var(--animation-duration);
@@ -13815,6 +14397,15 @@ td.rdtQuarter.rdtDisabled > span {
13815
14397
  .a-Combo-addBtn > .pull-right {
13816
14398
  margin-left: var(--Combo-addBtn-paddingX);
13817
14399
  }
14400
+ .a-Combo-addBtn .a-Button--loading:first-child:not(:last-child):not(.pull-right),
14401
+ .a-Combo-addBtn > svg.icon:not(:last-child):not(.pull-right),
14402
+ .a-Combo-addBtn > .pull-left {
14403
+ margin-right: var(--Combo-addBtn-paddingX);
14404
+ }
14405
+ .a-Combo-addBtn .a-Button--loading:last-child:not(:first-child):not(.pull-left),
14406
+ .a-Combo-addBtn > .pull-right {
14407
+ margin-left: var(--Combo-addBtn-paddingX);
14408
+ }
13818
14409
  .a-Combo-addBtn img.a-Button-icon {
13819
14410
  height: var(--Button-fontSize);
13820
14411
  vertical-align: middle;
@@ -13824,6 +14415,11 @@ td.rdtQuarter.rdtDisabled > span {
13824
14415
  background: var(--Combo-addBtn-onHover-bg);
13825
14416
  border-color: var(--Combo-addBtn-onHover-border);
13826
14417
  }
14418
+ .a-Combo-addBtn:not(:disabled):not(.is-disabled):hover:active {
14419
+ color: var(--Combo-addBtn-onActive-color);
14420
+ background: var(--Combo-addBtn-onActive-bg);
14421
+ border-color: var(--Combo-addBtn-onActive-border);
14422
+ }
13827
14423
  .a-Combo-addBtn:hover:focus {
13828
14424
  box-shadow: var(--Button-boxShadow);
13829
14425
  }
@@ -14373,6 +14969,15 @@ td.rdtQuarter.rdtDisabled > span {
14373
14969
  .a-TagControl-sugItem > .pull-right {
14374
14970
  margin-left: var(--TagControl-sugBtn-paddingX);
14375
14971
  }
14972
+ .a-TagControl-sugItem .a-Button--loading:first-child:not(:last-child):not(.pull-right),
14973
+ .a-TagControl-sugItem > svg.icon:not(:last-child):not(.pull-right),
14974
+ .a-TagControl-sugItem > .pull-left {
14975
+ margin-right: var(--TagControl-sugBtn-paddingX);
14976
+ }
14977
+ .a-TagControl-sugItem .a-Button--loading:last-child:not(:first-child):not(.pull-left),
14978
+ .a-TagControl-sugItem > .pull-right {
14979
+ margin-left: var(--TagControl-sugBtn-paddingX);
14980
+ }
14376
14981
  .a-TagControl-sugItem img.a-Button-icon {
14377
14982
  height: var(--Button-fontSize);
14378
14983
  vertical-align: middle;
@@ -14382,6 +14987,11 @@ td.rdtQuarter.rdtDisabled > span {
14382
14987
  background: var(--TagControl-sugBtn-onHover-bg);
14383
14988
  border-color: var(--TagControl-sugBtn-onHover-border);
14384
14989
  }
14990
+ .a-TagControl-sugItem:not(:disabled):not(.is-disabled):hover:active {
14991
+ color: var(--TagControl-sugBtn-onActive-color);
14992
+ background: var(--TagControl-sugBtn-onActive-bg);
14993
+ border-color: var(--TagControl-sugBtn-onActive-border);
14994
+ }
14385
14995
  .a-TagControl-sugItem:hover:focus {
14386
14996
  box-shadow: var(--Button-boxShadow);
14387
14997
  }
@@ -14452,6 +15062,7 @@ td.rdtQuarter.rdtDisabled > span {
14452
15062
  font-size: var(--Form-input-fontSize);
14453
15063
  padding: calc( ( 1.875rem - var(--Form-input-lineHeight) * var(--Form-input-fontSize) ) / 2 ) var(--gap-sm);
14454
15064
  flex-direction: row;
15065
+ border-radius: var(--borderRadius) var(--borderRadius) 0 0;
14455
15066
  }
14456
15067
  .a-Transfer-title--light {
14457
15068
  background: transparent;
@@ -14467,6 +15078,7 @@ td.rdtQuarter.rdtDisabled > span {
14467
15078
  border: var(--Form-input-borderWidth) solid var(--Form-input-borderColor);
14468
15079
  display: flex;
14469
15080
  flex-direction: column;
15081
+ border-radius: var(--borderRadius);
14470
15082
  }
14471
15083
  .a-Transfer-select > .a-Transfer-checkboxes, .a-Transfer-result > .a-Transfer-selections {
14472
15084
  flex-grow: 1;
@@ -15228,6 +15840,233 @@ td.rdtQuarter.rdtDisabled > span {
15228
15840
  padding: var(--gap-base);
15229
15841
  }
15230
15842
 
15843
+ .a-Markdown strong {
15844
+ font-weight: bolder;
15845
+ }
15846
+ .a-Markdown img {
15847
+ border-style: none;
15848
+ }
15849
+ .a-Markdown svg:not(:root) {
15850
+ overflow: hidden;
15851
+ }
15852
+ .a-Markdown button:-moz-focusring,
15853
+ .a-Markdown [type=button]:-moz-focusring,
15854
+ .a-Markdown [type=reset]:-moz-focusring,
15855
+ .a-Markdown [type=submit]:-moz-focusring {
15856
+ outline: 1px dotted ButtonText;
15857
+ }
15858
+ .a-Markdown [type=checkbox] {
15859
+ box-sizing: border-box;
15860
+ padding: 0;
15861
+ }
15862
+ .a-Markdown table {
15863
+ border-spacing: 0;
15864
+ border-collapse: collapse;
15865
+ }
15866
+ .a-Markdown table td,
15867
+ .a-Markdown table th {
15868
+ padding: 0;
15869
+ }
15870
+ .a-Markdown hr {
15871
+ height: 0;
15872
+ margin: 15px 0;
15873
+ overflow: hidden;
15874
+ background: transparent;
15875
+ border: 0;
15876
+ border-bottom: 1px solid #ddd;
15877
+ }
15878
+ .a-Markdown hr::before {
15879
+ display: table;
15880
+ content: "";
15881
+ }
15882
+ .a-Markdown hr::after {
15883
+ display: table;
15884
+ clear: both;
15885
+ content: "";
15886
+ }
15887
+ .a-Markdown p {
15888
+ margin-top: 0;
15889
+ margin-bottom: 10px;
15890
+ }
15891
+ .a-Markdown blockquote {
15892
+ margin: 0;
15893
+ }
15894
+ .a-Markdown ul,
15895
+ .a-Markdown ol {
15896
+ padding-left: 0;
15897
+ margin-top: 0;
15898
+ margin-bottom: 0;
15899
+ }
15900
+ .a-Markdown ol ol,
15901
+ .a-Markdown ul ol {
15902
+ list-style-type: lower-roman;
15903
+ }
15904
+ .a-Markdown ul ul ol,
15905
+ .a-Markdown ul ol ol,
15906
+ .a-Markdown ol ul ol,
15907
+ .a-Markdown ol ol ol {
15908
+ list-style-type: lower-alpha;
15909
+ }
15910
+ .a-Markdown dd {
15911
+ margin-left: 0;
15912
+ }
15913
+ .a-Markdown p,
15914
+ .a-Markdown blockquote,
15915
+ .a-Markdown ul,
15916
+ .a-Markdown ol,
15917
+ .a-Markdown dl,
15918
+ .a-Markdown table,
15919
+ .a-Markdown pre {
15920
+ margin-top: 0;
15921
+ margin-bottom: 16px;
15922
+ }
15923
+ .a-Markdown hr {
15924
+ height: 4px;
15925
+ padding: 0;
15926
+ margin: 16px 0;
15927
+ background-color: #e7e7e7;
15928
+ border: 0 none;
15929
+ }
15930
+ .a-Markdown ul:not(.dropdown-menu):not(.nav),
15931
+ .a-Markdown ol {
15932
+ padding-left: 2em;
15933
+ }
15934
+ .a-Markdown ul ul,
15935
+ .a-Markdown ul ol,
15936
+ .a-Markdown ol ol,
15937
+ .a-Markdown ol ul {
15938
+ margin-top: 0;
15939
+ margin-bottom: 0;
15940
+ }
15941
+ .a-Markdown li > p {
15942
+ margin-top: 16px;
15943
+ }
15944
+ .a-Markdown dl {
15945
+ padding: 0;
15946
+ }
15947
+ .a-Markdown dl dt {
15948
+ padding: 0;
15949
+ margin-top: 16px;
15950
+ font-size: 1em;
15951
+ font-style: italic;
15952
+ font-weight: bold;
15953
+ }
15954
+ .a-Markdown dl dd {
15955
+ padding: 0 16px;
15956
+ margin-bottom: 16px;
15957
+ }
15958
+ .a-Markdown blockquote {
15959
+ padding: 0 15px;
15960
+ color: #777;
15961
+ border-left: 4px solid #ddd;
15962
+ }
15963
+ .a-Markdown blockquote > :first-child {
15964
+ margin-top: 0;
15965
+ }
15966
+ .a-Markdown blockquote > :last-child {
15967
+ margin-bottom: 0;
15968
+ }
15969
+ .a-Markdown table {
15970
+ display: block;
15971
+ width: 100%;
15972
+ overflow: auto;
15973
+ word-break: normal;
15974
+ }
15975
+ .a-Markdown table th {
15976
+ font-weight: bold;
15977
+ }
15978
+ .a-Markdown table th,
15979
+ .a-Markdown table td {
15980
+ padding: 6px 13px;
15981
+ border: 1px solid #ddd;
15982
+ }
15983
+ .a-Markdown table tr {
15984
+ background-color: #fff;
15985
+ border-top: 1px solid #ccc;
15986
+ }
15987
+ .a-Markdown table tr:nth-child(2n) {
15988
+ background-color: #f8f8f8;
15989
+ }
15990
+ @media (min-width: 1200px) {
15991
+ .a-Markdown img {
15992
+ max-width: 800px;
15993
+ }
15994
+ }
15995
+ .a-Markdown code {
15996
+ padding: 0;
15997
+ padding-top: 0.2em;
15998
+ padding-bottom: 0.2em;
15999
+ margin: 0;
16000
+ background-color: rgba(0, 0, 0, 0.04);
16001
+ border-radius: 3px;
16002
+ }
16003
+ .a-Markdown code:before,
16004
+ .a-Markdown code:after {
16005
+ letter-spacing: -0.2em;
16006
+ content: " ";
16007
+ }
16008
+ .a-Markdown pre > code {
16009
+ padding: 0;
16010
+ margin: 0;
16011
+ word-break: normal;
16012
+ white-space: pre;
16013
+ background: transparent;
16014
+ border: 0;
16015
+ }
16016
+ .a-Markdown .highlight {
16017
+ margin-bottom: 16px;
16018
+ }
16019
+ .a-Markdown .highlight pre,
16020
+ .a-Markdown pre {
16021
+ padding: 16px;
16022
+ overflow: auto;
16023
+ line-height: 1.45;
16024
+ background-color: #f7f7f7;
16025
+ border-radius: 3px;
16026
+ }
16027
+ .a-Markdown .highlight pre {
16028
+ margin-bottom: 0;
16029
+ word-break: normal;
16030
+ }
16031
+ .a-Markdown pre {
16032
+ word-wrap: normal;
16033
+ }
16034
+ .a-Markdown pre code {
16035
+ display: inline;
16036
+ max-width: initial;
16037
+ padding: 0;
16038
+ margin: 0;
16039
+ overflow: initial;
16040
+ line-height: inherit;
16041
+ word-wrap: normal;
16042
+ background-color: transparent;
16043
+ border: 0;
16044
+ }
16045
+ .a-Markdown pre code:before,
16046
+ .a-Markdown pre code:after {
16047
+ content: normal;
16048
+ }
16049
+ .a-Markdown kbd {
16050
+ display: inline-block;
16051
+ padding: 3px 5px;
16052
+ line-height: 10px;
16053
+ color: #555;
16054
+ vertical-align: middle;
16055
+ background-color: #fcfcfc;
16056
+ border: solid 1px #ccc;
16057
+ border-bottom-color: #bbb;
16058
+ border-radius: 3px;
16059
+ box-shadow: inset 0 -1px 0 #bbb;
16060
+ }
16061
+ .a-Markdown hr {
16062
+ border-bottom-color: #eee;
16063
+ }
16064
+
16065
+ .a-Link.is-disabled {
16066
+ cursor: not-allowed;
16067
+ color: var(--text--muted-color);
16068
+ }
16069
+
15231
16070
  /*
15232
16071
  * utilities
15233
16072
  */
@@ -15520,6 +16359,10 @@ td.rdtQuarter.rdtDisabled > span {
15520
16359
  background: none !important;
15521
16360
  }
15522
16361
 
16362
+ .cursor-pointer {
16363
+ cursor: pointer;
16364
+ }
16365
+
15523
16366
  a.bg-primary:hover {
15524
16367
  background: #6254b2;
15525
16368
  }