superdesk-ui-framework 3.0.1-beta.3 → 3.0.1-beta.30

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 (262) hide show
  1. package/app/fonts/sd_icons.eot +0 -0
  2. package/app/fonts/sd_icons.svg +14 -7
  3. package/app/fonts/sd_icons.ttf +0 -0
  4. package/app/fonts/sd_icons.woff +0 -0
  5. package/app/scripts/toggleBoxNext.js +1 -1
  6. package/app/styles/_big-icon-font.scss +1 -1
  7. package/app/styles/_buttons.scss +11 -6
  8. package/app/styles/_content-divider.scss +63 -8
  9. package/app/styles/_helpers.scss +24 -1
  10. package/app/styles/_icon-font.scss +17 -10
  11. package/app/styles/_labels.scss +0 -1
  12. package/app/styles/_master-desk.scss +3 -2
  13. package/app/styles/_modals.scss +6 -3
  14. package/app/styles/_normalize.scss +4 -0
  15. package/app/styles/_sd-tag-input.scss +256 -296
  16. package/app/styles/_simple-list.scss +0 -2
  17. package/app/styles/_table-list.scss +116 -12
  18. package/app/styles/app.scss +1 -0
  19. package/app/styles/components/_list-item.scss +36 -17
  20. package/app/styles/components/_sd-collapse-box.scss +6 -6
  21. package/app/styles/components/_sd-comment-box.scss +8 -4
  22. package/app/styles/components/_sd-editor-popup.scss +4 -4
  23. package/app/styles/components/_sd-grid-item.scss +30 -16
  24. package/app/styles/components/_sd-media-carousel.scss +37 -2
  25. package/app/styles/components/_sd-photo-preview.scss +3 -3
  26. package/app/styles/components/_sd-searchbar.scss +7 -0
  27. package/app/styles/components/_subnav.scss +470 -470
  28. package/app/styles/design-tokens/_design-tokens-general.scss +1 -1
  29. package/app/styles/design-tokens/_new-colors.scss +30 -13
  30. package/app/styles/dropdowns/_basic-dropdown.scss +6 -0
  31. package/app/styles/form-elements/_forms-general.scss +81 -7
  32. package/app/styles/form-elements/_input-wrap.scss +138 -0
  33. package/app/styles/form-elements/_inputs.scss +368 -110
  34. package/app/styles/grids/_grid-layout.scss +34 -1
  35. package/app/styles/interface-elements/_side-panel.scss +1 -1
  36. package/app/styles/layout/_basic-layout.scss +2 -2
  37. package/app/styles/layout/_editor.scss +10 -4
  38. package/app/styles/primereact/_pr-datepicker.scss +4 -2
  39. package/app/styles/primereact/_pr-dialog.scss +5 -0
  40. package/app/styles/primereact/_pr-dropdown.scss +17 -1
  41. package/app/styles/primereact/_pr-menu.scss +6 -5
  42. package/app/styles/variables/_colors.scss +21 -21
  43. package/app-typescript/components/Badge.tsx +3 -2
  44. package/app-typescript/components/ContentDivider.tsx +3 -0
  45. package/app-typescript/components/DatePicker.tsx +40 -52
  46. package/app-typescript/components/Dropdown.tsx +127 -82
  47. package/app-typescript/components/DurationInput.tsx +400 -0
  48. package/app-typescript/components/EmptyState.tsx +2 -1
  49. package/app-typescript/components/Form/FormLabel.tsx +8 -1
  50. package/app-typescript/components/Form/FormRowNew.tsx +41 -0
  51. package/app-typescript/components/Form/InputBase.tsx +95 -0
  52. package/app-typescript/components/Form/InputNew.tsx +107 -0
  53. package/app-typescript/components/Form/InputWrapper.tsx +79 -0
  54. package/app-typescript/components/Form/index.tsx +4 -0
  55. package/app-typescript/components/Input.tsx +28 -45
  56. package/app-typescript/components/Label.tsx +65 -10
  57. package/app-typescript/components/Layouts/AuthoringContainer.tsx +2 -1
  58. package/app-typescript/components/Layouts/AuthoringFrame.tsx +2 -1
  59. package/app-typescript/components/Layouts/AuthoringFrameRightBar.tsx +21 -2
  60. package/app-typescript/components/Layouts/AuthoringInnerHeader.tsx +1 -1
  61. package/app-typescript/components/Layouts/AuthoringMain.tsx +4 -2
  62. package/app-typescript/components/Layouts/CoreLayout.tsx +2 -1
  63. package/app-typescript/components/Layouts/CoreLayoutMain.tsx +7 -1
  64. package/app-typescript/components/Layouts/Layout.tsx +1 -1
  65. package/app-typescript/components/LeftMenu.tsx +127 -122
  66. package/app-typescript/components/Lists/ContentList.tsx +66 -33
  67. package/app-typescript/components/Lists/TableList.tsx +348 -151
  68. package/app-typescript/components/Menu.tsx +2 -2
  69. package/app-typescript/components/MultiSelect.tsx +37 -50
  70. package/app-typescript/components/NavButton.tsx +2 -1
  71. package/app-typescript/components/Navigation/BottomNav.tsx +3 -2
  72. package/app-typescript/components/SearchBar.tsx +39 -12
  73. package/app-typescript/components/Select.tsx +23 -41
  74. package/app-typescript/components/SelectWithTemplate.tsx +32 -7
  75. package/app-typescript/components/Spacer.tsx +87 -0
  76. package/app-typescript/components/TimePicker.tsx +38 -15
  77. package/app-typescript/components/TreeSelect.tsx +546 -212
  78. package/app-typescript/index.ts +6 -1
  79. package/dist/examples.bundle.css +344 -71
  80. package/dist/examples.bundle.js +48203 -45174
  81. package/dist/playgrounds/react-playgrounds/CoreLayout.tsx +65 -54
  82. package/dist/playgrounds/react-playgrounds/Index.tsx +1 -0
  83. package/dist/playgrounds/react-playgrounds/Multiedit.tsx +321 -0
  84. package/dist/playgrounds/react-playgrounds/RundownEditor.tsx +26 -23
  85. package/dist/playgrounds/react-playgrounds/Rundowns.tsx +20 -21
  86. package/dist/playgrounds/react-playgrounds/SamsPlayground.tsx +12 -3
  87. package/dist/playgrounds/react-playgrounds/TestGround.tsx +379 -25
  88. package/dist/playgrounds/react-playgrounds/components/Layout.tsx +1 -1
  89. package/dist/react/Badges.tsx +18 -0
  90. package/dist/react/ContentDivider.tsx +22 -18
  91. package/dist/react/ContentList.tsx +200 -18
  92. package/dist/react/DatePicker.tsx +21 -1
  93. package/dist/react/Dropdowns.tsx +580 -48
  94. package/dist/react/DurationInput.tsx +108 -0
  95. package/dist/react/Index.tsx +5 -0
  96. package/dist/react/Inputs.tsx +147 -2
  97. package/dist/react/Labels.tsx +51 -1
  98. package/dist/react/LeftNavigations.tsx +71 -44
  99. package/dist/react/MultiSelect.tsx +10 -7
  100. package/dist/react/NavButtons.tsx +31 -1
  101. package/dist/react/SelectWithTemplate.tsx +6 -1
  102. package/dist/react/TableList.tsx +79 -186
  103. package/dist/react/TimePicker.tsx +22 -12
  104. package/dist/react/Togglebox.tsx +1 -1
  105. package/dist/react/TreeSelect.tsx +295 -51
  106. package/dist/react/tree-select/TreeSelect.tsx +273 -0
  107. package/dist/react/tree-select/example-1.tsx +71 -0
  108. package/dist/react/tree-select/example-2.tsx +59 -0
  109. package/dist/sd_icons.eot +0 -0
  110. package/dist/sd_icons.svg +14 -7
  111. package/dist/sd_icons.ttf +0 -0
  112. package/dist/sd_icons.woff +0 -0
  113. package/dist/superdesk-ui.bundle.css +2282 -782
  114. package/dist/superdesk-ui.bundle.js +37312 -21800
  115. package/dist/vendor.bundle.js +27 -27
  116. package/examples/css/docs-page.css +4 -4
  117. package/examples/index.js +4 -0
  118. package/examples/pages/playgrounds/react-playgrounds/CoreLayout.tsx +65 -54
  119. package/examples/pages/playgrounds/react-playgrounds/Index.tsx +1 -0
  120. package/examples/pages/playgrounds/react-playgrounds/Multiedit.tsx +321 -0
  121. package/examples/pages/playgrounds/react-playgrounds/RundownEditor.tsx +26 -23
  122. package/examples/pages/playgrounds/react-playgrounds/Rundowns.tsx +20 -21
  123. package/examples/pages/playgrounds/react-playgrounds/SamsPlayground.tsx +12 -3
  124. package/examples/pages/playgrounds/react-playgrounds/TestGround.tsx +379 -25
  125. package/examples/pages/playgrounds/react-playgrounds/components/Layout.tsx +1 -1
  126. package/examples/pages/react/Badges.tsx +18 -0
  127. package/examples/pages/react/ContentDivider.tsx +22 -18
  128. package/examples/pages/react/ContentList.tsx +200 -18
  129. package/examples/pages/react/DatePicker.tsx +21 -1
  130. package/examples/pages/react/Dropdowns.tsx +580 -48
  131. package/examples/pages/react/DurationInput.tsx +108 -0
  132. package/examples/pages/react/Index.tsx +5 -0
  133. package/examples/pages/react/Inputs.tsx +147 -2
  134. package/examples/pages/react/Labels.tsx +51 -1
  135. package/examples/pages/react/LeftNavigations.tsx +71 -44
  136. package/examples/pages/react/MultiSelect.tsx +10 -7
  137. package/examples/pages/react/NavButtons.tsx +31 -1
  138. package/examples/pages/react/SelectWithTemplate.tsx +6 -1
  139. package/examples/pages/react/TableList.tsx +79 -186
  140. package/examples/pages/react/TimePicker.tsx +22 -12
  141. package/examples/pages/react/Togglebox.tsx +1 -1
  142. package/examples/pages/react/TreeSelect.tsx +295 -51
  143. package/examples/pages/react/tree-select/TreeSelect.tsx +273 -0
  144. package/examples/pages/react/tree-select/example-1.tsx +71 -0
  145. package/examples/pages/react/tree-select/example-2.tsx +59 -0
  146. package/package.json +5 -5
  147. package/react/components/Badge.d.ts +1 -0
  148. package/react/components/Badge.js +2 -2
  149. package/react/components/ContentDivider.d.ts +1 -0
  150. package/react/components/ContentDivider.js +2 -0
  151. package/react/components/DatePicker.d.ts +1 -0
  152. package/react/components/DatePicker.js +6 -22
  153. package/react/components/Dropdown.d.ts +6 -5
  154. package/react/components/Dropdown.js +57 -30
  155. package/react/components/DurationInput.d.ts +42 -0
  156. package/react/components/DurationInput.js +364 -0
  157. package/react/components/EmptyState.d.ts +1 -0
  158. package/react/components/EmptyState.js +1 -1
  159. package/react/components/Form/FormLabel.d.ts +4 -1
  160. package/react/components/Form/FormLabel.js +9 -3
  161. package/react/components/Form/FormRowNew.d.ts +12 -0
  162. package/react/components/Form/FormRowNew.js +67 -0
  163. package/react/components/Form/InputBase.d.ts +41 -0
  164. package/react/components/Form/InputBase.js +86 -0
  165. package/react/components/Form/InputNew.d.ts +45 -0
  166. package/react/components/Form/InputNew.js +75 -0
  167. package/react/components/Form/InputWrapper.d.ts +28 -0
  168. package/react/components/Form/InputWrapper.js +91 -0
  169. package/react/components/Form/index.d.ts +4 -0
  170. package/react/components/Form/index.js +9 -1
  171. package/react/components/Input.js +5 -34
  172. package/react/components/Label.d.ts +2 -0
  173. package/react/components/Label.js +34 -3
  174. package/react/components/Layouts/AuthoringContainer.d.ts +1 -0
  175. package/react/components/Layouts/AuthoringContainer.js +1 -1
  176. package/react/components/Layouts/AuthoringFrame.d.ts +1 -0
  177. package/react/components/Layouts/AuthoringFrame.js +1 -1
  178. package/react/components/Layouts/AuthoringFrameRightBar.d.ts +9 -2
  179. package/react/components/Layouts/AuthoringFrameRightBar.js +14 -3
  180. package/react/components/Layouts/AuthoringInnerHeader.js +1 -1
  181. package/react/components/Layouts/AuthoringMain.js +1 -1
  182. package/react/components/Layouts/CoreLayout.d.ts +1 -0
  183. package/react/components/Layouts/CoreLayout.js +1 -1
  184. package/react/components/Layouts/CoreLayoutMain.d.ts +1 -0
  185. package/react/components/Layouts/CoreLayoutMain.js +8 -1
  186. package/react/components/Layouts/Layout.js +1 -1
  187. package/react/components/LeftMenu.d.ts +3 -1
  188. package/react/components/LeftMenu.js +8 -1
  189. package/react/components/Lists/ContentList.d.ts +51 -0
  190. package/react/components/Lists/ContentList.js +110 -0
  191. package/react/components/Lists/TableList.d.ts +64 -0
  192. package/react/components/Lists/TableList.js +240 -0
  193. package/react/components/Menu.js +1 -1
  194. package/react/components/MultiSelect.d.ts +40 -0
  195. package/react/components/MultiSelect.js +70 -0
  196. package/react/components/NavButton.d.ts +1 -1
  197. package/react/components/Navigation/BottomNav.d.ts +1 -0
  198. package/react/components/Navigation/BottomNav.js +2 -2
  199. package/react/components/SearchBar.d.ts +3 -2
  200. package/react/components/SearchBar.js +28 -4
  201. package/react/components/Select.d.ts +1 -1
  202. package/react/components/Select.js +4 -26
  203. package/react/components/SelectWithTemplate.d.ts +11 -1
  204. package/react/components/SelectWithTemplate.js +19 -10
  205. package/react/components/TimePicker.d.ts +11 -1
  206. package/react/components/TimePicker.js +10 -3
  207. package/react/components/TreeSelect.d.ts +82 -0
  208. package/react/components/TreeSelect.js +521 -0
  209. package/react/index.d.ts +6 -0
  210. package/react/index.js +16 -3
  211. package/.vscode/settings.json +0 -5
  212. package/app-typescript/dist/components/Alert.d.ts +0 -16
  213. package/app-typescript/dist/components/Autocomplete.d.ts +0 -48
  214. package/app-typescript/dist/components/Avatar.d.ts +0 -33
  215. package/app-typescript/dist/components/Badge.d.ts +0 -13
  216. package/app-typescript/dist/components/Button.d.ts +0 -23
  217. package/app-typescript/dist/components/ButtonGroup.d.ts +0 -12
  218. package/app-typescript/dist/components/CheckButtonGroup.d.ts +0 -11
  219. package/app-typescript/dist/components/CheckGroup.d.ts +0 -9
  220. package/app-typescript/dist/components/Checkbox.d.ts +0 -19
  221. package/app-typescript/dist/components/CheckboxButton.d.ts +0 -19
  222. package/app-typescript/dist/components/DatePicker.d.ts +0 -37
  223. package/app-typescript/dist/components/Divider.d.ts +0 -9
  224. package/app-typescript/dist/components/DonutChart.d.ts +0 -12
  225. package/app-typescript/dist/components/Dropdown.d.ts +0 -28
  226. package/app-typescript/dist/components/DropdownFirst.d.ts +0 -42
  227. package/app-typescript/dist/components/EmptyState.d.ts +0 -11
  228. package/app-typescript/dist/components/FormLabel.d.ts +0 -9
  229. package/app-typescript/dist/components/Genie.d.ts +0 -13
  230. package/app-typescript/dist/components/GridItem.d.ts +0 -69
  231. package/app-typescript/dist/components/GridList.d.ts +0 -14
  232. package/app-typescript/dist/components/HeadingText.d.ts +0 -10
  233. package/app-typescript/dist/components/HelloWorld.d.ts +0 -8
  234. package/app-typescript/dist/components/Icon.d.ts +0 -12
  235. package/app-typescript/dist/components/IconButton.d.ts +0 -12
  236. package/app-typescript/dist/components/IconLabel.d.ts +0 -11
  237. package/app-typescript/dist/components/Input.d.ts +0 -24
  238. package/app-typescript/dist/components/Label.d.ts +0 -15
  239. package/app-typescript/dist/components/LeftMenu.d.ts +0 -26
  240. package/app-typescript/dist/components/Loader.d.ts +0 -8
  241. package/app-typescript/dist/components/NavButton.d.ts +0 -15
  242. package/app-typescript/dist/components/Popover.d.ts +0 -13
  243. package/app-typescript/dist/components/PropsList.d.ts +0 -15
  244. package/app-typescript/dist/components/Radio.d.ts +0 -19
  245. package/app-typescript/dist/components/RadioButton.d.ts +0 -20
  246. package/app-typescript/dist/components/Select.d.ts +0 -29
  247. package/app-typescript/dist/components/SelectWithTemplate.d.ts +0 -32
  248. package/app-typescript/dist/components/SlidingToolbar.d.ts +0 -8
  249. package/app-typescript/dist/components/StrechBar.d.ts +0 -4
  250. package/app-typescript/dist/components/SubNav.d.ts +0 -10
  251. package/app-typescript/dist/components/Switch.d.ts +0 -12
  252. package/app-typescript/dist/components/TabCustom.d.ts +0 -25
  253. package/app-typescript/dist/components/TabList.d.ts +0 -22
  254. package/app-typescript/dist/components/Tag.d.ts +0 -9
  255. package/app-typescript/dist/components/TagInput.d.ts +0 -7
  256. package/app-typescript/dist/components/TagInputTest.d.ts +0 -18
  257. package/app-typescript/dist/components/TimePicker.d.ts +0 -11
  258. package/app-typescript/dist/components/Tooltip.d.ts +0 -11
  259. package/app-typescript/dist/components/_Positioner.d.ts +0 -27
  260. package/app-typescript/dist/index.d.ts +0 -56
  261. package/patches/@superdesk+primereact+5.0.2-4.patch +0 -57
  262. package/yarn-error.log +0 -111
package/dist/examples.bundle.css CHANGED
@@ -850,7 +850,7 @@ p.docs-page__paragraph b, div.docs-page__paragraph b {
850
850
  margin: 0;
851
851
  font-size: 13px;
852
852
  line-height: 1.42857143;
853
- color: #333;
853
+ color: hsl(214, 13%, 20%);
854
854
  word-break: break-all;
855
855
  word-wrap: break-word;
856
856
  background-color: #eee;
@@ -858,11 +858,11 @@ p.docs-page__paragraph b, div.docs-page__paragraph b {
858
858
  border-radius: 2px;
859
859
  }
860
860
  .docs-page__code-window {
861
- border: 1px solid rgba(123, 123, 123, 0.2);
861
+ border: 1px solid hsla(0, 0%, 48%, 0.2);
862
862
  border-radius: 2px;
863
863
  margin: 10px 0 20px;
864
- -webkit-box-shadow: 0 2px 8px rgba(0,0,0,.07);
865
- box-shadow: 0 2px 8px rgba(0,0,0,.07);
864
+ -webkit-box-shadow: 0 2px 8px hsla(0, 0%, 0%, 0.07);
865
+ box-shadow: 0 2px 8px hsla(0, 0%, 0%, 0.07);
866
866
  }
867
867
  .docs-page__window-bar {
868
868
  padding: 10px;
@@ -3640,7 +3640,7 @@ doc-react-playground {
3640
3640
  color: var(--sd-colour-interactive) !important; }
3641
3641
 
3642
3642
  .icon--white {
3643
- color: #fff !important; }
3643
+ color: white !important; }
3644
3644
 
3645
3645
  .icon--light-blue {
3646
3646
  color: #68abc8 !important;
@@ -10832,9 +10832,282 @@ doc-react-playground {
10832
10832
  --icon-base-size: 64px
10833
10833
  ; }
10834
10834
 
10835
+ .icon-photo-cancel:before {
10836
+ content: ""; }
10837
+
10838
+ .icon-photo-cancel.color--default {
10839
+ color: var(--color-icon-default); }
10840
+
10841
+ .icon-photo-cancel.color--primary {
10842
+ color: var(--sd-colour-primary) !important; }
10843
+
10844
+ .icon-photo-cancel.color--success {
10845
+ color: var(--sd-colour-success) !important; }
10846
+
10847
+ .icon-photo-cancel.color--warning {
10848
+ color: var(--sd-colour-warning) !important; }
10849
+
10850
+ .icon-photo-cancel.color--alert {
10851
+ color: var(--sd-colour-alert) !important; }
10852
+
10853
+ .icon-photo-cancel.color--highlight {
10854
+ color: var(--sd-colour-highlight) !important; }
10855
+
10856
+ .icon-photo-cancel.color--light {
10857
+ color: var(--color-text-lighter) !important; }
10858
+
10859
+ .icon-photo-cancel.color--white {
10860
+ color: #e2e5e9 !important; }
10861
+
10862
+ .icon-photo-cancel.scale--2x {
10863
+ --icon-base-size: 32px
10864
+ ; }
10865
+
10866
+ .icon-photo-cancel.scale--3x {
10867
+ --icon-base-size: 48px
10868
+ ; }
10869
+
10870
+ .icon-photo-cancel.scale--4x {
10871
+ --icon-base-size: 64px
10872
+ ; }
10873
+
10874
+ .icon-video-cancel:before {
10875
+ content: ""; }
10876
+
10877
+ .icon-video-cancel.color--default {
10878
+ color: var(--color-icon-default); }
10879
+
10880
+ .icon-video-cancel.color--primary {
10881
+ color: var(--sd-colour-primary) !important; }
10882
+
10883
+ .icon-video-cancel.color--success {
10884
+ color: var(--sd-colour-success) !important; }
10885
+
10886
+ .icon-video-cancel.color--warning {
10887
+ color: var(--sd-colour-warning) !important; }
10888
+
10889
+ .icon-video-cancel.color--alert {
10890
+ color: var(--sd-colour-alert) !important; }
10891
+
10892
+ .icon-video-cancel.color--highlight {
10893
+ color: var(--sd-colour-highlight) !important; }
10894
+
10895
+ .icon-video-cancel.color--light {
10896
+ color: var(--color-text-lighter) !important; }
10897
+
10898
+ .icon-video-cancel.color--white {
10899
+ color: #e2e5e9 !important; }
10900
+
10901
+ .icon-video-cancel.scale--2x {
10902
+ --icon-base-size: 32px
10903
+ ; }
10904
+
10905
+ .icon-video-cancel.scale--3x {
10906
+ --icon-base-size: 48px
10907
+ ; }
10908
+
10909
+ .icon-video-cancel.scale--4x {
10910
+ --icon-base-size: 64px
10911
+ ; }
10912
+
10913
+ .icon-text-cancel:before {
10914
+ content: ""; }
10915
+
10916
+ .icon-text-cancel.color--default {
10917
+ color: var(--color-icon-default); }
10918
+
10919
+ .icon-text-cancel.color--primary {
10920
+ color: var(--sd-colour-primary) !important; }
10921
+
10922
+ .icon-text-cancel.color--success {
10923
+ color: var(--sd-colour-success) !important; }
10924
+
10925
+ .icon-text-cancel.color--warning {
10926
+ color: var(--sd-colour-warning) !important; }
10927
+
10928
+ .icon-text-cancel.color--alert {
10929
+ color: var(--sd-colour-alert) !important; }
10930
+
10931
+ .icon-text-cancel.color--highlight {
10932
+ color: var(--sd-colour-highlight) !important; }
10933
+
10934
+ .icon-text-cancel.color--light {
10935
+ color: var(--color-text-lighter) !important; }
10936
+
10937
+ .icon-text-cancel.color--white {
10938
+ color: #e2e5e9 !important; }
10939
+
10940
+ .icon-text-cancel.scale--2x {
10941
+ --icon-base-size: 32px
10942
+ ; }
10943
+
10944
+ .icon-text-cancel.scale--3x {
10945
+ --icon-base-size: 48px
10946
+ ; }
10947
+
10948
+ .icon-text-cancel.scale--4x {
10949
+ --icon-base-size: 64px
10950
+ ; }
10951
+
10952
+ .icon-file-cancel:before {
10953
+ content: ""; }
10954
+
10955
+ .icon-file-cancel.color--default {
10956
+ color: var(--color-icon-default); }
10957
+
10958
+ .icon-file-cancel.color--primary {
10959
+ color: var(--sd-colour-primary) !important; }
10960
+
10961
+ .icon-file-cancel.color--success {
10962
+ color: var(--sd-colour-success) !important; }
10963
+
10964
+ .icon-file-cancel.color--warning {
10965
+ color: var(--sd-colour-warning) !important; }
10966
+
10967
+ .icon-file-cancel.color--alert {
10968
+ color: var(--sd-colour-alert) !important; }
10969
+
10970
+ .icon-file-cancel.color--highlight {
10971
+ color: var(--sd-colour-highlight) !important; }
10972
+
10973
+ .icon-file-cancel.color--light {
10974
+ color: var(--color-text-lighter) !important; }
10975
+
10976
+ .icon-file-cancel.color--white {
10977
+ color: #e2e5e9 !important; }
10978
+
10979
+ .icon-file-cancel.scale--2x {
10980
+ --icon-base-size: 32px
10981
+ ; }
10982
+
10983
+ .icon-file-cancel.scale--3x {
10984
+ --icon-base-size: 48px
10985
+ ; }
10986
+
10987
+ .icon-file-cancel.scale--4x {
10988
+ --icon-base-size: 64px
10989
+ ; }
10990
+
10991
+ .icon-audio-cancel:before {
10992
+ content: ""; }
10993
+
10994
+ .icon-audio-cancel.color--default {
10995
+ color: var(--color-icon-default); }
10996
+
10997
+ .icon-audio-cancel.color--primary {
10998
+ color: var(--sd-colour-primary) !important; }
10999
+
11000
+ .icon-audio-cancel.color--success {
11001
+ color: var(--sd-colour-success) !important; }
11002
+
11003
+ .icon-audio-cancel.color--warning {
11004
+ color: var(--sd-colour-warning) !important; }
11005
+
11006
+ .icon-audio-cancel.color--alert {
11007
+ color: var(--sd-colour-alert) !important; }
11008
+
11009
+ .icon-audio-cancel.color--highlight {
11010
+ color: var(--sd-colour-highlight) !important; }
11011
+
11012
+ .icon-audio-cancel.color--light {
11013
+ color: var(--color-text-lighter) !important; }
11014
+
11015
+ .icon-audio-cancel.color--white {
11016
+ color: #e2e5e9 !important; }
11017
+
11018
+ .icon-audio-cancel.scale--2x {
11019
+ --icon-base-size: 32px
11020
+ ; }
11021
+
11022
+ .icon-audio-cancel.scale--3x {
11023
+ --icon-base-size: 48px
11024
+ ; }
11025
+
11026
+ .icon-audio-cancel.scale--4x {
11027
+ --icon-base-size: 64px
11028
+ ; }
11029
+
11030
+ .icon-list-alt-cancel:before {
11031
+ content: ""; }
11032
+
11033
+ .icon-list-alt-cancel.color--default {
11034
+ color: var(--color-icon-default); }
11035
+
11036
+ .icon-list-alt-cancel.color--primary {
11037
+ color: var(--sd-colour-primary) !important; }
11038
+
11039
+ .icon-list-alt-cancel.color--success {
11040
+ color: var(--sd-colour-success) !important; }
11041
+
11042
+ .icon-list-alt-cancel.color--warning {
11043
+ color: var(--sd-colour-warning) !important; }
11044
+
11045
+ .icon-list-alt-cancel.color--alert {
11046
+ color: var(--sd-colour-alert) !important; }
11047
+
11048
+ .icon-list-alt-cancel.color--highlight {
11049
+ color: var(--sd-colour-highlight) !important; }
11050
+
11051
+ .icon-list-alt-cancel.color--light {
11052
+ color: var(--color-text-lighter) !important; }
11053
+
11054
+ .icon-list-alt-cancel.color--white {
11055
+ color: #e2e5e9 !important; }
11056
+
11057
+ .icon-list-alt-cancel.scale--2x {
11058
+ --icon-base-size: 32px
11059
+ ; }
11060
+
11061
+ .icon-list-alt-cancel.scale--3x {
11062
+ --icon-base-size: 48px
11063
+ ; }
11064
+
11065
+ .icon-list-alt-cancel.scale--4x {
11066
+ --icon-base-size: 64px
11067
+ ; }
11068
+
11069
+ .icon-post-cancel:before {
11070
+ content: ""; }
11071
+
11072
+ .icon-post-cancel.color--default {
11073
+ color: var(--color-icon-default); }
11074
+
11075
+ .icon-post-cancel.color--primary {
11076
+ color: var(--sd-colour-primary) !important; }
11077
+
11078
+ .icon-post-cancel.color--success {
11079
+ color: var(--sd-colour-success) !important; }
11080
+
11081
+ .icon-post-cancel.color--warning {
11082
+ color: var(--sd-colour-warning) !important; }
11083
+
11084
+ .icon-post-cancel.color--alert {
11085
+ color: var(--sd-colour-alert) !important; }
11086
+
11087
+ .icon-post-cancel.color--highlight {
11088
+ color: var(--sd-colour-highlight) !important; }
11089
+
11090
+ .icon-post-cancel.color--light {
11091
+ color: var(--color-text-lighter) !important; }
11092
+
11093
+ .icon-post-cancel.color--white {
11094
+ color: #e2e5e9 !important; }
11095
+
11096
+ .icon-post-cancel.scale--2x {
11097
+ --icon-base-size: 32px
11098
+ ; }
11099
+
11100
+ .icon-post-cancel.scale--3x {
11101
+ --icon-base-size: 48px
11102
+ ; }
11103
+
11104
+ .icon-post-cancel.scale--4x {
11105
+ --icon-base-size: 64px
11106
+ ; }
11107
+
10835
11108
  .icn-mix {
10836
11109
  position: relative;
10837
- display: inline-block;
11110
+ display: inline-flex !important;
10838
11111
  font-size: 16px;
10839
11112
  height: 16px; }
10840
11113
  .icn-mix .icn-mix__icn {
@@ -10845,11 +11118,11 @@ doc-react-playground {
10845
11118
  box-sizing: content-box;
10846
11119
  line-height: 100%;
10847
11120
  color: #9b27b0;
10848
- right: -0.5rem;
10849
- bottom: -0.7rem;
11121
+ inset-inline-end: -0.4rem;
11122
+ inset-block-end: -0.6rem;
10850
11123
  height: 1em;
10851
11124
  width: 1em;
10852
- background-color: var(--sd-item__main-Bg);
11125
+ background-color: var(--sd-item__main-Bg) !important;
10853
11126
  border-radius: var(--b-radius--full);
10854
11127
  padding: 1px;
10855
11128
  z-index: 1;
@@ -10865,8 +11138,8 @@ doc-react-playground {
10865
11138
  font-size: 32px; }
10866
11139
  .icn-mix--2x .icn-mix__sub-icn {
10867
11140
  font-size: 1.6rem;
10868
- right: -0.6rem;
10869
- bottom: -0.3rem; }
11141
+ inset-inline-end: -0.6rem;
11142
+ inset-block-end: -0.3rem; }
10870
11143
 
10871
11144
  .double-size-icn {
10872
11145
  display: inline-block;
@@ -10883,13 +11156,13 @@ doc-react-playground {
10883
11156
  opacity: 0.5; }
10884
11157
 
10885
11158
  .subnav .icn-mix__sub-icn {
10886
- background-color: var(--sd-colour-panel-bg--100); }
11159
+ background-color: var(--sd-colour-panel-bg--100) !important; }
10887
11160
 
10888
11161
  .subnav--darker .icn-mix__sub-icn {
10889
- background-color: var(--sd-colour-panel-bg--200); }
11162
+ background-color: var(--sd-colour-panel-bg--200) !important; }
10890
11163
 
10891
11164
  .subnav--dark-blue-grey .icn-mix__sub-icn {
10892
- background-color: var(--color-subnav-bg--blueGrey-10);
11165
+ background-color: var(--color-subnav-bg--blueGrey-10) !important;
10893
11166
  color: #d686e4; }
10894
11167
 
10895
11168
  .subnav--dark-blue-grey .icn-mix__icn {
@@ -13208,7 +13481,7 @@ doc-react-playground {
13208
13481
  font-weight: normal;
13209
13482
  font-variant: normal;
13210
13483
  text-transform: none;
13211
- color: #333333;
13484
+ color: var(--color-icon-default);
13212
13485
  /* Better Font Rendering =========== */
13213
13486
  -webkit-font-smoothing: antialiased;
13214
13487
  -moz-osx-font-smoothing: grayscale; }
@@ -13217,7 +13490,7 @@ doc-react-playground {
13217
13490
  color: var(--sd-colour-interactive); }
13218
13491
 
13219
13492
  .big-icon--white {
13220
- color: #fff !important; }
13493
+ color: white !important; }
13221
13494
 
13222
13495
  [class*=big-icon--].red,
13223
13496
  .big-icon--red {
@@ -13226,7 +13499,7 @@ doc-react-playground {
13226
13499
  .big-icon--dashboard {
13227
13500
  content: ""; }
13228
13501
  .big-icon--dashboard.color--default {
13229
- color: #333333; }
13502
+ color: #2c323a; }
13230
13503
  .big-icon--dashboard.color--primary {
13231
13504
  color: var(--sd-colour-primary) !important; }
13232
13505
  .big-icon--dashboard.color--success {
@@ -13257,7 +13530,7 @@ doc-react-playground {
13257
13530
  .big-icon--view {
13258
13531
  content: ""; }
13259
13532
  .big-icon--view.color--default {
13260
- color: #333333; }
13533
+ color: #2c323a; }
13261
13534
  .big-icon--view.color--primary {
13262
13535
  color: var(--sd-colour-primary) !important; }
13263
13536
  .big-icon--view.color--success {
@@ -13288,7 +13561,7 @@ doc-react-playground {
13288
13561
  .big-icon--tasks {
13289
13562
  content: ""; }
13290
13563
  .big-icon--tasks.color--default {
13291
- color: #333333; }
13564
+ color: #2c323a; }
13292
13565
  .big-icon--tasks.color--primary {
13293
13566
  color: var(--sd-colour-primary) !important; }
13294
13567
  .big-icon--tasks.color--success {
@@ -13319,7 +13592,7 @@ doc-react-playground {
13319
13592
  .big-icon--calendar {
13320
13593
  content: ""; }
13321
13594
  .big-icon--calendar.color--default {
13322
- color: #333333; }
13595
+ color: #2c323a; }
13323
13596
  .big-icon--calendar.color--primary {
13324
13597
  color: var(--sd-colour-primary) !important; }
13325
13598
  .big-icon--calendar.color--success {
@@ -13350,7 +13623,7 @@ doc-react-playground {
13350
13623
  .big-icon--marked-star {
13351
13624
  content: ""; }
13352
13625
  .big-icon--marked-star.color--default {
13353
- color: #333333; }
13626
+ color: #2c323a; }
13354
13627
  .big-icon--marked-star.color--primary {
13355
13628
  color: var(--sd-colour-primary) !important; }
13356
13629
  .big-icon--marked-star.color--success {
@@ -13381,7 +13654,7 @@ doc-react-playground {
13381
13654
  .big-icon--archive {
13382
13655
  content: ""; }
13383
13656
  .big-icon--archive.color--default {
13384
- color: #333333; }
13657
+ color: #2c323a; }
13385
13658
  .big-icon--archive.color--primary {
13386
13659
  color: var(--sd-colour-primary) !important; }
13387
13660
  .big-icon--archive.color--success {
@@ -13412,7 +13685,7 @@ doc-react-playground {
13412
13685
  .big-icon--spike {
13413
13686
  content: ""; }
13414
13687
  .big-icon--spike.color--default {
13415
- color: #333333; }
13688
+ color: #2c323a; }
13416
13689
  .big-icon--spike.color--primary {
13417
13690
  color: var(--sd-colour-primary) !important; }
13418
13691
  .big-icon--spike.color--success {
@@ -13443,7 +13716,7 @@ doc-react-playground {
13443
13716
  .big-icon--unspike {
13444
13717
  content: ""; }
13445
13718
  .big-icon--unspike.color--default {
13446
- color: #333333; }
13719
+ color: #2c323a; }
13447
13720
  .big-icon--unspike.color--primary {
13448
13721
  color: var(--sd-colour-primary) !important; }
13449
13722
  .big-icon--unspike.color--success {
@@ -13474,7 +13747,7 @@ doc-react-playground {
13474
13747
  .big-icon--personal {
13475
13748
  content: ""; }
13476
13749
  .big-icon--personal.color--default {
13477
- color: #333333; }
13750
+ color: #2c323a; }
13478
13751
  .big-icon--personal.color--primary {
13479
13752
  color: var(--sd-colour-primary) !important; }
13480
13753
  .big-icon--personal.color--success {
@@ -13505,7 +13778,7 @@ doc-react-playground {
13505
13778
  .big-icon--global-search {
13506
13779
  content: ""; }
13507
13780
  .big-icon--global-search.color--default {
13508
- color: #333333; }
13781
+ color: #2c323a; }
13509
13782
  .big-icon--global-search.color--primary {
13510
13783
  color: var(--sd-colour-primary) !important; }
13511
13784
  .big-icon--global-search.color--success {
@@ -13536,7 +13809,7 @@ doc-react-playground {
13536
13809
  .big-icon--analytics {
13537
13810
  content: ""; }
13538
13811
  .big-icon--analytics.color--default {
13539
- color: #333333; }
13812
+ color: #2c323a; }
13540
13813
  .big-icon--analytics.color--primary {
13541
13814
  color: var(--sd-colour-primary) !important; }
13542
13815
  .big-icon--analytics.color--success {
@@ -13567,7 +13840,7 @@ doc-react-playground {
13567
13840
  .big-icon--web {
13568
13841
  content: ""; }
13569
13842
  .big-icon--web.color--default {
13570
- color: #333333; }
13843
+ color: #2c323a; }
13571
13844
  .big-icon--web.color--primary {
13572
13845
  color: var(--sd-colour-primary) !important; }
13573
13846
  .big-icon--web.color--success {
@@ -13598,7 +13871,7 @@ doc-react-playground {
13598
13871
  .big-icon--cog {
13599
13872
  content: ""; }
13600
13873
  .big-icon--cog.color--default {
13601
- color: #333333; }
13874
+ color: #2c323a; }
13602
13875
  .big-icon--cog.color--primary {
13603
13876
  color: var(--sd-colour-primary) !important; }
13604
13877
  .big-icon--cog.color--success {
@@ -13629,7 +13902,7 @@ doc-react-playground {
13629
13902
  .big-icon--send-to {
13630
13903
  content: ""; }
13631
13904
  .big-icon--send-to.color--default {
13632
- color: #333333; }
13905
+ color: #2c323a; }
13633
13906
  .big-icon--send-to.color--primary {
13634
13907
  color: var(--sd-colour-primary) !important; }
13635
13908
  .big-icon--send-to.color--success {
@@ -13660,7 +13933,7 @@ doc-react-playground {
13660
13933
  .big-icon--info {
13661
13934
  content: ""; }
13662
13935
  .big-icon--info.color--default {
13663
- color: #333333; }
13936
+ color: #2c323a; }
13664
13937
  .big-icon--info.color--primary {
13665
13938
  color: var(--sd-colour-primary) !important; }
13666
13939
  .big-icon--info.color--success {
@@ -13691,7 +13964,7 @@ doc-react-playground {
13691
13964
  .big-icon--find-replace {
13692
13965
  content: ""; }
13693
13966
  .big-icon--find-replace.color--default {
13694
- color: #333333; }
13967
+ color: #2c323a; }
13695
13968
  .big-icon--find-replace.color--primary {
13696
13969
  color: var(--sd-colour-primary) !important; }
13697
13970
  .big-icon--find-replace.color--success {
@@ -13722,7 +13995,7 @@ doc-react-playground {
13722
13995
  .big-icon--comments {
13723
13996
  content: ""; }
13724
13997
  .big-icon--comments.color--default {
13725
- color: #333333; }
13998
+ color: #2c323a; }
13726
13999
  .big-icon--comments.color--primary {
13727
14000
  color: var(--sd-colour-primary) !important; }
13728
14001
  .big-icon--comments.color--success {
@@ -13753,7 +14026,7 @@ doc-react-playground {
13753
14026
  .big-icon--history {
13754
14027
  content: ""; }
13755
14028
  .big-icon--history.color--default {
13756
- color: #333333; }
14029
+ color: #2c323a; }
13757
14030
  .big-icon--history.color--primary {
13758
14031
  color: var(--sd-colour-primary) !important; }
13759
14032
  .big-icon--history.color--success {
@@ -13784,7 +14057,7 @@ doc-react-playground {
13784
14057
  .big-icon--package {
13785
14058
  content: ""; }
13786
14059
  .big-icon--package.color--default {
13787
- color: #333333; }
14060
+ color: #2c323a; }
13788
14061
  .big-icon--package.color--primary {
13789
14062
  color: var(--sd-colour-primary) !important; }
13790
14063
  .big-icon--package.color--success {
@@ -13815,7 +14088,7 @@ doc-react-playground {
13815
14088
  .big-icon--create-package {
13816
14089
  content: ""; }
13817
14090
  .big-icon--create-package.color--default {
13818
- color: #333333; }
14091
+ color: #2c323a; }
13819
14092
  .big-icon--create-package.color--primary {
13820
14093
  color: var(--sd-colour-primary) !important; }
13821
14094
  .big-icon--create-package.color--success {
@@ -13846,7 +14119,7 @@ doc-react-playground {
13846
14119
  .big-icon--add-to-package {
13847
14120
  content: ""; }
13848
14121
  .big-icon--add-to-package.color--default {
13849
- color: #333333; }
14122
+ color: #2c323a; }
13850
14123
  .big-icon--add-to-package.color--primary {
13851
14124
  color: var(--sd-colour-primary) !important; }
13852
14125
  .big-icon--add-to-package.color--success {
@@ -13877,7 +14150,7 @@ doc-react-playground {
13877
14150
  .big-icon--fetch {
13878
14151
  content: ""; }
13879
14152
  .big-icon--fetch.color--default {
13880
- color: #333333; }
14153
+ color: #2c323a; }
13881
14154
  .big-icon--fetch.color--primary {
13882
14155
  color: var(--sd-colour-primary) !important; }
13883
14156
  .big-icon--fetch.color--success {
@@ -13908,7 +14181,7 @@ doc-react-playground {
13908
14181
  .big-icon--fetch-as {
13909
14182
  content: ""; }
13910
14183
  .big-icon--fetch-as.color--default {
13911
- color: #333333; }
14184
+ color: #2c323a; }
13912
14185
  .big-icon--fetch-as.color--primary {
13913
14186
  color: var(--sd-colour-primary) !important; }
13914
14187
  .big-icon--fetch-as.color--success {
@@ -13939,7 +14212,7 @@ doc-react-playground {
13939
14212
  .big-icon--macro {
13940
14213
  content: ""; }
13941
14214
  .big-icon--macro.color--default {
13942
- color: #333333; }
14215
+ color: #2c323a; }
13943
14216
  .big-icon--macro.color--primary {
13944
14217
  color: var(--sd-colour-primary) !important; }
13945
14218
  .big-icon--macro.color--success {
@@ -13970,7 +14243,7 @@ doc-react-playground {
13970
14243
  .big-icon--related {
13971
14244
  content: ""; }
13972
14245
  .big-icon--related.color--default {
13973
- color: #333333; }
14246
+ color: #2c323a; }
13974
14247
  .big-icon--related.color--primary {
13975
14248
  color: var(--sd-colour-primary) !important; }
13976
14249
  .big-icon--related.color--success {
@@ -14001,7 +14274,7 @@ doc-react-playground {
14001
14274
  .big-icon--minimize {
14002
14275
  content: ""; }
14003
14276
  .big-icon--minimize.color--default {
14004
- color: #333333; }
14277
+ color: #2c323a; }
14005
14278
  .big-icon--minimize.color--primary {
14006
14279
  color: var(--sd-colour-primary) !important; }
14007
14280
  .big-icon--minimize.color--success {
@@ -14032,7 +14305,7 @@ doc-react-playground {
14032
14305
  .big-icon--settings {
14033
14306
  content: ""; }
14034
14307
  .big-icon--settings.color--default {
14035
- color: #333333; }
14308
+ color: #2c323a; }
14036
14309
  .big-icon--settings.color--primary {
14037
14310
  color: var(--sd-colour-primary) !important; }
14038
14311
  .big-icon--settings.color--success {
@@ -14063,7 +14336,7 @@ doc-react-playground {
14063
14336
  .big-icon--multiedit {
14064
14337
  content: ""; }
14065
14338
  .big-icon--multiedit.color--default {
14066
- color: #333333; }
14339
+ color: #2c323a; }
14067
14340
  .big-icon--multiedit.color--primary {
14068
14341
  color: var(--sd-colour-primary) !important; }
14069
14342
  .big-icon--multiedit.color--success {
@@ -14094,7 +14367,7 @@ doc-react-playground {
14094
14367
  .big-icon--export {
14095
14368
  content: ""; }
14096
14369
  .big-icon--export.color--default {
14097
- color: #333333; }
14370
+ color: #2c323a; }
14098
14371
  .big-icon--export.color--primary {
14099
14372
  color: var(--sd-colour-primary) !important; }
14100
14373
  .big-icon--export.color--success {
@@ -14125,7 +14398,7 @@ doc-react-playground {
14125
14398
  .big-icon--create-list {
14126
14399
  content: ""; }
14127
14400
  .big-icon--create-list.color--default {
14128
- color: #333333; }
14401
+ color: #2c323a; }
14129
14402
  .big-icon--create-list.color--primary {
14130
14403
  color: var(--sd-colour-primary) !important; }
14131
14404
  .big-icon--create-list.color--success {
@@ -14156,7 +14429,7 @@ doc-react-playground {
14156
14429
  .big-icon--add-to-list {
14157
14430
  content: ""; }
14158
14431
  .big-icon--add-to-list.color--default {
14159
- color: #333333; }
14432
+ color: #2c323a; }
14160
14433
  .big-icon--add-to-list.color--primary {
14161
14434
  color: var(--sd-colour-primary) !important; }
14162
14435
  .big-icon--add-to-list.color--success {
@@ -14187,7 +14460,7 @@ doc-react-playground {
14187
14460
  .big-icon--text {
14188
14461
  content: ""; }
14189
14462
  .big-icon--text.color--default {
14190
- color: #333333; }
14463
+ color: #2c323a; }
14191
14464
  .big-icon--text.color--primary {
14192
14465
  color: var(--sd-colour-primary) !important; }
14193
14466
  .big-icon--text.color--success {
@@ -14218,7 +14491,7 @@ doc-react-playground {
14218
14491
  .big-icon--desk {
14219
14492
  content: ""; }
14220
14493
  .big-icon--desk.color--default {
14221
- color: #333333; }
14494
+ color: #2c323a; }
14222
14495
  .big-icon--desk.color--primary {
14223
14496
  color: var(--sd-colour-primary) !important; }
14224
14497
  .big-icon--desk.color--success {
@@ -14249,7 +14522,7 @@ doc-react-playground {
14249
14522
  .big-icon--chevron-left {
14250
14523
  content: ""; }
14251
14524
  .big-icon--chevron-left.color--default {
14252
- color: #333333; }
14525
+ color: #2c323a; }
14253
14526
  .big-icon--chevron-left.color--primary {
14254
14527
  color: var(--sd-colour-primary) !important; }
14255
14528
  .big-icon--chevron-left.color--success {
@@ -14280,7 +14553,7 @@ doc-react-playground {
14280
14553
  .big-icon--chevron-right {
14281
14554
  content: ""; }
14282
14555
  .big-icon--chevron-right.color--default {
14283
- color: #333333; }
14556
+ color: #2c323a; }
14284
14557
  .big-icon--chevron-right.color--primary {
14285
14558
  color: var(--sd-colour-primary) !important; }
14286
14559
  .big-icon--chevron-right.color--success {
@@ -14311,7 +14584,7 @@ doc-react-playground {
14311
14584
  .big-icon--dashboard-alt {
14312
14585
  content: ""; }
14313
14586
  .big-icon--dashboard-alt.color--default {
14314
- color: #333333; }
14587
+ color: #2c323a; }
14315
14588
  .big-icon--dashboard-alt.color--primary {
14316
14589
  color: var(--sd-colour-primary) !important; }
14317
14590
  .big-icon--dashboard-alt.color--success {
@@ -14342,7 +14615,7 @@ doc-react-playground {
14342
14615
  .big-icon--master {
14343
14616
  content: ""; }
14344
14617
  .big-icon--master.color--default {
14345
- color: #333333; }
14618
+ color: #2c323a; }
14346
14619
  .big-icon--master.color--primary {
14347
14620
  color: var(--sd-colour-primary) !important; }
14348
14621
  .big-icon--master.color--success {
@@ -14373,7 +14646,7 @@ doc-react-playground {
14373
14646
  .big-icon--attachment {
14374
14647
  content: ""; }
14375
14648
  .big-icon--attachment.color--default {
14376
- color: #333333; }
14649
+ color: #2c323a; }
14377
14650
  .big-icon--attachment.color--primary {
14378
14651
  color: var(--sd-colour-primary) !important; }
14379
14652
  .big-icon--attachment.color--success {
@@ -14404,7 +14677,7 @@ doc-react-playground {
14404
14677
  .big-icon--upload-alt {
14405
14678
  content: ""; }
14406
14679
  .big-icon--upload-alt.color--default {
14407
- color: #333333; }
14680
+ color: #2c323a; }
14408
14681
  .big-icon--upload-alt.color--primary {
14409
14682
  color: var(--sd-colour-primary) !important; }
14410
14683
  .big-icon--upload-alt.color--success {
@@ -14435,7 +14708,7 @@ doc-react-playground {
14435
14708
  .big-icon--document-default {
14436
14709
  content: ""; }
14437
14710
  .big-icon--document-default.color--default {
14438
- color: #333333; }
14711
+ color: #2c323a; }
14439
14712
  .big-icon--document-default.color--primary {
14440
14713
  color: var(--sd-colour-primary) !important; }
14441
14714
  .big-icon--document-default.color--success {
@@ -14466,7 +14739,7 @@ doc-react-playground {
14466
14739
  .big-icon--document-pdf {
14467
14740
  content: ""; }
14468
14741
  .big-icon--document-pdf.color--default {
14469
- color: #333333; }
14742
+ color: #2c323a; }
14470
14743
  .big-icon--document-pdf.color--primary {
14471
14744
  color: var(--sd-colour-primary) !important; }
14472
14745
  .big-icon--document-pdf.color--success {
@@ -14497,7 +14770,7 @@ doc-react-playground {
14497
14770
  .big-icon--document-doc {
14498
14771
  content: ""; }
14499
14772
  .big-icon--document-doc.color--default {
14500
- color: #333333; }
14773
+ color: #2c323a; }
14501
14774
  .big-icon--document-doc.color--primary {
14502
14775
  color: var(--sd-colour-primary) !important; }
14503
14776
  .big-icon--document-doc.color--success {
@@ -14528,7 +14801,7 @@ doc-react-playground {
14528
14801
  .big-icon--semantics {
14529
14802
  content: ""; }
14530
14803
  .big-icon--semantics.color--default {
14531
- color: #333333; }
14804
+ color: #2c323a; }
14532
14805
  .big-icon--semantics.color--primary {
14533
14806
  color: var(--sd-colour-primary) !important; }
14534
14807
  .big-icon--semantics.color--success {
@@ -14559,7 +14832,7 @@ doc-react-playground {
14559
14832
  .big-icon--picture {
14560
14833
  content: ""; }
14561
14834
  .big-icon--picture.color--default {
14562
- color: #333333; }
14835
+ color: #2c323a; }
14563
14836
  .big-icon--picture.color--primary {
14564
14837
  color: var(--sd-colour-primary) !important; }
14565
14838
  .big-icon--picture.color--success {
@@ -14590,7 +14863,7 @@ doc-react-playground {
14590
14863
  .big-icon--manage-package {
14591
14864
  content: ""; }
14592
14865
  .big-icon--manage-package.color--default {
14593
- color: #333333; }
14866
+ color: #2c323a; }
14594
14867
  .big-icon--manage-package.color--primary {
14595
14868
  color: var(--sd-colour-primary) !important; }
14596
14869
  .big-icon--manage-package.color--success {
@@ -14621,7 +14894,7 @@ doc-react-playground {
14621
14894
  .big-icon--live {
14622
14895
  content: ""; }
14623
14896
  .big-icon--live.color--default {
14624
- color: #333333; }
14897
+ color: #2c323a; }
14625
14898
  .big-icon--live.color--primary {
14626
14899
  color: var(--sd-colour-primary) !important; }
14627
14900
  .big-icon--live.color--success {
@@ -14652,7 +14925,7 @@ doc-react-playground {
14652
14925
  .big-icon--live-alt {
14653
14926
  content: ""; }
14654
14927
  .big-icon--live-alt.color--default {
14655
- color: #333333; }
14928
+ color: #2c323a; }
14656
14929
  .big-icon--live-alt.color--primary {
14657
14930
  color: var(--sd-colour-primary) !important; }
14658
14931
  .big-icon--live-alt.color--success {
@@ -14683,7 +14956,7 @@ doc-react-playground {
14683
14956
  .big-icon--meta-search {
14684
14957
  content: ""; }
14685
14958
  .big-icon--meta-search.color--default {
14686
- color: #333333; }
14959
+ color: #2c323a; }
14687
14960
  .big-icon--meta-search.color--primary {
14688
14961
  color: var(--sd-colour-primary) !important; }
14689
14962
  .big-icon--meta-search.color--success {
@@ -14714,7 +14987,7 @@ doc-react-playground {
14714
14987
  .big-icon--chat {
14715
14988
  content: ""; }
14716
14989
  .big-icon--chat.color--default {
14717
- color: #333333; }
14990
+ color: #2c323a; }
14718
14991
  .big-icon--chat.color--primary {
14719
14992
  color: var(--sd-colour-primary) !important; }
14720
14993
  .big-icon--chat.color--success {
@@ -14745,7 +15018,7 @@ doc-react-playground {
14745
15018
  .big-icon--annotation {
14746
15019
  content: ""; }
14747
15020
  .big-icon--annotation.color--default {
14748
- color: #333333; }
15021
+ color: #2c323a; }
14749
15022
  .big-icon--annotation.color--primary {
14750
15023
  color: var(--sd-colour-primary) !important; }
14751
15024
  .big-icon--annotation.color--success {
@@ -14776,7 +15049,7 @@ doc-react-playground {
14776
15049
  .big-icon--suggestion {
14777
15050
  content: ""; }
14778
15051
  .big-icon--suggestion.color--default {
14779
- color: #333333; }
15052
+ color: #2c323a; }
14780
15053
  .big-icon--suggestion.color--primary {
14781
15054
  color: var(--sd-colour-primary) !important; }
14782
15055
  .big-icon--suggestion.color--success {
@@ -14807,7 +15080,7 @@ doc-react-playground {
14807
15080
  .big-icon--publisher {
14808
15081
  content: ""; }
14809
15082
  .big-icon--publisher.color--default {
14810
- color: #333333; }
15083
+ color: #2c323a; }
14811
15084
  .big-icon--publisher.color--primary {
14812
15085
  color: var(--sd-colour-primary) !important; }
14813
15086
  .big-icon--publisher.color--success {
@@ -14838,7 +15111,7 @@ doc-react-playground {
14838
15111
  .big-icon--tag {
14839
15112
  content: ""; }
14840
15113
  .big-icon--tag.color--default {
14841
- color: #333333; }
15114
+ color: #2c323a; }
14842
15115
  .big-icon--tag.color--primary {
14843
15116
  color: var(--sd-colour-primary) !important; }
14844
15117
  .big-icon--tag.color--success {
@@ -14869,7 +15142,7 @@ doc-react-playground {
14869
15142
  .big-icon--rundown {
14870
15143
  content: ""; }
14871
15144
  .big-icon--rundown.color--default {
14872
- color: #333333; }
15145
+ color: #2c323a; }
14873
15146
  .big-icon--rundown.color--primary {
14874
15147
  color: var(--sd-colour-primary) !important; }
14875
15148
  .big-icon--rundown.color--success {
@@ -14900,7 +15173,7 @@ doc-react-playground {
14900
15173
  .big-icon--checkmark-circle {
14901
15174
  content: ""; }
14902
15175
  .big-icon--checkmark-circle.color--default {
14903
- color: #333333; }
15176
+ color: #2c323a; }
14904
15177
  .big-icon--checkmark-circle.color--primary {
14905
15178
  color: var(--sd-colour-primary) !important; }
14906
15179
  .big-icon--checkmark-circle.color--success {