@carbon/ibm-products 1.3.0 → 1.6.1

Sign up to get free protection for your applications and to get access to all the features.
Files changed (184) hide show
  1. package/css/index-full-carbon.css +5102 -4711
  2. package/css/index-full-carbon.css.map +1 -1
  3. package/css/index-full-carbon.min.css +9 -3
  4. package/css/index-full-carbon.min.css.map +1 -0
  5. package/css/index-without-carbon-released-only.css +189 -108
  6. package/css/index-without-carbon-released-only.css.map +1 -1
  7. package/css/index-without-carbon-released-only.min.css +3 -3
  8. package/css/index-without-carbon-released-only.min.css.map +1 -0
  9. package/css/index-without-carbon.css +619 -236
  10. package/css/index-without-carbon.css.map +1 -1
  11. package/css/index-without-carbon.min.css +9 -3
  12. package/css/index-without-carbon.min.css.map +1 -0
  13. package/css/index.css +950 -567
  14. package/css/index.css.map +1 -1
  15. package/css/index.min.css +9 -3
  16. package/css/index.min.css.map +1 -0
  17. package/es/components/APIKeyModal/APIKeyModal.js +25 -29
  18. package/es/components/ActionBar/ActionBar.js +4 -1
  19. package/es/components/ActionSet/ActionSet.js +22 -10
  20. package/es/components/ActionSet/actions.js +25 -17
  21. package/es/components/AddSelect/AddSelect.js +141 -53
  22. package/es/components/AddSelect/AddSelectBreadcrumbs.js +56 -0
  23. package/es/components/AddSelect/AddSelectList.js +94 -0
  24. package/es/components/AddSelect/AddSelectSidebar.js +78 -0
  25. package/es/components/BreadcrumbWithOverflow/BreadcrumbWithOverflow.js +24 -17
  26. package/es/components/CancelableTextEdit/CancelableTextEdit.js +62 -24
  27. package/es/components/Card/Card.js +6 -4
  28. package/es/components/CreateFullPage/CreateFullPage.js +102 -258
  29. package/es/components/CreateFullPage/CreateFullPageStep.js +65 -13
  30. package/es/components/CreateFullPage/index.js +1 -2
  31. package/es/components/CreateInfluencer/CreateInfluencer.js +40 -220
  32. package/es/components/CreateTearsheet/CreateTearsheet.js +95 -146
  33. package/es/components/CreateTearsheet/CreateTearsheetStep.js +70 -20
  34. package/es/components/CreateTearsheet/index.js +0 -1
  35. package/es/components/CreateTearsheet/preview-components/MultiStepTearsheet.js +87 -28
  36. package/es/components/CreateTearsheet/preview-components/MultiStepWithIntro.js +8 -6
  37. package/es/components/EmptyStates/EmptyState.js +1 -1
  38. package/es/components/EmptyStates/EmptyStateContent.js +2 -2
  39. package/es/components/EmptyStates/ErrorEmptyState/ErrorEmptyState.js +1 -1
  40. package/es/components/EmptyStates/NoDataEmptyState/NoDataEmptyState.js +1 -1
  41. package/es/components/EmptyStates/NoTagsEmptyState/NoTagsEmptyState.js +1 -1
  42. package/es/components/EmptyStates/NotFoundEmptyState/NotFoundEmptyState.js +1 -1
  43. package/es/components/EmptyStates/NotificationsEmptyState/NotificationsEmptyState.js +1 -1
  44. package/es/components/EmptyStates/UnauthorizedEmptyState/UnauthorizedEmptyState.js +1 -1
  45. package/es/components/ExportModal/ExportModal.js +41 -12
  46. package/es/components/ImportModal/ImportModal.js +2 -1
  47. package/es/components/InlineEdit/InlineEdit.js +397 -0
  48. package/es/components/InlineEdit/index.js +7 -0
  49. package/es/components/MultiAddSelect/MultiAddSelect.js +16 -0
  50. package/es/components/MultiAddSelect/index.js +1 -0
  51. package/es/components/NotificationsPanel/NotificationsPanel.js +16 -3
  52. package/es/components/OptionsTile/OptionsTile.js +36 -15
  53. package/es/components/PageHeader/PageHeader.js +59 -35
  54. package/es/components/PageHeader/PageHeaderTitle.js +82 -7
  55. package/es/components/PageHeader/PageHeaderUtils.js +21 -2
  56. package/es/components/RemoveModal/RemoveModal.js +4 -2
  57. package/es/components/SidePanel/SidePanel.js +33 -16
  58. package/es/components/SingleAddSelect/SingleAddSelect.js +15 -0
  59. package/es/components/SingleAddSelect/index.js +1 -0
  60. package/es/components/TagSet/TagSet.js +4 -1
  61. package/es/components/Tearsheet/Tearsheet.js +1 -1
  62. package/es/components/Tearsheet/TearsheetNarrow.js +1 -1
  63. package/es/components/Tearsheet/TearsheetShell.js +1 -1
  64. package/es/components/Toolbar/Toolbar.js +69 -8
  65. package/es/components/WebTerminal/WebTerminal.js +1 -1
  66. package/es/components/index.js +4 -2
  67. package/es/global/js/hooks/index.js +1 -0
  68. package/es/global/js/hooks/useCreateComponentFocus.js +15 -19
  69. package/es/global/js/hooks/useCreateComponentStepChange.js +69 -79
  70. package/es/global/js/hooks/useResetCreateComponent.js +7 -4
  71. package/es/global/js/hooks/useRetrieveStepData.js +51 -0
  72. package/es/global/js/hooks/useValidCreateStepCount.js +4 -7
  73. package/es/global/js/package-settings.js +4 -2
  74. package/es/global/js/utils/lastIndexInArray.js +26 -0
  75. package/es/settings.js +0 -5
  76. package/lib/components/APIKeyModal/APIKeyModal.js +25 -29
  77. package/lib/components/ActionBar/ActionBar.js +4 -1
  78. package/lib/components/ActionSet/ActionSet.js +22 -10
  79. package/lib/components/ActionSet/actions.js +25 -17
  80. package/lib/components/AddSelect/AddSelect.js +141 -50
  81. package/lib/components/AddSelect/AddSelectBreadcrumbs.js +71 -0
  82. package/lib/components/AddSelect/AddSelectList.js +112 -0
  83. package/lib/components/AddSelect/AddSelectSidebar.js +89 -0
  84. package/lib/components/BreadcrumbWithOverflow/BreadcrumbWithOverflow.js +23 -16
  85. package/lib/components/CancelableTextEdit/CancelableTextEdit.js +62 -23
  86. package/lib/components/Card/Card.js +6 -4
  87. package/lib/components/CreateFullPage/CreateFullPage.js +102 -258
  88. package/lib/components/CreateFullPage/CreateFullPageStep.js +68 -13
  89. package/lib/components/CreateFullPage/index.js +1 -9
  90. package/lib/components/CreateInfluencer/CreateInfluencer.js +38 -231
  91. package/lib/components/CreateTearsheet/CreateTearsheet.js +97 -148
  92. package/lib/components/CreateTearsheet/CreateTearsheetStep.js +72 -19
  93. package/lib/components/CreateTearsheet/index.js +0 -8
  94. package/lib/components/CreateTearsheet/preview-components/MultiStepTearsheet.js +86 -34
  95. package/lib/components/CreateTearsheet/preview-components/MultiStepWithIntro.js +8 -6
  96. package/lib/components/EmptyStates/EmptyState.js +1 -1
  97. package/lib/components/EmptyStates/EmptyStateContent.js +2 -2
  98. package/lib/components/EmptyStates/ErrorEmptyState/ErrorEmptyState.js +1 -1
  99. package/lib/components/EmptyStates/NoDataEmptyState/NoDataEmptyState.js +1 -1
  100. package/lib/components/EmptyStates/NoTagsEmptyState/NoTagsEmptyState.js +1 -1
  101. package/lib/components/EmptyStates/NotFoundEmptyState/NotFoundEmptyState.js +1 -1
  102. package/lib/components/EmptyStates/NotificationsEmptyState/NotificationsEmptyState.js +1 -1
  103. package/lib/components/EmptyStates/UnauthorizedEmptyState/UnauthorizedEmptyState.js +1 -1
  104. package/lib/components/ExportModal/ExportModal.js +38 -11
  105. package/lib/components/ImportModal/ImportModal.js +2 -1
  106. package/lib/components/InlineEdit/InlineEdit.js +413 -0
  107. package/lib/components/InlineEdit/index.js +13 -0
  108. package/lib/components/MultiAddSelect/MultiAddSelect.js +37 -0
  109. package/lib/components/MultiAddSelect/index.js +13 -0
  110. package/lib/components/NotificationsPanel/NotificationsPanel.js +13 -1
  111. package/lib/components/OptionsTile/OptionsTile.js +36 -15
  112. package/lib/components/PageHeader/PageHeader.js +59 -35
  113. package/lib/components/PageHeader/PageHeaderTitle.js +91 -9
  114. package/lib/components/PageHeader/PageHeaderUtils.js +21 -2
  115. package/lib/components/RemoveModal/RemoveModal.js +4 -2
  116. package/lib/components/SidePanel/SidePanel.js +33 -16
  117. package/lib/components/SingleAddSelect/SingleAddSelect.js +36 -0
  118. package/lib/components/SingleAddSelect/index.js +13 -0
  119. package/lib/components/TagSet/TagSet.js +4 -1
  120. package/lib/components/Tearsheet/Tearsheet.js +1 -1
  121. package/lib/components/Tearsheet/TearsheetNarrow.js +1 -1
  122. package/lib/components/Tearsheet/TearsheetShell.js +1 -1
  123. package/lib/components/Toolbar/Toolbar.js +69 -6
  124. package/lib/components/WebTerminal/WebTerminal.js +1 -1
  125. package/lib/components/index.js +25 -9
  126. package/lib/global/js/hooks/index.js +8 -0
  127. package/lib/global/js/hooks/useCreateComponentFocus.js +15 -19
  128. package/lib/global/js/hooks/useCreateComponentStepChange.js +69 -79
  129. package/lib/global/js/hooks/useResetCreateComponent.js +7 -4
  130. package/lib/global/js/hooks/useRetrieveStepData.js +62 -0
  131. package/lib/global/js/hooks/useValidCreateStepCount.js +4 -7
  132. package/lib/global/js/package-settings.js +4 -2
  133. package/lib/global/js/utils/lastIndexInArray.js +35 -0
  134. package/lib/settings.js +0 -6
  135. package/package.json +24 -24
  136. package/scss/components/AddSelect/_add-select.scss +53 -8
  137. package/scss/components/BreadcrumbWithOverflow/_breadcrumb-with-overflow.scss +19 -15
  138. package/scss/components/BreadcrumbWithOverflow/_index.scss +1 -1
  139. package/scss/components/CancelableTextEdit/_cancelable-text-edit.scss +142 -70
  140. package/scss/components/CancelableTextEdit/_storybook-styles.scss +0 -7
  141. package/scss/components/CreateFullPage/_create-full-page.scss +4 -11
  142. package/scss/components/CreateInfluencer/_create-influencer.scss +4 -4
  143. package/scss/components/CreateTearsheet/_create-tearsheet.scss +6 -10
  144. package/scss/components/CreateTearsheetNarrow/_storybook-styles.scss +0 -6
  145. package/scss/components/EditSidePanel/_storybook-styles.scss +0 -8
  146. package/scss/components/InlineEdit/_index.scss +8 -0
  147. package/scss/components/InlineEdit/_inline-edit.scss +320 -0
  148. package/scss/components/InlineEdit/_storybook-styles.scss +21 -0
  149. package/scss/components/LoadingBar/_storybook-styles.scss +0 -5
  150. package/scss/components/MultiAddSelect/_index.scss +1 -0
  151. package/scss/components/MultiAddSelect/_multi-add-select.scss +1 -0
  152. package/scss/components/MultiAddSelect/_storybook-styles.scss +6 -0
  153. package/scss/components/NotificationsPanel/_notifications-panel.scss +2 -2
  154. package/scss/components/OptionsTile/_storybook-styles.scss +0 -7
  155. package/scss/components/PageHeader/_index.scss +1 -1
  156. package/scss/components/PageHeader/_page-header.scss +18 -5
  157. package/scss/components/ProductiveCard/_productive-card.scss +0 -4
  158. package/scss/components/SidePanel/_side-panel.scss +15 -6
  159. package/scss/components/SingleAddSelect/_index.scss +1 -0
  160. package/scss/components/SingleAddSelect/_single-add-select.scss +1 -0
  161. package/scss/components/SingleAddSelect/_storybook-styles.scss +6 -0
  162. package/scss/components/StatusIcon/_index.scss +1 -1
  163. package/scss/components/StatusIcon/_status-icon.scss +6 -4
  164. package/scss/components/TagSet/_index.scss +1 -1
  165. package/scss/components/UserProfileImage/_index.scss +1 -1
  166. package/scss/components/UserProfileImage/_user-profile-image.scss +2 -2
  167. package/scss/components/WebTerminal/_web-terminal.scss +2 -2
  168. package/scss/components/_index.scss +3 -1
  169. package/scss/global/styles/_project-settings.scss +5 -1
  170. package/es/components/CreateFullPage/CreateFullPageSection.js +0 -53
  171. package/es/components/CreateFullPage/constants.js +0 -8
  172. package/es/components/CreateTearsheet/CreateTearsheetSection.js +0 -83
  173. package/es/components/CreateTearsheet/constants.js +0 -8
  174. package/es/components/CreateTearsheet/preview-components/MultiStepWithSectionsTearsheet.js +0 -327
  175. package/es/generated/feature-flags/feature-flags.js +0 -15
  176. package/es/global/js/utils/hasValidType.js +0 -94
  177. package/lib/components/CreateFullPage/CreateFullPageSection.js +0 -74
  178. package/lib/components/CreateFullPage/constants.js +0 -16
  179. package/lib/components/CreateTearsheet/CreateTearsheetSection.js +0 -105
  180. package/lib/components/CreateTearsheet/constants.js +0 -17
  181. package/lib/components/CreateTearsheet/preview-components/MultiStepWithSectionsTearsheet.js +0 -354
  182. package/lib/generated/feature-flags/feature-flags.js +0 -22
  183. package/lib/global/js/utils/hasValidType.js +0 -110
  184. package/scss/generated/feature-flags/_feature-flags.scss +0 -19
@@ -1188,7 +1188,7 @@
1188
1188
  /* stylelint-disable-line no-invalid-position-at-import-rule */
1189
1189
  /* stylelint-disable-line no-invalid-position-at-import-rule */
1190
1190
  /* stylelint-disable-line no-invalid-position-at-import-rule */
1191
- @keyframes influencerMenuEntrance {
1191
+ @keyframes influencer-menu-entrance {
1192
1192
  0% {
1193
1193
  opacity: 0;
1194
1194
  transform: translateX(calc(-1 * var(--cds-spacing-05, 1rem)));
@@ -1198,7 +1198,7 @@
1198
1198
  transform: translateX(0);
1199
1199
  }
1200
1200
  }
1201
- @keyframes influencerMenuExit {
1201
+ @keyframes influencer-menu-exit {
1202
1202
  0% {
1203
1203
  opacity: 1;
1204
1204
  transform: translateX(0);
@@ -1233,14 +1233,14 @@
1233
1233
 
1234
1234
  .c4p--create-influencer__side-nav-opening,
1235
1235
  .c4p--create-influencer__progress-indicator-opening {
1236
- animation: influencerMenuEntrance 240ms 1;
1236
+ animation: influencer-menu-entrance 240ms 1;
1237
1237
  animation-fill-mode: forwards;
1238
1238
  transition-timing-function: cubic-bezier(0, 0, 0.38, 0.9);
1239
1239
  }
1240
1240
 
1241
1241
  .c4p--create-influencer__side-nav-closing,
1242
1242
  .c4p--create-influencer__progress-indicator-closing {
1243
- animation: influencerMenuExit 240ms 1;
1243
+ animation: influencer-menu-exit 240ms 1;
1244
1244
  animation-fill-mode: forwards;
1245
1245
  transition-timing-function: cubic-bezier(0.2, 0, 1, 0.9);
1246
1246
  }
@@ -1362,20 +1362,14 @@
1362
1362
  margin-left: 0;
1363
1363
  }
1364
1364
 
1365
- .c4p--create-full-page .c4p--create-full-page__step--hidden-step,
1366
- .c4p--create-full-page .c4p--create-full-page__step--hidden-section {
1365
+ .c4p--create-full-page .c4p--create-full-page__step__step--hidden-step {
1367
1366
  display: none;
1368
1367
  }
1369
1368
 
1370
- .c4p--create-full-page .c4p--create-full-page__step--visible-section {
1369
+ .c4p--create-full-page .c4p--create-full-page__step__step--visible-step {
1371
1370
  display: block;
1372
1371
  }
1373
1372
 
1374
- .c4p--create-full-page .c4p--create-full-page__step--visible-step {
1375
- opacity: 1;
1376
- }
1377
-
1378
- .c4p--create-full-page .c4p--create-full-page__section-subtitle,
1379
1373
  .c4p--create-full-page .c4p--create-full-page__step-subtitle {
1380
1374
  font-size: var(--cds-productive-heading-01-font-size, 0.875rem);
1381
1375
  font-weight: var(--cds-productive-heading-01-font-weight, 600);
@@ -1385,7 +1379,6 @@
1385
1379
  margin-bottom: var(--cds-spacing-03, 0.5rem);
1386
1380
  }
1387
1381
 
1388
- .c4p--create-full-page .c4p--create-full-page__section-description,
1389
1382
  .c4p--create-full-page .c4p--create-full-page__step-description {
1390
1383
  font-size: var(--cds-body-long-01-font-size, 0.875rem);
1391
1384
  font-weight: var(--cds-body-long-01-font-weight, 400);
@@ -1473,8 +1466,7 @@
1473
1466
  content: "";
1474
1467
  }
1475
1468
 
1476
- .c4p--create-full-page .c4p--create-full-page__step-title,
1477
- .c4p--create-full-page .c4p--create-full-page__section-title {
1469
+ .c4p--create-full-page .c4p--create-full-page__step-title {
1478
1470
  font-size: var(--cds-productive-heading-04-font-size, 1.75rem);
1479
1471
  font-weight: var(--cds-productive-heading-04-font-weight, 400);
1480
1472
  line-height: var(--cds-productive-heading-04-line-height, 1.28572);
@@ -1682,7 +1674,7 @@
1682
1674
  stroke-dashoffset: 0;
1683
1675
  }
1684
1676
  }
1685
- @keyframes sidePanelExitLeft {
1677
+ @keyframes side-panel-exit-left {
1686
1678
  0% {
1687
1679
  opacity: 1;
1688
1680
  transform: translateX(0);
@@ -1692,7 +1684,7 @@
1692
1684
  transform: translateX(calc(-1 * 30rem));
1693
1685
  }
1694
1686
  }
1695
- @keyframes sidePanelExitRight {
1687
+ @keyframes side-panel-exit-right {
1696
1688
  0% {
1697
1689
  opacity: 1;
1698
1690
  transform: translateX(0);
@@ -1740,7 +1732,7 @@
1740
1732
  right: 0;
1741
1733
  border-left: 1px solid var(--cds-decorative-01, #e0e0e0);
1742
1734
  }
1743
- @keyframes sidePanelEntranceRight {
1735
+ @keyframes side-panel-entrance-right {
1744
1736
  0% {
1745
1737
  opacity: 0;
1746
1738
  transform: translateX(16rem);
@@ -1756,7 +1748,7 @@
1756
1748
  left: 0;
1757
1749
  border-right: 1px solid var(--cds-decorative-01, #e0e0e0);
1758
1750
  }
1759
- @keyframes sidePanelEntranceLeft {
1751
+ @keyframes side-panel-entrance-left {
1760
1752
  0% {
1761
1753
  opacity: 0;
1762
1754
  transform: translateX(-16rem);
@@ -1783,7 +1775,7 @@
1783
1775
  right: 0;
1784
1776
  border-left: 1px solid var(--cds-decorative-01, #e0e0e0);
1785
1777
  }
1786
- @keyframes sidePanelEntranceRight {
1778
+ @keyframes side-panel-entrance-right {
1787
1779
  0% {
1788
1780
  opacity: 0;
1789
1781
  transform: translateX(20rem);
@@ -1799,7 +1791,7 @@
1799
1791
  left: 0;
1800
1792
  border-right: 1px solid var(--cds-decorative-01, #e0e0e0);
1801
1793
  }
1802
- @keyframes sidePanelEntranceLeft {
1794
+ @keyframes side-panel-entrance-left {
1803
1795
  0% {
1804
1796
  opacity: 0;
1805
1797
  transform: translateX(-20rem);
@@ -1826,7 +1818,7 @@
1826
1818
  right: 0;
1827
1819
  border-left: 1px solid var(--cds-decorative-01, #e0e0e0);
1828
1820
  }
1829
- @keyframes sidePanelEntranceRight {
1821
+ @keyframes side-panel-entrance-right {
1830
1822
  0% {
1831
1823
  opacity: 0;
1832
1824
  transform: translateX(30rem);
@@ -1842,7 +1834,7 @@
1842
1834
  left: 0;
1843
1835
  border-right: 1px solid var(--cds-decorative-01, #e0e0e0);
1844
1836
  }
1845
- @keyframes sidePanelEntranceLeft {
1837
+ @keyframes side-panel-entrance-left {
1846
1838
  0% {
1847
1839
  opacity: 0;
1848
1840
  transform: translateX(-30rem);
@@ -1869,7 +1861,7 @@
1869
1861
  right: 0;
1870
1862
  border-left: 1px solid var(--cds-decorative-01, #e0e0e0);
1871
1863
  }
1872
- @keyframes sidePanelEntranceRight {
1864
+ @keyframes side-panel-entrance-right {
1873
1865
  0% {
1874
1866
  opacity: 0;
1875
1867
  transform: translateX(40rem);
@@ -1885,7 +1877,7 @@
1885
1877
  left: 0;
1886
1878
  border-right: 1px solid var(--cds-decorative-01, #e0e0e0);
1887
1879
  }
1888
- @keyframes sidePanelEntranceLeft {
1880
+ @keyframes side-panel-entrance-left {
1889
1881
  0% {
1890
1882
  opacity: 0;
1891
1883
  transform: translateX(-40rem);
@@ -1912,7 +1904,7 @@
1912
1904
  right: 0;
1913
1905
  border-left: 1px solid var(--cds-decorative-01, #e0e0e0);
1914
1906
  }
1915
- @keyframes sidePanelEntranceRight {
1907
+ @keyframes side-panel-entrance-right {
1916
1908
  0% {
1917
1909
  opacity: 0;
1918
1910
  transform: translateX(75%);
@@ -1928,7 +1920,7 @@
1928
1920
  left: 0;
1929
1921
  border-right: 1px solid var(--cds-decorative-01, #e0e0e0);
1930
1922
  }
1931
- @keyframes sidePanelEntranceLeft {
1923
+ @keyframes side-panel-entrance-left {
1932
1924
  0% {
1933
1925
  opacity: 0;
1934
1926
  transform: translateX(-75%);
@@ -1972,6 +1964,15 @@
1972
1964
  content: "";
1973
1965
  opacity: var(--c4p--side-panel--divider-opacity);
1974
1966
  }
1967
+ .c4p--side-panel__container .c4p--side-panel__title-container.c4p--side-panel__title-container--reduced-motion {
1968
+ z-index: 5;
1969
+ border-bottom: 1px solid var(--cds-decorative-01, #e0e0e0);
1970
+ margin-bottom: var(--cds-spacing-05, 1rem);
1971
+ }
1972
+ .c4p--side-panel__container .c4p--side-panel__title-container.c4p--side-panel__title-container--reduced-motion.c4p--side-panel__title-container--no-title-animation {
1973
+ border-bottom: 0;
1974
+ margin-bottom: 0;
1975
+ }
1975
1976
  .c4p--side-panel__container .c4p--side-panel__title-container.c4p--side-panel__on-detail-step .c4p--side-panel__collapsed-title-text {
1976
1977
  top: var(--cds-spacing-09, 3rem);
1977
1978
  }
@@ -2202,7 +2203,7 @@
2202
2203
  background-color: var(--cds-field-02, #ffffff);
2203
2204
  }
2204
2205
 
2205
- @keyframes sidePanelOverlayEntrance {
2206
+ @keyframes side-panel-overlay-entrance {
2206
2207
  0% {
2207
2208
  opacity: 0;
2208
2209
  }
@@ -2210,7 +2211,7 @@
2210
2211
  opacity: 1;
2211
2212
  }
2212
2213
  }
2213
- @keyframes sidePanelOverlayExit {
2214
+ @keyframes side-panel-overlay-exit {
2214
2215
  0% {
2215
2216
  opacity: 1;
2216
2217
  }
@@ -3210,7 +3211,7 @@
3210
3211
  /* stylelint-disable-line no-invalid-position-at-import-rule */
3211
3212
  /* stylelint-disable-line no-invalid-position-at-import-rule */
3212
3213
  /* stylelint-disable-line no-invalid-position-at-import-rule */
3213
- @keyframes stepContentEntrance {
3214
+ @keyframes step-content-entrance {
3214
3215
  0% {
3215
3216
  opacity: 0;
3216
3217
  transform: translateY(-0.75rem);
@@ -3224,24 +3225,19 @@
3224
3225
  --c4p--tearsheet-create--total-width: 0;
3225
3226
  }
3226
3227
 
3227
- .c4p--tearsheet-create .c4p--tearsheet-create__step--hidden-step,
3228
- .c4p--tearsheet-create .c4p--tearsheet-create__step--hidden-section {
3228
+ .c4p--tearsheet-create .c4p--tearsheet-create__step__step--hidden-step {
3229
3229
  display: none;
3230
3230
  }
3231
3231
 
3232
- .c4p--tearsheet-create .c4p--tearsheet-create__step--visible-section {
3233
- display: block;
3234
- }
3235
-
3236
- .c4p--tearsheet-create .c4p--tearsheet-create__step--visible-step {
3237
- animation: 400ms stepContentEntrance;
3232
+ .c4p--tearsheet-create .c4p--tearsheet-create__step__step--visible-step {
3233
+ animation: 400ms step-content-entrance;
3238
3234
  animation-fill-mode: forwards;
3239
3235
  animation-timing-function: cubic-bezier(0.2, 0, 0.38, 0.9);
3240
3236
  opacity: 0;
3241
3237
  }
3242
3238
 
3243
3239
  @media (prefers-reduced-motion) {
3244
- .c4p--tearsheet-create .c4p--tearsheet-create__step--visible-step {
3240
+ .c4p--tearsheet-create .c4p--tearsheet-create__step__step--visible-step {
3245
3241
  animation: none;
3246
3242
  opacity: 1;
3247
3243
  }
@@ -4455,7 +4451,7 @@
4455
4451
  /* stylelint-disable-line no-invalid-position-at-import-rule */
4456
4452
  /* stylelint-disable-line no-invalid-position-at-import-rule */
4457
4453
  /* stylelint-disable-line no-invalid-position-at-import-rule */
4458
- @keyframes fadeIn {
4454
+ @keyframes fade-in {
4459
4455
  0% {
4460
4456
  opacity: 0;
4461
4457
  transform: translateY(-38.5rem);
@@ -4465,7 +4461,7 @@
4465
4461
  transform: translateY(0);
4466
4462
  }
4467
4463
  }
4468
- @keyframes fadeOut {
4464
+ @keyframes fade-out {
4469
4465
  0% {
4470
4466
  opacity: 1;
4471
4467
  transform: translateY(0);
@@ -4608,8 +4604,6 @@
4608
4604
  --cds-layer-selected-hover: #4c4c4c;
4609
4605
  --cds-layer-selected-inverse: #f4f4f4;
4610
4606
  --cds-border-subtle-selected: #525252;
4611
- --cds-layer-disabled: #262626;
4612
- --cds-field-disabled: #262626;
4613
4607
  --cds-border-disabled: #262626;
4614
4608
  --cds-text-disabled: #525252;
4615
4609
  --cds-button-disabled: #525252;
@@ -5428,14 +5422,9 @@
5428
5422
  white-space: nowrap;
5429
5423
  }
5430
5424
  .c4p--breadcrumb-with-overflow .c4p--breadcrumb-with-overflow__breadcrumb-container.c4p--breadcrumb-with-overflow__breadcrumb-container-with-items {
5431
- display: none;
5425
+ display: inline-flex;
5432
5426
  width: 100%;
5433
5427
  }
5434
- @media (min-width: 42rem) {
5435
- .c4p--breadcrumb-with-overflow .c4p--breadcrumb-with-overflow__breadcrumb-container.c4p--breadcrumb-with-overflow__breadcrumb-container-with-items {
5436
- display: inline-flex;
5437
- }
5438
- }
5439
5428
  .c4p--breadcrumb-with-overflow .c4p--breadcrumb-with-overflow__breadcrumb-container .bx--breadcrumb {
5440
5429
  width: 100%;
5441
5430
  flex-wrap: nowrap;
@@ -5450,11 +5439,24 @@
5450
5439
  pointer-events: none;
5451
5440
  visibility: hidden;
5452
5441
  }
5442
+ .c4p--breadcrumb-with-overflow .c4p--breadcrumb-with-overflow__breadcrumb-back {
5443
+ display: none;
5444
+ }
5445
+ @media (max-width: 41.98rem) {
5446
+ .c4p--breadcrumb-with-overflow .bx--breadcrumb-item {
5447
+ display: none;
5448
+ }
5449
+ .c4p--breadcrumb-with-overflow .c4p--breadcrumb-with-overflow__breadcrumb-back,
5453
5450
  .c4p--breadcrumb-with-overflow .bx--breadcrumb-item:last-child {
5454
- display: inline;
5451
+ display: inline-flex;
5452
+ vertical-align: middle;
5453
+ }
5454
+ }
5455
+ .c4p--breadcrumb-with-overflow .bx--breadcrumb-item:last-child {
5456
+ display: inline-flex;
5455
5457
  }
5456
5458
  .c4p--breadcrumb-with-overflow .c4p--breadcrumb-with-overflow__displayed-breadcrumb:last-child {
5457
- display: inline;
5459
+ display: inline-flex;
5458
5460
  overflow: hidden;
5459
5461
  }
5460
5462
  .c4p--breadcrumb-with-overflow .c4p--breadcrumb-with-overflow__displayed-breadcrumb:last-child .bx--link {
@@ -5466,15 +5468,6 @@
5466
5468
  .c4p--breadcrumb-with-overflow .bx--link {
5467
5469
  max-height: 18px;
5468
5470
  }
5469
- .c4p--breadcrumb-with-overflow .c4p--breadcrumb-with-overflow__breadcrumb-back-button.bx--btn.bx--btn--icon-only.bx--tooltip__trigger {
5470
- display: inline-flex;
5471
- margin-top: calc(-1 * var(--cds-spacing-04, 0.75rem));
5472
- }
5473
- @media (min-width: 42rem) {
5474
- .c4p--breadcrumb-with-overflow .c4p--breadcrumb-with-overflow__breadcrumb-back-button.bx--btn.bx--btn--icon-only.bx--tooltip__trigger {
5475
- display: none;
5476
- }
5477
- }
5478
5471
 
5479
5472
  /* stylelint-disable-line no-invalid-position-at-import-rule */
5480
5473
  /* stylelint-disable-line no-invalid-position-at-import-rule */
@@ -5894,7 +5887,7 @@
5894
5887
  height: var(--cds-spacing-02, 0.25rem);
5895
5888
  }
5896
5889
  .c4p--page-header .c4p--page-header__breadcrumb-row:not(.c4p--page-header__breadcrumb-row--has-action-bar) {
5897
- margin-bottom: calc(-1 * var(--cds-spacing-03, 0.5rem));
5890
+ min-height: var(--cds-spacing-07, 2rem);
5898
5891
  }
5899
5892
  .c4p--page-header .c4p--page-header__breadcrumb-row--container {
5900
5893
  display: flex;
@@ -5925,7 +5918,7 @@
5925
5918
  transform: translateX(-50%) scaleX(1);
5926
5919
  transition: all 150ms ease-out;
5927
5920
  }
5928
- .c4p--page-header .c4p--page-header__breadcrumb-row--next-to-tabs::after,
5921
+ .c4p--page-header .c4p--page-header__breadcrumb-row--next-to-tabs:not(.c4p--page-header__has-page-actions-without-action-bar)::after,
5929
5922
  .c4p--page-header .c4p--page-header__breadcrumb-row--has-action-bar::after {
5930
5923
  /* creates a full width box shadow without causing scroll */
5931
5924
  box-shadow: 25vw 1px 0 0 var(--cds-ui-03, #e0e0e0), -25vw 1px 0 0 var(--cds-ui-03, #e0e0e0);
@@ -6113,8 +6106,6 @@
6113
6106
  top: var(--c4p--page-header--breadcrumb-top);
6114
6107
  }
6115
6108
  .c4p--page-header .c4p--page-header__title-column {
6116
- overflow: hidden;
6117
- /* required for ellipsis in title */
6118
6109
  min-height: 40px;
6119
6110
  flex: 0 0 100%;
6120
6111
  }
@@ -6129,10 +6120,19 @@
6129
6120
  font-weight: var(--cds-productive-heading-04-font-weight, 400);
6130
6121
  line-height: var(--cds-productive-heading-04-line-height, 1.28572);
6131
6122
  letter-spacing: var(--cds-productive-heading-04-letter-spacing, 0);
6132
- overflow: hidden;
6123
+ overflow-x: hidden;
6133
6124
  text-overflow: ellipsis;
6134
6125
  white-space: nowrap;
6135
6126
  }
6127
+ .c4p--page-header .c4p--page-header__title .c4p--inline-edit__value {
6128
+ transform: translateY(-2px);
6129
+ }
6130
+ .c4p--page-header .c4p--page-header__title--editable {
6131
+ display: flex;
6132
+ overflow: visible;
6133
+ margin-top: calc(-1 * var(--cds-spacing-01, 0.125rem));
6134
+ margin-left: calc(-1 * var(--cds-spacing-05, 1rem));
6135
+ }
6136
6136
  .c4p--page-header .c4p--page-header__title-skeleton {
6137
6137
  height: var(--cds-spacing-07, 2rem);
6138
6138
  }
@@ -6419,9 +6419,6 @@
6419
6419
  justify-content: space-between;
6420
6420
  border-top: 1px solid var(--cds-ui-03, #e0e0e0);
6421
6421
  }
6422
- .c4p--card__productive .c4p--card__footer .bx--btn svg {
6423
- margin-left: var(--cds-spacing-03, 0.5rem);
6424
- }
6425
6422
  .c4p--card__productive .c4p--card__footer-no-button {
6426
6423
  justify-content: flex-end;
6427
6424
  }
@@ -6921,386 +6918,470 @@
6921
6918
  fill: #161616;
6922
6919
  }
6923
6920
 
6921
+ .bx--btn.bx--btn--icon-only.bx--tooltip__trigger .c4p--status-icon--light.c4p--status-icon--light-fatal,
6924
6922
  .c4p--status-icon--light.c4p--status-icon--light-fatal {
6925
6923
  fill: #000000;
6926
6924
  }
6927
6925
  @media (prefers-reduced-motion) {
6928
- .c4p--status-icon--light.c4p--status-icon--light-fatal .c4p--status-icon--light.c4p--status-icon--light-in-progress {
6926
+ .bx--btn.bx--btn--icon-only.bx--tooltip__trigger .c4p--status-icon--light.c4p--status-icon--light-fatal .c4p--status-icon--light.c4p--status-icon--light-in-progress,
6927
+ .c4p--status-icon--light.c4p--status-icon--light-fatal .c4p--status-icon--light.c4p--status-icon--light-in-progress {
6929
6928
  animation: none;
6930
6929
  }
6931
6930
  }
6932
6931
 
6932
+ .bx--btn.bx--btn--icon-only.bx--tooltip__trigger .c4p--status-icon--light.c4p--status-icon--dark-fatal,
6933
6933
  .c4p--status-icon--light.c4p--status-icon--dark-fatal {
6934
6934
  fill: #000000;
6935
6935
  }
6936
6936
  @media (prefers-reduced-motion) {
6937
- .c4p--status-icon--light.c4p--status-icon--dark-fatal .c4p--status-icon--light.c4p--status-icon--dark-in-progress {
6937
+ .bx--btn.bx--btn--icon-only.bx--tooltip__trigger .c4p--status-icon--light.c4p--status-icon--dark-fatal .c4p--status-icon--light.c4p--status-icon--dark-in-progress,
6938
+ .c4p--status-icon--light.c4p--status-icon--dark-fatal .c4p--status-icon--light.c4p--status-icon--dark-in-progress {
6938
6939
  animation: none;
6939
6940
  }
6940
6941
  }
6941
6942
 
6943
+ .bx--btn.bx--btn--icon-only.bx--tooltip__trigger .c4p--status-icon--light.c4p--status-icon--light-critical,
6942
6944
  .c4p--status-icon--light.c4p--status-icon--light-critical {
6943
6945
  fill: #da1e28;
6944
6946
  }
6945
6947
  @media (prefers-reduced-motion) {
6946
- .c4p--status-icon--light.c4p--status-icon--light-critical .c4p--status-icon--light.c4p--status-icon--light-in-progress {
6948
+ .bx--btn.bx--btn--icon-only.bx--tooltip__trigger .c4p--status-icon--light.c4p--status-icon--light-critical .c4p--status-icon--light.c4p--status-icon--light-in-progress,
6949
+ .c4p--status-icon--light.c4p--status-icon--light-critical .c4p--status-icon--light.c4p--status-icon--light-in-progress {
6947
6950
  animation: none;
6948
6951
  }
6949
6952
  }
6950
6953
 
6954
+ .bx--btn.bx--btn--icon-only.bx--tooltip__trigger .c4p--status-icon--light.c4p--status-icon--dark-critical,
6951
6955
  .c4p--status-icon--light.c4p--status-icon--dark-critical {
6952
6956
  fill: #da1e28;
6953
6957
  }
6954
6958
  @media (prefers-reduced-motion) {
6955
- .c4p--status-icon--light.c4p--status-icon--dark-critical .c4p--status-icon--light.c4p--status-icon--dark-in-progress {
6959
+ .bx--btn.bx--btn--icon-only.bx--tooltip__trigger .c4p--status-icon--light.c4p--status-icon--dark-critical .c4p--status-icon--light.c4p--status-icon--dark-in-progress,
6960
+ .c4p--status-icon--light.c4p--status-icon--dark-critical .c4p--status-icon--light.c4p--status-icon--dark-in-progress {
6956
6961
  animation: none;
6957
6962
  }
6958
6963
  }
6959
6964
 
6965
+ .bx--btn.bx--btn--icon-only.bx--tooltip__trigger .c4p--status-icon--light.c4p--status-icon--light-major-warning,
6960
6966
  .c4p--status-icon--light.c4p--status-icon--light-major-warning {
6961
6967
  fill: #ff832b;
6962
6968
  }
6963
6969
  @media (prefers-reduced-motion) {
6964
- .c4p--status-icon--light.c4p--status-icon--light-major-warning .c4p--status-icon--light.c4p--status-icon--light-in-progress {
6970
+ .bx--btn.bx--btn--icon-only.bx--tooltip__trigger .c4p--status-icon--light.c4p--status-icon--light-major-warning .c4p--status-icon--light.c4p--status-icon--light-in-progress,
6971
+ .c4p--status-icon--light.c4p--status-icon--light-major-warning .c4p--status-icon--light.c4p--status-icon--light-in-progress {
6965
6972
  animation: none;
6966
6973
  }
6967
6974
  }
6968
6975
 
6976
+ .bx--btn.bx--btn--icon-only.bx--tooltip__trigger .c4p--status-icon--light.c4p--status-icon--dark-major-warning,
6969
6977
  .c4p--status-icon--light.c4p--status-icon--dark-major-warning {
6970
6978
  fill: #ff832b;
6971
6979
  }
6972
6980
  @media (prefers-reduced-motion) {
6973
- .c4p--status-icon--light.c4p--status-icon--dark-major-warning .c4p--status-icon--light.c4p--status-icon--dark-in-progress {
6981
+ .bx--btn.bx--btn--icon-only.bx--tooltip__trigger .c4p--status-icon--light.c4p--status-icon--dark-major-warning .c4p--status-icon--light.c4p--status-icon--dark-in-progress,
6982
+ .c4p--status-icon--light.c4p--status-icon--dark-major-warning .c4p--status-icon--light.c4p--status-icon--dark-in-progress {
6974
6983
  animation: none;
6975
6984
  }
6976
6985
  }
6977
6986
 
6987
+ .bx--btn.bx--btn--icon-only.bx--tooltip__trigger .c4p--status-icon--light.c4p--status-icon--light-minor-warning,
6978
6988
  .c4p--status-icon--light.c4p--status-icon--light-minor-warning {
6979
6989
  fill: #fddc69;
6980
6990
  }
6981
6991
  @media (prefers-reduced-motion) {
6982
- .c4p--status-icon--light.c4p--status-icon--light-minor-warning .c4p--status-icon--light.c4p--status-icon--light-in-progress {
6992
+ .bx--btn.bx--btn--icon-only.bx--tooltip__trigger .c4p--status-icon--light.c4p--status-icon--light-minor-warning .c4p--status-icon--light.c4p--status-icon--light-in-progress,
6993
+ .c4p--status-icon--light.c4p--status-icon--light-minor-warning .c4p--status-icon--light.c4p--status-icon--light-in-progress {
6983
6994
  animation: none;
6984
6995
  }
6985
6996
  }
6986
6997
 
6998
+ .bx--btn.bx--btn--icon-only.bx--tooltip__trigger .c4p--status-icon--light.c4p--status-icon--dark-minor-warning,
6987
6999
  .c4p--status-icon--light.c4p--status-icon--dark-minor-warning {
6988
7000
  fill: #fddc69;
6989
7001
  }
6990
7002
  @media (prefers-reduced-motion) {
6991
- .c4p--status-icon--light.c4p--status-icon--dark-minor-warning .c4p--status-icon--light.c4p--status-icon--dark-in-progress {
7003
+ .bx--btn.bx--btn--icon-only.bx--tooltip__trigger .c4p--status-icon--light.c4p--status-icon--dark-minor-warning .c4p--status-icon--light.c4p--status-icon--dark-in-progress,
7004
+ .c4p--status-icon--light.c4p--status-icon--dark-minor-warning .c4p--status-icon--light.c4p--status-icon--dark-in-progress {
6992
7005
  animation: none;
6993
7006
  }
6994
7007
  }
6995
7008
 
7009
+ .bx--btn.bx--btn--icon-only.bx--tooltip__trigger .c4p--status-icon--light.c4p--status-icon--light-undefined,
6996
7010
  .c4p--status-icon--light.c4p--status-icon--light-undefined {
6997
7011
  fill: #8a3ffc;
6998
7012
  }
6999
7013
  @media (prefers-reduced-motion) {
7000
- .c4p--status-icon--light.c4p--status-icon--light-undefined .c4p--status-icon--light.c4p--status-icon--light-in-progress {
7014
+ .bx--btn.bx--btn--icon-only.bx--tooltip__trigger .c4p--status-icon--light.c4p--status-icon--light-undefined .c4p--status-icon--light.c4p--status-icon--light-in-progress,
7015
+ .c4p--status-icon--light.c4p--status-icon--light-undefined .c4p--status-icon--light.c4p--status-icon--light-in-progress {
7001
7016
  animation: none;
7002
7017
  }
7003
7018
  }
7004
7019
 
7020
+ .bx--btn.bx--btn--icon-only.bx--tooltip__trigger .c4p--status-icon--light.c4p--status-icon--dark-undefined,
7005
7021
  .c4p--status-icon--light.c4p--status-icon--dark-undefined {
7006
7022
  fill: #8a3ffc;
7007
7023
  }
7008
7024
  @media (prefers-reduced-motion) {
7009
- .c4p--status-icon--light.c4p--status-icon--dark-undefined .c4p--status-icon--light.c4p--status-icon--dark-in-progress {
7025
+ .bx--btn.bx--btn--icon-only.bx--tooltip__trigger .c4p--status-icon--light.c4p--status-icon--dark-undefined .c4p--status-icon--light.c4p--status-icon--dark-in-progress,
7026
+ .c4p--status-icon--light.c4p--status-icon--dark-undefined .c4p--status-icon--light.c4p--status-icon--dark-in-progress {
7010
7027
  animation: none;
7011
7028
  }
7012
7029
  }
7013
7030
 
7031
+ .bx--btn.bx--btn--icon-only.bx--tooltip__trigger .c4p--status-icon--light.c4p--status-icon--light-unknown,
7014
7032
  .c4p--status-icon--light.c4p--status-icon--light-unknown {
7015
7033
  fill: #6f6f6f;
7016
7034
  }
7017
7035
  @media (prefers-reduced-motion) {
7018
- .c4p--status-icon--light.c4p--status-icon--light-unknown .c4p--status-icon--light.c4p--status-icon--light-in-progress {
7036
+ .bx--btn.bx--btn--icon-only.bx--tooltip__trigger .c4p--status-icon--light.c4p--status-icon--light-unknown .c4p--status-icon--light.c4p--status-icon--light-in-progress,
7037
+ .c4p--status-icon--light.c4p--status-icon--light-unknown .c4p--status-icon--light.c4p--status-icon--light-in-progress {
7019
7038
  animation: none;
7020
7039
  }
7021
7040
  }
7022
7041
 
7042
+ .bx--btn.bx--btn--icon-only.bx--tooltip__trigger .c4p--status-icon--light.c4p--status-icon--dark-unknown,
7023
7043
  .c4p--status-icon--light.c4p--status-icon--dark-unknown {
7024
7044
  fill: #6f6f6f;
7025
7045
  }
7026
7046
  @media (prefers-reduced-motion) {
7027
- .c4p--status-icon--light.c4p--status-icon--dark-unknown .c4p--status-icon--light.c4p--status-icon--dark-in-progress {
7047
+ .bx--btn.bx--btn--icon-only.bx--tooltip__trigger .c4p--status-icon--light.c4p--status-icon--dark-unknown .c4p--status-icon--light.c4p--status-icon--dark-in-progress,
7048
+ .c4p--status-icon--light.c4p--status-icon--dark-unknown .c4p--status-icon--light.c4p--status-icon--dark-in-progress {
7028
7049
  animation: none;
7029
7050
  }
7030
7051
  }
7031
7052
 
7053
+ .bx--btn.bx--btn--icon-only.bx--tooltip__trigger .c4p--status-icon--light.c4p--status-icon--light-normal,
7032
7054
  .c4p--status-icon--light.c4p--status-icon--light-normal {
7033
7055
  fill: #198038;
7034
7056
  }
7035
7057
  @media (prefers-reduced-motion) {
7036
- .c4p--status-icon--light.c4p--status-icon--light-normal .c4p--status-icon--light.c4p--status-icon--light-in-progress {
7058
+ .bx--btn.bx--btn--icon-only.bx--tooltip__trigger .c4p--status-icon--light.c4p--status-icon--light-normal .c4p--status-icon--light.c4p--status-icon--light-in-progress,
7059
+ .c4p--status-icon--light.c4p--status-icon--light-normal .c4p--status-icon--light.c4p--status-icon--light-in-progress {
7037
7060
  animation: none;
7038
7061
  }
7039
7062
  }
7040
7063
 
7064
+ .bx--btn.bx--btn--icon-only.bx--tooltip__trigger .c4p--status-icon--light.c4p--status-icon--dark-normal,
7041
7065
  .c4p--status-icon--light.c4p--status-icon--dark-normal {
7042
7066
  fill: #198038;
7043
7067
  }
7044
7068
  @media (prefers-reduced-motion) {
7045
- .c4p--status-icon--light.c4p--status-icon--dark-normal .c4p--status-icon--light.c4p--status-icon--dark-in-progress {
7069
+ .bx--btn.bx--btn--icon-only.bx--tooltip__trigger .c4p--status-icon--light.c4p--status-icon--dark-normal .c4p--status-icon--light.c4p--status-icon--dark-in-progress,
7070
+ .c4p--status-icon--light.c4p--status-icon--dark-normal .c4p--status-icon--light.c4p--status-icon--dark-in-progress {
7046
7071
  animation: none;
7047
7072
  }
7048
7073
  }
7049
7074
 
7075
+ .bx--btn.bx--btn--icon-only.bx--tooltip__trigger .c4p--status-icon--light.c4p--status-icon--light-info,
7050
7076
  .c4p--status-icon--light.c4p--status-icon--light-info {
7051
7077
  fill: #0f62fe;
7052
7078
  }
7053
7079
  @media (prefers-reduced-motion) {
7054
- .c4p--status-icon--light.c4p--status-icon--light-info .c4p--status-icon--light.c4p--status-icon--light-in-progress {
7080
+ .bx--btn.bx--btn--icon-only.bx--tooltip__trigger .c4p--status-icon--light.c4p--status-icon--light-info .c4p--status-icon--light.c4p--status-icon--light-in-progress,
7081
+ .c4p--status-icon--light.c4p--status-icon--light-info .c4p--status-icon--light.c4p--status-icon--light-in-progress {
7055
7082
  animation: none;
7056
7083
  }
7057
7084
  }
7058
7085
 
7086
+ .bx--btn.bx--btn--icon-only.bx--tooltip__trigger .c4p--status-icon--light.c4p--status-icon--dark-info,
7059
7087
  .c4p--status-icon--light.c4p--status-icon--dark-info {
7060
7088
  fill: #0f62fe;
7061
7089
  }
7062
7090
  @media (prefers-reduced-motion) {
7063
- .c4p--status-icon--light.c4p--status-icon--dark-info .c4p--status-icon--light.c4p--status-icon--dark-in-progress {
7091
+ .bx--btn.bx--btn--icon-only.bx--tooltip__trigger .c4p--status-icon--light.c4p--status-icon--dark-info .c4p--status-icon--light.c4p--status-icon--dark-in-progress,
7092
+ .c4p--status-icon--light.c4p--status-icon--dark-info .c4p--status-icon--light.c4p--status-icon--dark-in-progress {
7064
7093
  animation: none;
7065
7094
  }
7066
7095
  }
7067
7096
 
7097
+ .bx--btn.bx--btn--icon-only.bx--tooltip__trigger .c4p--status-icon--light.c4p--status-icon--light-in-progress,
7068
7098
  .c4p--status-icon--light.c4p--status-icon--light-in-progress {
7069
7099
  animation: rotating 8000ms infinite linear;
7070
7100
  fill: #0f62fe;
7071
7101
  }
7072
7102
  @media (prefers-reduced-motion: reduce) {
7073
- .c4p--status-icon--light.c4p--status-icon--light-in-progress {
7103
+ .bx--btn.bx--btn--icon-only.bx--tooltip__trigger .c4p--status-icon--light.c4p--status-icon--light-in-progress,
7104
+ .c4p--status-icon--light.c4p--status-icon--light-in-progress {
7074
7105
  animation: none;
7075
7106
  }
7076
7107
  }
7077
7108
 
7109
+ .bx--btn.bx--btn--icon-only.bx--tooltip__trigger .c4p--status-icon--light.c4p--status-icon--dark-in-progress,
7078
7110
  .c4p--status-icon--light.c4p--status-icon--dark-in-progress {
7079
7111
  animation: rotating 8000ms infinite linear;
7080
7112
  fill: #0f62fe;
7081
7113
  }
7082
7114
  @media (prefers-reduced-motion: reduce) {
7083
- .c4p--status-icon--light.c4p--status-icon--dark-in-progress {
7115
+ .bx--btn.bx--btn--icon-only.bx--tooltip__trigger .c4p--status-icon--light.c4p--status-icon--dark-in-progress,
7116
+ .c4p--status-icon--light.c4p--status-icon--dark-in-progress {
7084
7117
  animation: none;
7085
7118
  }
7086
7119
  }
7087
7120
 
7121
+ .bx--btn.bx--btn--icon-only.bx--tooltip__trigger .c4p--status-icon--light.c4p--status-icon--light-running,
7088
7122
  .c4p--status-icon--light.c4p--status-icon--light-running {
7089
7123
  fill: #198038;
7090
7124
  transform: scaleY(-1);
7091
7125
  }
7092
7126
 
7127
+ .bx--btn.bx--btn--icon-only.bx--tooltip__trigger .c4p--status-icon--light.c4p--status-icon--dark-running,
7093
7128
  .c4p--status-icon--light.c4p--status-icon--dark-running {
7094
7129
  fill: #198038;
7095
7130
  transform: scaleY(-1);
7096
7131
  }
7097
7132
 
7133
+ .bx--btn.bx--btn--icon-only.bx--tooltip__trigger .c4p--status-icon--light.c4p--status-icon--light-pending,
7098
7134
  .c4p--status-icon--light.c4p--status-icon--light-pending {
7099
7135
  fill: #6f6f6f;
7100
7136
  }
7101
7137
  @media (prefers-reduced-motion) {
7102
- .c4p--status-icon--light.c4p--status-icon--light-pending .c4p--status-icon--light.c4p--status-icon--light-in-progress {
7138
+ .bx--btn.bx--btn--icon-only.bx--tooltip__trigger .c4p--status-icon--light.c4p--status-icon--light-pending .c4p--status-icon--light.c4p--status-icon--light-in-progress,
7139
+ .c4p--status-icon--light.c4p--status-icon--light-pending .c4p--status-icon--light.c4p--status-icon--light-in-progress {
7103
7140
  animation: none;
7104
7141
  }
7105
7142
  }
7106
7143
 
7144
+ .bx--btn.bx--btn--icon-only.bx--tooltip__trigger .c4p--status-icon--light.c4p--status-icon--dark-pending,
7107
7145
  .c4p--status-icon--light.c4p--status-icon--dark-pending {
7108
7146
  fill: #6f6f6f;
7109
7147
  }
7110
7148
  @media (prefers-reduced-motion) {
7111
- .c4p--status-icon--light.c4p--status-icon--dark-pending .c4p--status-icon--light.c4p--status-icon--dark-in-progress {
7149
+ .bx--btn.bx--btn--icon-only.bx--tooltip__trigger .c4p--status-icon--light.c4p--status-icon--dark-pending .c4p--status-icon--light.c4p--status-icon--dark-in-progress,
7150
+ .c4p--status-icon--light.c4p--status-icon--dark-pending .c4p--status-icon--light.c4p--status-icon--dark-in-progress {
7112
7151
  animation: none;
7113
7152
  }
7114
7153
  }
7115
7154
 
7155
+ .bx--btn.bx--btn--icon-only.bx--tooltip__trigger .c4p--status-icon--dark.c4p--status-icon--light-fatal,
7116
7156
  .c4p--status-icon--dark.c4p--status-icon--light-fatal {
7117
7157
  fill: #8d8d8d;
7118
7158
  }
7119
7159
  @media (prefers-reduced-motion) {
7120
- .c4p--status-icon--dark.c4p--status-icon--light-fatal .c4p--status-icon--dark.c4p--status-icon--light-in-progress {
7160
+ .bx--btn.bx--btn--icon-only.bx--tooltip__trigger .c4p--status-icon--dark.c4p--status-icon--light-fatal .c4p--status-icon--dark.c4p--status-icon--light-in-progress,
7161
+ .c4p--status-icon--dark.c4p--status-icon--light-fatal .c4p--status-icon--dark.c4p--status-icon--light-in-progress {
7121
7162
  animation: none;
7122
7163
  }
7123
7164
  }
7124
7165
 
7166
+ .bx--btn.bx--btn--icon-only.bx--tooltip__trigger .c4p--status-icon--dark.c4p--status-icon--dark-fatal,
7125
7167
  .c4p--status-icon--dark.c4p--status-icon--dark-fatal {
7126
7168
  fill: #8d8d8d;
7127
7169
  }
7128
7170
  @media (prefers-reduced-motion) {
7129
- .c4p--status-icon--dark.c4p--status-icon--dark-fatal .c4p--status-icon--dark.c4p--status-icon--dark-in-progress {
7171
+ .bx--btn.bx--btn--icon-only.bx--tooltip__trigger .c4p--status-icon--dark.c4p--status-icon--dark-fatal .c4p--status-icon--dark.c4p--status-icon--dark-in-progress,
7172
+ .c4p--status-icon--dark.c4p--status-icon--dark-fatal .c4p--status-icon--dark.c4p--status-icon--dark-in-progress {
7130
7173
  animation: none;
7131
7174
  }
7132
7175
  }
7133
7176
 
7177
+ .bx--btn.bx--btn--icon-only.bx--tooltip__trigger .c4p--status-icon--dark.c4p--status-icon--light-critical,
7134
7178
  .c4p--status-icon--dark.c4p--status-icon--light-critical {
7135
7179
  fill: #fa4d56;
7136
7180
  }
7137
7181
  @media (prefers-reduced-motion) {
7138
- .c4p--status-icon--dark.c4p--status-icon--light-critical .c4p--status-icon--dark.c4p--status-icon--light-in-progress {
7182
+ .bx--btn.bx--btn--icon-only.bx--tooltip__trigger .c4p--status-icon--dark.c4p--status-icon--light-critical .c4p--status-icon--dark.c4p--status-icon--light-in-progress,
7183
+ .c4p--status-icon--dark.c4p--status-icon--light-critical .c4p--status-icon--dark.c4p--status-icon--light-in-progress {
7139
7184
  animation: none;
7140
7185
  }
7141
7186
  }
7142
7187
 
7188
+ .bx--btn.bx--btn--icon-only.bx--tooltip__trigger .c4p--status-icon--dark.c4p--status-icon--dark-critical,
7143
7189
  .c4p--status-icon--dark.c4p--status-icon--dark-critical {
7144
7190
  fill: #fa4d56;
7145
7191
  }
7146
7192
  @media (prefers-reduced-motion) {
7147
- .c4p--status-icon--dark.c4p--status-icon--dark-critical .c4p--status-icon--dark.c4p--status-icon--dark-in-progress {
7193
+ .bx--btn.bx--btn--icon-only.bx--tooltip__trigger .c4p--status-icon--dark.c4p--status-icon--dark-critical .c4p--status-icon--dark.c4p--status-icon--dark-in-progress,
7194
+ .c4p--status-icon--dark.c4p--status-icon--dark-critical .c4p--status-icon--dark.c4p--status-icon--dark-in-progress {
7148
7195
  animation: none;
7149
7196
  }
7150
7197
  }
7151
7198
 
7199
+ .bx--btn.bx--btn--icon-only.bx--tooltip__trigger .c4p--status-icon--dark.c4p--status-icon--light-major-warning,
7152
7200
  .c4p--status-icon--dark.c4p--status-icon--light-major-warning {
7153
7201
  fill: #ff832b;
7154
7202
  }
7155
7203
  @media (prefers-reduced-motion) {
7156
- .c4p--status-icon--dark.c4p--status-icon--light-major-warning .c4p--status-icon--dark.c4p--status-icon--light-in-progress {
7204
+ .bx--btn.bx--btn--icon-only.bx--tooltip__trigger .c4p--status-icon--dark.c4p--status-icon--light-major-warning .c4p--status-icon--dark.c4p--status-icon--light-in-progress,
7205
+ .c4p--status-icon--dark.c4p--status-icon--light-major-warning .c4p--status-icon--dark.c4p--status-icon--light-in-progress {
7157
7206
  animation: none;
7158
7207
  }
7159
7208
  }
7160
7209
 
7210
+ .bx--btn.bx--btn--icon-only.bx--tooltip__trigger .c4p--status-icon--dark.c4p--status-icon--dark-major-warning,
7161
7211
  .c4p--status-icon--dark.c4p--status-icon--dark-major-warning {
7162
7212
  fill: #ff832b;
7163
7213
  }
7164
7214
  @media (prefers-reduced-motion) {
7165
- .c4p--status-icon--dark.c4p--status-icon--dark-major-warning .c4p--status-icon--dark.c4p--status-icon--dark-in-progress {
7215
+ .bx--btn.bx--btn--icon-only.bx--tooltip__trigger .c4p--status-icon--dark.c4p--status-icon--dark-major-warning .c4p--status-icon--dark.c4p--status-icon--dark-in-progress,
7216
+ .c4p--status-icon--dark.c4p--status-icon--dark-major-warning .c4p--status-icon--dark.c4p--status-icon--dark-in-progress {
7166
7217
  animation: none;
7167
7218
  }
7168
7219
  }
7169
7220
 
7221
+ .bx--btn.bx--btn--icon-only.bx--tooltip__trigger .c4p--status-icon--dark.c4p--status-icon--light-minor-warning,
7170
7222
  .c4p--status-icon--dark.c4p--status-icon--light-minor-warning {
7171
7223
  fill: #fddc69;
7172
7224
  }
7173
7225
  @media (prefers-reduced-motion) {
7174
- .c4p--status-icon--dark.c4p--status-icon--light-minor-warning .c4p--status-icon--dark.c4p--status-icon--light-in-progress {
7226
+ .bx--btn.bx--btn--icon-only.bx--tooltip__trigger .c4p--status-icon--dark.c4p--status-icon--light-minor-warning .c4p--status-icon--dark.c4p--status-icon--light-in-progress,
7227
+ .c4p--status-icon--dark.c4p--status-icon--light-minor-warning .c4p--status-icon--dark.c4p--status-icon--light-in-progress {
7175
7228
  animation: none;
7176
7229
  }
7177
7230
  }
7178
7231
 
7232
+ .bx--btn.bx--btn--icon-only.bx--tooltip__trigger .c4p--status-icon--dark.c4p--status-icon--dark-minor-warning,
7179
7233
  .c4p--status-icon--dark.c4p--status-icon--dark-minor-warning {
7180
7234
  fill: #fddc69;
7181
7235
  }
7182
7236
  @media (prefers-reduced-motion) {
7183
- .c4p--status-icon--dark.c4p--status-icon--dark-minor-warning .c4p--status-icon--dark.c4p--status-icon--dark-in-progress {
7237
+ .bx--btn.bx--btn--icon-only.bx--tooltip__trigger .c4p--status-icon--dark.c4p--status-icon--dark-minor-warning .c4p--status-icon--dark.c4p--status-icon--dark-in-progress,
7238
+ .c4p--status-icon--dark.c4p--status-icon--dark-minor-warning .c4p--status-icon--dark.c4p--status-icon--dark-in-progress {
7184
7239
  animation: none;
7185
7240
  }
7186
7241
  }
7187
7242
 
7243
+ .bx--btn.bx--btn--icon-only.bx--tooltip__trigger .c4p--status-icon--dark.c4p--status-icon--light-undefined,
7188
7244
  .c4p--status-icon--dark.c4p--status-icon--light-undefined {
7189
7245
  fill: #a56eff;
7190
7246
  }
7191
7247
  @media (prefers-reduced-motion) {
7192
- .c4p--status-icon--dark.c4p--status-icon--light-undefined .c4p--status-icon--dark.c4p--status-icon--light-in-progress {
7248
+ .bx--btn.bx--btn--icon-only.bx--tooltip__trigger .c4p--status-icon--dark.c4p--status-icon--light-undefined .c4p--status-icon--dark.c4p--status-icon--light-in-progress,
7249
+ .c4p--status-icon--dark.c4p--status-icon--light-undefined .c4p--status-icon--dark.c4p--status-icon--light-in-progress {
7193
7250
  animation: none;
7194
7251
  }
7195
7252
  }
7196
7253
 
7254
+ .bx--btn.bx--btn--icon-only.bx--tooltip__trigger .c4p--status-icon--dark.c4p--status-icon--dark-undefined,
7197
7255
  .c4p--status-icon--dark.c4p--status-icon--dark-undefined {
7198
7256
  fill: #a56eff;
7199
7257
  }
7200
7258
  @media (prefers-reduced-motion) {
7201
- .c4p--status-icon--dark.c4p--status-icon--dark-undefined .c4p--status-icon--dark.c4p--status-icon--dark-in-progress {
7259
+ .bx--btn.bx--btn--icon-only.bx--tooltip__trigger .c4p--status-icon--dark.c4p--status-icon--dark-undefined .c4p--status-icon--dark.c4p--status-icon--dark-in-progress,
7260
+ .c4p--status-icon--dark.c4p--status-icon--dark-undefined .c4p--status-icon--dark.c4p--status-icon--dark-in-progress {
7202
7261
  animation: none;
7203
7262
  }
7204
7263
  }
7205
7264
 
7265
+ .bx--btn.bx--btn--icon-only.bx--tooltip__trigger .c4p--status-icon--dark.c4p--status-icon--light-unknown,
7206
7266
  .c4p--status-icon--dark.c4p--status-icon--light-unknown {
7207
7267
  fill: #8d8d8d;
7208
7268
  }
7209
7269
  @media (prefers-reduced-motion) {
7210
- .c4p--status-icon--dark.c4p--status-icon--light-unknown .c4p--status-icon--dark.c4p--status-icon--light-in-progress {
7270
+ .bx--btn.bx--btn--icon-only.bx--tooltip__trigger .c4p--status-icon--dark.c4p--status-icon--light-unknown .c4p--status-icon--dark.c4p--status-icon--light-in-progress,
7271
+ .c4p--status-icon--dark.c4p--status-icon--light-unknown .c4p--status-icon--dark.c4p--status-icon--light-in-progress {
7211
7272
  animation: none;
7212
7273
  }
7213
7274
  }
7214
7275
 
7276
+ .bx--btn.bx--btn--icon-only.bx--tooltip__trigger .c4p--status-icon--dark.c4p--status-icon--dark-unknown,
7215
7277
  .c4p--status-icon--dark.c4p--status-icon--dark-unknown {
7216
7278
  fill: #8d8d8d;
7217
7279
  }
7218
7280
  @media (prefers-reduced-motion) {
7219
- .c4p--status-icon--dark.c4p--status-icon--dark-unknown .c4p--status-icon--dark.c4p--status-icon--dark-in-progress {
7281
+ .bx--btn.bx--btn--icon-only.bx--tooltip__trigger .c4p--status-icon--dark.c4p--status-icon--dark-unknown .c4p--status-icon--dark.c4p--status-icon--dark-in-progress,
7282
+ .c4p--status-icon--dark.c4p--status-icon--dark-unknown .c4p--status-icon--dark.c4p--status-icon--dark-in-progress {
7220
7283
  animation: none;
7221
7284
  }
7222
7285
  }
7223
7286
 
7287
+ .bx--btn.bx--btn--icon-only.bx--tooltip__trigger .c4p--status-icon--dark.c4p--status-icon--light-normal,
7224
7288
  .c4p--status-icon--dark.c4p--status-icon--light-normal {
7225
7289
  fill: #24a148;
7226
7290
  }
7227
7291
  @media (prefers-reduced-motion) {
7228
- .c4p--status-icon--dark.c4p--status-icon--light-normal .c4p--status-icon--dark.c4p--status-icon--light-in-progress {
7292
+ .bx--btn.bx--btn--icon-only.bx--tooltip__trigger .c4p--status-icon--dark.c4p--status-icon--light-normal .c4p--status-icon--dark.c4p--status-icon--light-in-progress,
7293
+ .c4p--status-icon--dark.c4p--status-icon--light-normal .c4p--status-icon--dark.c4p--status-icon--light-in-progress {
7229
7294
  animation: none;
7230
7295
  }
7231
7296
  }
7232
7297
 
7298
+ .bx--btn.bx--btn--icon-only.bx--tooltip__trigger .c4p--status-icon--dark.c4p--status-icon--dark-normal,
7233
7299
  .c4p--status-icon--dark.c4p--status-icon--dark-normal {
7234
7300
  fill: #24a148;
7235
7301
  }
7236
7302
  @media (prefers-reduced-motion) {
7237
- .c4p--status-icon--dark.c4p--status-icon--dark-normal .c4p--status-icon--dark.c4p--status-icon--dark-in-progress {
7303
+ .bx--btn.bx--btn--icon-only.bx--tooltip__trigger .c4p--status-icon--dark.c4p--status-icon--dark-normal .c4p--status-icon--dark.c4p--status-icon--dark-in-progress,
7304
+ .c4p--status-icon--dark.c4p--status-icon--dark-normal .c4p--status-icon--dark.c4p--status-icon--dark-in-progress {
7238
7305
  animation: none;
7239
7306
  }
7240
7307
  }
7241
7308
 
7309
+ .bx--btn.bx--btn--icon-only.bx--tooltip__trigger .c4p--status-icon--dark.c4p--status-icon--light-info,
7242
7310
  .c4p--status-icon--dark.c4p--status-icon--light-info {
7243
7311
  fill: #4589ff;
7244
7312
  }
7245
7313
  @media (prefers-reduced-motion) {
7246
- .c4p--status-icon--dark.c4p--status-icon--light-info .c4p--status-icon--dark.c4p--status-icon--light-in-progress {
7314
+ .bx--btn.bx--btn--icon-only.bx--tooltip__trigger .c4p--status-icon--dark.c4p--status-icon--light-info .c4p--status-icon--dark.c4p--status-icon--light-in-progress,
7315
+ .c4p--status-icon--dark.c4p--status-icon--light-info .c4p--status-icon--dark.c4p--status-icon--light-in-progress {
7247
7316
  animation: none;
7248
7317
  }
7249
7318
  }
7250
7319
 
7320
+ .bx--btn.bx--btn--icon-only.bx--tooltip__trigger .c4p--status-icon--dark.c4p--status-icon--dark-info,
7251
7321
  .c4p--status-icon--dark.c4p--status-icon--dark-info {
7252
7322
  fill: #4589ff;
7253
7323
  }
7254
7324
  @media (prefers-reduced-motion) {
7255
- .c4p--status-icon--dark.c4p--status-icon--dark-info .c4p--status-icon--dark.c4p--status-icon--dark-in-progress {
7325
+ .bx--btn.bx--btn--icon-only.bx--tooltip__trigger .c4p--status-icon--dark.c4p--status-icon--dark-info .c4p--status-icon--dark.c4p--status-icon--dark-in-progress,
7326
+ .c4p--status-icon--dark.c4p--status-icon--dark-info .c4p--status-icon--dark.c4p--status-icon--dark-in-progress {
7256
7327
  animation: none;
7257
7328
  }
7258
7329
  }
7259
7330
 
7331
+ .bx--btn.bx--btn--icon-only.bx--tooltip__trigger .c4p--status-icon--dark.c4p--status-icon--light-in-progress,
7260
7332
  .c4p--status-icon--dark.c4p--status-icon--light-in-progress {
7261
7333
  animation: rotating 8000ms infinite linear;
7262
7334
  fill: #4589ff;
7263
7335
  }
7264
7336
  @media (prefers-reduced-motion: reduce) {
7265
- .c4p--status-icon--dark.c4p--status-icon--light-in-progress {
7337
+ .bx--btn.bx--btn--icon-only.bx--tooltip__trigger .c4p--status-icon--dark.c4p--status-icon--light-in-progress,
7338
+ .c4p--status-icon--dark.c4p--status-icon--light-in-progress {
7266
7339
  animation: none;
7267
7340
  }
7268
7341
  }
7269
7342
 
7343
+ .bx--btn.bx--btn--icon-only.bx--tooltip__trigger .c4p--status-icon--dark.c4p--status-icon--dark-in-progress,
7270
7344
  .c4p--status-icon--dark.c4p--status-icon--dark-in-progress {
7271
7345
  animation: rotating 8000ms infinite linear;
7272
7346
  fill: #4589ff;
7273
7347
  }
7274
7348
  @media (prefers-reduced-motion: reduce) {
7275
- .c4p--status-icon--dark.c4p--status-icon--dark-in-progress {
7349
+ .bx--btn.bx--btn--icon-only.bx--tooltip__trigger .c4p--status-icon--dark.c4p--status-icon--dark-in-progress,
7350
+ .c4p--status-icon--dark.c4p--status-icon--dark-in-progress {
7276
7351
  animation: none;
7277
7352
  }
7278
7353
  }
7279
7354
 
7355
+ .bx--btn.bx--btn--icon-only.bx--tooltip__trigger .c4p--status-icon--dark.c4p--status-icon--light-running,
7280
7356
  .c4p--status-icon--dark.c4p--status-icon--light-running {
7281
7357
  fill: #24a148;
7282
7358
  transform: scaleY(-1);
7283
7359
  }
7284
7360
 
7361
+ .bx--btn.bx--btn--icon-only.bx--tooltip__trigger .c4p--status-icon--dark.c4p--status-icon--dark-running,
7285
7362
  .c4p--status-icon--dark.c4p--status-icon--dark-running {
7286
7363
  fill: #24a148;
7287
7364
  transform: scaleY(-1);
7288
7365
  }
7289
7366
 
7367
+ .bx--btn.bx--btn--icon-only.bx--tooltip__trigger .c4p--status-icon--dark.c4p--status-icon--light-pending,
7290
7368
  .c4p--status-icon--dark.c4p--status-icon--light-pending {
7291
7369
  fill: #8d8d8d;
7292
7370
  }
7293
7371
  @media (prefers-reduced-motion) {
7294
- .c4p--status-icon--dark.c4p--status-icon--light-pending .c4p--status-icon--dark.c4p--status-icon--light-in-progress {
7372
+ .bx--btn.bx--btn--icon-only.bx--tooltip__trigger .c4p--status-icon--dark.c4p--status-icon--light-pending .c4p--status-icon--dark.c4p--status-icon--light-in-progress,
7373
+ .c4p--status-icon--dark.c4p--status-icon--light-pending .c4p--status-icon--dark.c4p--status-icon--light-in-progress {
7295
7374
  animation: none;
7296
7375
  }
7297
7376
  }
7298
7377
 
7378
+ .bx--btn.bx--btn--icon-only.bx--tooltip__trigger .c4p--status-icon--dark.c4p--status-icon--dark-pending,
7299
7379
  .c4p--status-icon--dark.c4p--status-icon--dark-pending {
7300
7380
  fill: #8d8d8d;
7301
7381
  }
7302
7382
  @media (prefers-reduced-motion) {
7303
- .c4p--status-icon--dark.c4p--status-icon--dark-pending .c4p--status-icon--dark.c4p--status-icon--dark-in-progress {
7383
+ .bx--btn.bx--btn--icon-only.bx--tooltip__trigger .c4p--status-icon--dark.c4p--status-icon--dark-pending .c4p--status-icon--dark.c4p--status-icon--dark-in-progress,
7384
+ .c4p--status-icon--dark.c4p--status-icon--dark-pending .c4p--status-icon--dark.c4p--status-icon--dark-in-progress {
7304
7385
  animation: none;
7305
7386
  }
7306
7387
  }