@carbon/ibm-products 1.61.0 → 1.62.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/css/index-full-carbon.css +154 -79
- package/css/index-full-carbon.css.map +1 -1
- package/css/index-full-carbon.min.css +3 -3
- package/css/index-full-carbon.min.css.map +1 -1
- package/css/index-without-carbon-released-only.css +1753 -0
- package/css/index-without-carbon-released-only.css.map +1 -1
- package/css/index-without-carbon-released-only.min.css +3 -1
- package/css/index-without-carbon-released-only.min.css.map +1 -1
- package/css/index-without-carbon.css +154 -79
- package/css/index-without-carbon.css.map +1 -1
- package/css/index-without-carbon.min.css +3 -3
- package/css/index-without-carbon.min.css.map +1 -1
- package/css/index.css +154 -79
- package/css/index.css.map +1 -1
- package/css/index.min.css +3 -3
- package/css/index.min.css.map +1 -1
- package/es/components/Coachmark/Coachmark.js +17 -5
- package/es/components/Coachmark/CoachmarkDragbar.js +12 -5
- package/es/components/Coachmark/CoachmarkHeader.js +2 -1
- package/es/components/Coachmark/CoachmarkOverlay.js +105 -9
- package/es/components/CoachmarkBeacon/CoachmarkBeacon.js +5 -2
- package/es/components/CoachmarkFixed/CoachmarkFixed.js +26 -6
- package/es/components/CoachmarkOverlayElements/CoachmarkOverlayElements.js +28 -3
- package/es/components/CoachmarkStack/CoachmarkStack.js +19 -4
- package/es/components/CoachmarkStack/CoachmarkStackHome.js +45 -11
- package/es/components/Datagrid/Datagrid/DatagridContent.js +12 -9
- package/es/components/Datagrid/Datagrid/DatagridExpandedRow.js +4 -4
- package/es/components/Datagrid/Datagrid/DatagridHeaderRow.js +45 -73
- package/es/components/Datagrid/Datagrid/DatagridRefBody.js +4 -1
- package/es/components/Datagrid/Datagrid/DatagridRow.js +5 -2
- package/es/components/Datagrid/Datagrid/DatagridSelectAll.js +12 -11
- package/es/components/Datagrid/Datagrid/DatagridSimpleBody.js +4 -1
- package/es/components/Datagrid/Datagrid/DatagridToolbar.js +29 -23
- package/es/components/Datagrid/Datagrid/DatagridVirtualBody.js +18 -18
- package/es/components/Datagrid/Datagrid/addons/stateReducer.js +73 -24
- package/es/components/Datagrid/Datagrid.stories/StickyActionsColumnStory.js +1 -1
- package/es/components/Datagrid/useActionsColumn.js +9 -9
- package/es/components/Datagrid/useColumnCenterAlign.js +6 -6
- package/es/components/Datagrid/useColumnRightAlign.js +6 -6
- package/es/components/Datagrid/useDatagrid.js +13 -1
- package/es/components/Datagrid/useFlexResize.js +19 -9
- package/es/components/Datagrid/useInfiniteScroll.js +10 -9
- package/es/components/Datagrid/useNestedRowExpander.js +10 -1
- package/es/components/Datagrid/useOnRowClick.js +6 -7
- package/es/components/Datagrid/useParentDimensions.js +6 -6
- package/es/components/Datagrid/useResizeTable.js +7 -7
- package/es/components/Datagrid/useRowExpander.js +11 -1
- package/es/components/Datagrid/useSelectAllToggle.js +2 -2
- package/es/components/Datagrid/useSelectRows.js +31 -21
- package/es/components/Datagrid/useSkeletonRows.js +6 -6
- package/es/components/Datagrid/useSortableColumns.js +5 -6
- package/es/components/Datagrid/useStickyColumn.js +13 -6
- package/es/components/EmptyStates/ErrorEmptyState/ErrorEmptyState.js +1 -0
- package/es/components/EmptyStates/NoDataEmptyState/NoDataEmptyState.js +1 -0
- package/es/components/EmptyStates/NoTagsEmptyState/NoTagsEmptyState.js +1 -0
- package/es/components/EmptyStates/NotFoundEmptyState/NotFoundEmptyState.js +1 -0
- package/es/components/EmptyStates/NotificationsEmptyState/NotificationsEmptyState.js +1 -0
- package/es/components/EmptyStates/UnauthorizedEmptyState/UnauthorizedEmptyState.js +1 -0
- package/es/components/EmptyStates/assets/ErrorIllustration.js +6 -4
- package/es/components/EmptyStates/assets/NoDataIllustration.js +6 -4
- package/es/components/EmptyStates/assets/NoTagsIllustration.js +6 -4
- package/es/components/EmptyStates/assets/NotFoundIllustration.js +6 -4
- package/es/components/EmptyStates/assets/NotificationsIllustration.js +6 -4
- package/es/components/EmptyStates/assets/UnauthorizedIllustration.js +6 -4
- package/es/components/Guidebanner/Guidebanner.js +3 -3
- package/es/components/Guidebanner/GuidebannerElement.js +9 -3
- package/es/components/Guidebanner/GuidebannerElementButton.js +9 -4
- package/es/components/Guidebanner/GuidebannerElementLink.js +9 -3
- package/es/components/InlineTip/InlineTipButton.js +7 -0
- package/es/components/InlineTip/InlineTipLink.js +7 -0
- package/es/components/index.js +2 -2
- package/es/global/js/hooks/index.js +3 -2
- package/es/global/js/hooks/usePrefix.js +11 -0
- package/es/global/js/package-settings.js +6 -2
- package/lib/components/Coachmark/Coachmark.js +16 -4
- package/lib/components/Coachmark/CoachmarkDragbar.js +12 -5
- package/lib/components/Coachmark/CoachmarkHeader.js +2 -1
- package/lib/components/Coachmark/CoachmarkOverlay.js +105 -8
- package/lib/components/CoachmarkBeacon/CoachmarkBeacon.js +5 -2
- package/lib/components/CoachmarkFixed/CoachmarkFixed.js +25 -5
- package/lib/components/CoachmarkOverlayElements/CoachmarkOverlayElements.js +28 -3
- package/lib/components/CoachmarkStack/CoachmarkStack.js +18 -3
- package/lib/components/CoachmarkStack/CoachmarkStackHome.js +44 -10
- package/lib/components/Datagrid/Datagrid/DatagridContent.js +12 -9
- package/lib/components/Datagrid/Datagrid/DatagridExpandedRow.js +4 -4
- package/lib/components/Datagrid/Datagrid/DatagridHeaderRow.js +44 -80
- package/lib/components/Datagrid/Datagrid/DatagridRefBody.js +4 -1
- package/lib/components/Datagrid/Datagrid/DatagridRow.js +5 -2
- package/lib/components/Datagrid/Datagrid/DatagridSelectAll.js +6 -4
- package/lib/components/Datagrid/Datagrid/DatagridSimpleBody.js +4 -1
- package/lib/components/Datagrid/Datagrid/DatagridToolbar.js +29 -23
- package/lib/components/Datagrid/Datagrid/DatagridVirtualBody.js +12 -12
- package/lib/components/Datagrid/Datagrid/addons/stateReducer.js +75 -33
- package/lib/components/Datagrid/Datagrid.stories/StickyActionsColumnStory.js +1 -1
- package/lib/components/Datagrid/useActionsColumn.js +9 -12
- package/lib/components/Datagrid/useDatagrid.js +13 -1
- package/lib/components/Datagrid/useFlexResize.js +19 -9
- package/lib/components/Datagrid/useInfiniteScroll.js +9 -9
- package/lib/components/Datagrid/useNestedRowExpander.js +10 -9
- package/lib/components/Datagrid/useOnRowClick.js +6 -7
- package/lib/components/Datagrid/useParentDimensions.js +5 -6
- package/lib/components/Datagrid/useResizeTable.js +6 -7
- package/lib/components/Datagrid/useRowExpander.js +11 -9
- package/lib/components/Datagrid/useSelectAllToggle.js +2 -2
- package/lib/components/Datagrid/useSelectRows.js +31 -21
- package/lib/components/Datagrid/useSkeletonRows.js +6 -6
- package/lib/components/Datagrid/useSortableColumns.js +5 -6
- package/lib/components/Datagrid/useStickyColumn.js +8 -0
- package/lib/components/EmptyStates/ErrorEmptyState/ErrorEmptyState.js +1 -0
- package/lib/components/EmptyStates/NoDataEmptyState/NoDataEmptyState.js +1 -0
- package/lib/components/EmptyStates/NoTagsEmptyState/NoTagsEmptyState.js +1 -0
- package/lib/components/EmptyStates/NotFoundEmptyState/NotFoundEmptyState.js +1 -0
- package/lib/components/EmptyStates/NotificationsEmptyState/NotificationsEmptyState.js +1 -0
- package/lib/components/EmptyStates/UnauthorizedEmptyState/UnauthorizedEmptyState.js +1 -0
- package/lib/components/EmptyStates/assets/ErrorIllustration.js +6 -4
- package/lib/components/EmptyStates/assets/NoDataIllustration.js +6 -4
- package/lib/components/EmptyStates/assets/NoTagsIllustration.js +6 -4
- package/lib/components/EmptyStates/assets/NotFoundIllustration.js +6 -4
- package/lib/components/EmptyStates/assets/NotificationsIllustration.js +6 -4
- package/lib/components/EmptyStates/assets/UnauthorizedIllustration.js +6 -4
- package/lib/components/Guidebanner/Guidebanner.js +3 -3
- package/lib/components/Guidebanner/GuidebannerElement.js +8 -1
- package/lib/components/Guidebanner/GuidebannerElementButton.js +8 -1
- package/lib/components/Guidebanner/GuidebannerElementLink.js +8 -1
- package/lib/components/InlineTip/InlineTipButton.js +8 -1
- package/lib/components/InlineTip/InlineTipLink.js +8 -1
- package/lib/components/index.js +30 -0
- package/lib/global/js/hooks/index.js +8 -1
- package/lib/global/js/hooks/usePrefix.js +19 -0
- package/lib/global/js/package-settings.js +6 -2
- package/package.json +2 -2
- package/scss/components/Checklist/_checklist.scss +13 -25
- package/scss/components/Coachmark/styles/_coachmark-dragbar.scss +1 -45
- package/scss/components/Coachmark/styles/_coachmark-header.scss +0 -33
- package/scss/components/Coachmark/styles/_coachmark-overlay.scss +113 -5
- package/scss/components/Coachmark/styles/_coachmark-tagline.scss +18 -0
- package/scss/components/CoachmarkBeacon/_coachmark-beacon.scss +16 -13
- package/scss/components/CoachmarkOverlayElement/_coachmark-overlay-element.scss +2 -0
- package/scss/components/CoachmarkOverlayElements/_coachmark-overlay-elements.scss +1 -0
- package/scss/components/CoachmarkStack/_coachmark-stack.scss +3 -0
- package/scss/components/Datagrid/_storybook-styles.scss +15 -0
- package/scss/components/Datagrid/styles/_datagrid.scss +31 -5
- package/scss/components/Datagrid/styles/_useNestedRows.scss +1 -1
- package/scss/components/_index-released-only.scss +1 -0
|
@@ -6669,34 +6669,34 @@ button.c4p--add-select__global-filter-toggle--open {
|
|
|
6669
6669
|
align-items: center;
|
|
6670
6670
|
padding-top: 0;
|
|
6671
6671
|
}
|
|
6672
|
-
.c4p--datagrid__grid-container table.c4p--datagrid__vertical-align-center.c4p--datagrid__variable-row-height.bx--data-table--
|
|
6672
|
+
.c4p--datagrid__grid-container table.c4p--datagrid__vertical-align-center.c4p--datagrid__variable-row-height.bx--data-table--xs .c4p--datagrid__cell {
|
|
6673
6673
|
padding-top: var(--cds-spacing-01, 0.125rem);
|
|
6674
6674
|
padding-bottom: var(--cds-spacing-01, 0.125rem);
|
|
6675
6675
|
}
|
|
6676
|
-
.c4p--datagrid__grid-container table.c4p--datagrid__vertical-align-center.c4p--datagrid__variable-row-height.bx--data-table--
|
|
6676
|
+
.c4p--datagrid__grid-container table.c4p--datagrid__vertical-align-center.c4p--datagrid__variable-row-height.bx--data-table--sm .c4p--datagrid__cell, .c4p--datagrid__grid-container table.c4p--datagrid__vertical-align-center.c4p--datagrid__variable-row-height.bx--data-table--md .c4p--datagrid__cell {
|
|
6677
6677
|
/* stylelint-disable-next-line carbon/layout-token-use */
|
|
6678
6678
|
padding-top: 0.4375rem;
|
|
6679
6679
|
/* stylelint-disable-next-line carbon/layout-token-use */
|
|
6680
6680
|
padding-bottom: 0.375rem;
|
|
6681
6681
|
}
|
|
6682
|
-
.c4p--datagrid__grid-container table.c4p--datagrid__vertical-align-center.c4p--datagrid__variable-row-height.bx--data-table--
|
|
6682
|
+
.c4p--datagrid__grid-container table.c4p--datagrid__vertical-align-center.c4p--datagrid__variable-row-height.bx--data-table--lg .c4p--datagrid__cell, .c4p--datagrid__grid-container table.c4p--datagrid__vertical-align-center.c4p--datagrid__variable-row-height.bx--data-table--xl .c4p--datagrid__cell {
|
|
6683
6683
|
padding-top: var(--cds-spacing-05, 1rem);
|
|
6684
6684
|
padding-bottom: var(--cds-spacing-05, 1rem);
|
|
6685
6685
|
}
|
|
6686
|
-
.c4p--datagrid__grid-container table.c4p--datagrid__vertical-align-top.bx--data-table--
|
|
6686
|
+
.c4p--datagrid__grid-container table.c4p--datagrid__vertical-align-top.bx--data-table--lg .c4p--datagrid__cell, .c4p--datagrid__grid-container table.c4p--datagrid__vertical-align-top.bx--data-table--xl .c4p--datagrid__cell {
|
|
6687
6687
|
padding-top: var(--cds-spacing-05, 1rem);
|
|
6688
6688
|
}
|
|
6689
|
-
.c4p--datagrid__grid-container table.c4p--datagrid__vertical-align-top.bx--data-table--
|
|
6689
|
+
.c4p--datagrid__grid-container table.c4p--datagrid__vertical-align-top.bx--data-table--lg .bx--table-header-label, .c4p--datagrid__grid-container table.c4p--datagrid__vertical-align-top.bx--data-table--xl .bx--table-header-label {
|
|
6690
6690
|
padding-top: var(--cds-spacing-05, 1rem);
|
|
6691
6691
|
}
|
|
6692
|
-
.c4p--datagrid__grid-container table.c4p--datagrid__vertical-align-top.bx--data-table--
|
|
6692
|
+
.c4p--datagrid__grid-container table.c4p--datagrid__vertical-align-top.bx--data-table--lg .bx--table-column-checkbox, .c4p--datagrid__grid-container table.c4p--datagrid__vertical-align-top.bx--data-table--xl .bx--table-column-checkbox {
|
|
6693
6693
|
/* stylelint-disable-next-line carbon/layout-token-use */
|
|
6694
6694
|
padding-top: 0.8125rem;
|
|
6695
6695
|
}
|
|
6696
|
-
.c4p--datagrid__grid-container table.c4p--datagrid__vertical-align-top.c4p--datagrid__variable-row-height.bx--data-table--
|
|
6696
|
+
.c4p--datagrid__grid-container table.c4p--datagrid__vertical-align-top.c4p--datagrid__variable-row-height.bx--data-table--lg .c4p--datagrid__cell, .c4p--datagrid__grid-container table.c4p--datagrid__vertical-align-top.c4p--datagrid__variable-row-height.bx--data-table--xl .c4p--datagrid__cell {
|
|
6697
6697
|
padding-bottom: var(--cds-spacing-05, 1rem);
|
|
6698
6698
|
}
|
|
6699
|
-
.c4p--datagrid__grid-container table.c4p--datagrid__vertical-align-top.c4p--datagrid__variable-row-height.bx--data-table--
|
|
6699
|
+
.c4p--datagrid__grid-container table.c4p--datagrid__vertical-align-top.c4p--datagrid__variable-row-height.bx--data-table--lg .bx--table-header-label, .c4p--datagrid__grid-container table.c4p--datagrid__vertical-align-top.c4p--datagrid__variable-row-height.bx--data-table--xl .bx--table-header-label {
|
|
6700
6700
|
padding-bottom: var(--cds-spacing-05, 1rem);
|
|
6701
6701
|
}
|
|
6702
6702
|
.c4p--datagrid__grid-container table.c4p--datagrid__variable-row-height tr.c4p--datagrid__carbon-row {
|
|
@@ -6859,6 +6859,10 @@ button.c4p--add-select__global-filter-toggle--open {
|
|
|
6859
6859
|
background-color: var(--cds-hover-selected-ui, #cacaca);
|
|
6860
6860
|
}
|
|
6861
6861
|
|
|
6862
|
+
.c4p--datagrid__grid-container table.c4p--datagrid__table-simple.bx--data-table.c4p--datagrid__table-is-resizing {
|
|
6863
|
+
overflow-y: hidden;
|
|
6864
|
+
}
|
|
6865
|
+
|
|
6862
6866
|
.c4p--datagrid__resizableColumn.c4p--datagrid__isResizing .c4p--datagrid__resizer {
|
|
6863
6867
|
border-right: var(--cds-spacing-01, 0.125rem) solid var(--cds-hover-secondary, #4c4c4c);
|
|
6864
6868
|
}
|
|
@@ -6874,6 +6878,20 @@ button.c4p--add-select__global-filter-toggle--open {
|
|
|
6874
6878
|
background-color: var(--cds-hover-selected-ui, #cacaca);
|
|
6875
6879
|
}
|
|
6876
6880
|
|
|
6881
|
+
.c4p--datagrid__header-actions-column:hover {
|
|
6882
|
+
background-color: var(--cds-layer-accent, #e0e0e0);
|
|
6883
|
+
}
|
|
6884
|
+
|
|
6885
|
+
.c4p--datagrid .c4p--datagrid__carbon-row .c4p--datagrid__actions-column-cell-non-sticky .bx--overflow-menu {
|
|
6886
|
+
opacity: 0;
|
|
6887
|
+
}
|
|
6888
|
+
|
|
6889
|
+
.c4p--datagrid .c4p--datagrid__carbon-row:hover .c4p--datagrid__actions-column-cell-non-sticky .bx--overflow-menu,
|
|
6890
|
+
.c4p--datagrid .c4p--datagrid__carbon-row .c4p--datagrid__actions-column-cell-non-sticky .bx--overflow-menu:focus,
|
|
6891
|
+
.c4p--datagrid .c4p--datagrid__carbon-row .c4p--datagrid__actions-column-cell-non-sticky .bx--overflow-menu[aria-expanded=true] {
|
|
6892
|
+
opacity: 1;
|
|
6893
|
+
}
|
|
6894
|
+
|
|
6877
6895
|
.c4p--datagrid__head-hidden-select-all {
|
|
6878
6896
|
padding-right: var(--cds-spacing-09, 3rem);
|
|
6879
6897
|
}
|
|
@@ -7230,7 +7248,7 @@ button.c4p--add-select__global-filter-toggle--open {
|
|
|
7230
7248
|
position: relative;
|
|
7231
7249
|
}
|
|
7232
7250
|
|
|
7233
|
-
.c4p--datagrid tr.c4p--datagrid__carbon-nested-row + :not(tr.c4p--datagrid__carbon-nested-row)::
|
|
7251
|
+
.c4p--datagrid tr.c4p--datagrid__carbon-nested-row + :not(tr.c4p--datagrid__carbon-nested-row)::after {
|
|
7234
7252
|
position: absolute;
|
|
7235
7253
|
/* stylelint-disable-next-line carbon/layout-token-use */
|
|
7236
7254
|
top: -1px;
|
|
@@ -10547,64 +10565,16 @@ th.c4p--datagrid__select-all-toggle-on.button {
|
|
|
10547
10565
|
color: var(--cds-link-01, #0f62fe);
|
|
10548
10566
|
}
|
|
10549
10567
|
|
|
10550
|
-
/* stylelint-disable declaration-no-important */
|
|
10551
10568
|
.c4p--coachmark-dragbar {
|
|
10552
10569
|
display: flex;
|
|
10553
10570
|
}
|
|
10554
|
-
.c4p--coachmark-dragbar__handle {
|
|
10555
|
-
flex-grow: 1;
|
|
10556
|
-
padding: var(--cds-spacing-03, 0.5rem) 0 0 var(--cds-spacing-03, 0.5rem);
|
|
10557
|
-
border: 0;
|
|
10558
|
-
background-color: transparent;
|
|
10559
|
-
text-align: left;
|
|
10560
|
-
}
|
|
10561
|
-
.c4p--coachmark-dragbar__handle:hover {
|
|
10562
|
-
cursor: move;
|
|
10563
|
-
}
|
|
10564
|
-
.c4p--coachmark-dragbar--close-btn {
|
|
10565
|
-
width: var(--cds-spacing-07, 2rem);
|
|
10566
|
-
height: var(--cds-spacing-07, 2rem);
|
|
10567
|
-
margin-left: auto !important;
|
|
10568
|
-
}
|
|
10569
|
-
.c4p--coachmark-dragbar--close-btn svg > path {
|
|
10570
|
-
margin: 0;
|
|
10571
|
-
fill: var(--cds-inverse-01, #ffffff) !important;
|
|
10572
|
-
}
|
|
10573
|
-
.c4p--coachmark-dragbar--close-btn:hover {
|
|
10574
|
-
background-color: var(--cds-inverse-hover-ui, #4c4c4c) !important;
|
|
10575
|
-
}
|
|
10576
|
-
.c4p--coachmark-dragbar__light c4p--coachmark-dragbar--close-btn:active {
|
|
10577
|
-
background-color: var(--cds-active-secondary, #6f6f6f);
|
|
10578
|
-
}
|
|
10579
|
-
.c4p--coachmark-dragbar__dark c4p--coachmark-dragbar--close-btn:active {
|
|
10580
|
-
background-color: var(--cds-button-tertiary-active, #002d9c);
|
|
10581
|
-
}
|
|
10582
10571
|
.c4p--coachmark-dragbar svg {
|
|
10583
10572
|
color: var(--cds-inverse-01, #ffffff);
|
|
10584
10573
|
}
|
|
10585
10574
|
|
|
10586
|
-
/* stylelint-disable declaration-no-important */
|
|
10587
10575
|
.c4p--coachmark-header {
|
|
10588
10576
|
display: flex;
|
|
10589
10577
|
}
|
|
10590
|
-
.c4p--coachmark-header--close-btn {
|
|
10591
|
-
width: var(--cds-spacing-07, 2rem);
|
|
10592
|
-
height: var(--cds-spacing-07, 2rem);
|
|
10593
|
-
margin-left: auto !important;
|
|
10594
|
-
}
|
|
10595
|
-
.c4p--coachmark-header--close-btn svg > path {
|
|
10596
|
-
margin: 0;
|
|
10597
|
-
fill: var(--cds-inverse-01, #ffffff) !important;
|
|
10598
|
-
}
|
|
10599
|
-
.c4p--coachmark-header--close-btn:hover {
|
|
10600
|
-
background-color: var(--cds-inverse-hover-ui, #4c4c4c) !important;
|
|
10601
|
-
}
|
|
10602
|
-
.c4p--coachmark-header__light c4p--coachmark-header--close-btn:active {
|
|
10603
|
-
background-color: var(--cds-active-secondary, #6f6f6f);
|
|
10604
|
-
}
|
|
10605
|
-
.c4p--coachmark-header__dark c4p--coachmark-header--close-btn:active {
|
|
10606
|
-
background-color: var(--cds-button-tertiary-active, #002d9c);
|
|
10607
|
-
}
|
|
10608
10578
|
|
|
10609
10579
|
/* stylelint-disable carbon/layout-token-use */
|
|
10610
10580
|
/* stylelint-disable carbon/theme-token-use */
|
|
@@ -10616,7 +10586,7 @@ th.c4p--datagrid__select-all-toggle-on.button {
|
|
|
10616
10586
|
border-radius: var(--cds-spacing-01, 0.125rem);
|
|
10617
10587
|
background-color: var(--cds-inverse-02, #393939);
|
|
10618
10588
|
color: var(--cds-inverse-01, #ffffff);
|
|
10619
|
-
|
|
10589
|
+
visibility: hidden;
|
|
10620
10590
|
}
|
|
10621
10591
|
.c4p--coachmark-overlay--fixed {
|
|
10622
10592
|
position: fixed;
|
|
@@ -10631,8 +10601,14 @@ th.c4p--datagrid__select-all-toggle-on.button {
|
|
|
10631
10601
|
transition: none;
|
|
10632
10602
|
}
|
|
10633
10603
|
}
|
|
10604
|
+
.c4p--coachmark-overlay--is-dragmode {
|
|
10605
|
+
border-radius: 0;
|
|
10606
|
+
box-shadow: 0 0 0 var(--cds-spacing-02, 0.25rem) var(--cds-inverse-02, #393939);
|
|
10607
|
+
outline: var(--cds-spacing-01, 0.125rem) solid var(--cds-inverse-01, #ffffff);
|
|
10608
|
+
}
|
|
10634
10609
|
.c4p--coachmark-overlay--is-visible {
|
|
10635
10610
|
transform: translateY(0);
|
|
10611
|
+
visibility: visible;
|
|
10636
10612
|
}
|
|
10637
10613
|
.c4p--coachmark-overlay__caret {
|
|
10638
10614
|
position: absolute;
|
|
@@ -10737,9 +10713,6 @@ th.c4p--datagrid__select-all-toggle-on.button {
|
|
|
10737
10713
|
height: calc(var(--cds-spacing-07, 2rem) + var(--cds-spacing-12, 6rem));
|
|
10738
10714
|
margin-bottom: var(--cds-spacing-05, 1rem);
|
|
10739
10715
|
}
|
|
10740
|
-
.c4p--coachmark-overlay__body {
|
|
10741
|
-
padding: var(--cds-spacing-01, 0.125rem) var(--cds-spacing-05, 1rem) var(--cds-spacing-05, 1rem);
|
|
10742
|
-
}
|
|
10743
10716
|
.c4p--coachmark-overlay__body .bx--btn--ghost {
|
|
10744
10717
|
color: var(--cds-inverse-link, #78a9ff);
|
|
10745
10718
|
}
|
|
@@ -10764,6 +10737,45 @@ th.c4p--datagrid__select-all-toggle-on.button {
|
|
|
10764
10737
|
letter-spacing: var(--cds-productive-heading-02-letter-spacing, 0);
|
|
10765
10738
|
order: 1;
|
|
10766
10739
|
}
|
|
10740
|
+
.c4p--coachmark-overlay__handle {
|
|
10741
|
+
position: relative;
|
|
10742
|
+
flex-grow: 1;
|
|
10743
|
+
padding: var(--cds-spacing-02, 0.25rem) 0 0 var(--cds-spacing-03, 0.5rem);
|
|
10744
|
+
border: 0;
|
|
10745
|
+
background-color: transparent;
|
|
10746
|
+
text-align: left;
|
|
10747
|
+
}
|
|
10748
|
+
.c4p--coachmark-overlay__handle::before {
|
|
10749
|
+
position: absolute;
|
|
10750
|
+
top: var(--cds-spacing-01, 0.125rem);
|
|
10751
|
+
left: var(--cds-spacing-01, 0.125rem);
|
|
10752
|
+
width: calc(var(--cds-spacing-06, 1.5rem) + var(--cds-spacing-01, 0.125rem));
|
|
10753
|
+
height: calc(var(--cds-spacing-06, 1.5rem) + var(--cds-spacing-01, 0.125rem));
|
|
10754
|
+
content: "";
|
|
10755
|
+
}
|
|
10756
|
+
.c4p--coachmark-overlay__handle:hover {
|
|
10757
|
+
cursor: move;
|
|
10758
|
+
}
|
|
10759
|
+
.c4p--coachmark-overlay__handle:focus {
|
|
10760
|
+
border: none;
|
|
10761
|
+
outline: none;
|
|
10762
|
+
}
|
|
10763
|
+
.c4p--coachmark-overlay__handle:focus::before {
|
|
10764
|
+
border: 1px solid var(--cds-inverse-01, #ffffff);
|
|
10765
|
+
outline: 1px solid #0f62fe;
|
|
10766
|
+
}
|
|
10767
|
+
.c4p--coachmark-overlay--close-btn {
|
|
10768
|
+
width: var(--cds-spacing-07, 2rem);
|
|
10769
|
+
height: var(--cds-spacing-07, 2rem);
|
|
10770
|
+
margin-left: auto !important;
|
|
10771
|
+
}
|
|
10772
|
+
.c4p--coachmark-overlay--close-btn svg > path {
|
|
10773
|
+
margin: 0;
|
|
10774
|
+
fill: var(--cds-inverse-01, #ffffff) !important;
|
|
10775
|
+
}
|
|
10776
|
+
.c4p--coachmark-overlay--close-btn:hover {
|
|
10777
|
+
background-color: var(--cds-inverse-hover-ui, #4c4c4c) !important;
|
|
10778
|
+
}
|
|
10767
10779
|
.c4p--coachmark-overlay__footer {
|
|
10768
10780
|
display: flex;
|
|
10769
10781
|
align-items: center;
|
|
@@ -10781,12 +10793,35 @@ th.c4p--datagrid__select-all-toggle-on.button {
|
|
|
10781
10793
|
.c4p--coachmark-overlay__light .c4p--coachmark-overlay__body .bx--link:focus {
|
|
10782
10794
|
outline-color: var(--cds-text-04, #ffffff);
|
|
10783
10795
|
}
|
|
10796
|
+
.c4p--coachmark-overlay__light .c4p--coachmark-overlay__body .bx--btn--ghost {
|
|
10797
|
+
border-color: transparent !important;
|
|
10798
|
+
border-radius: 0;
|
|
10799
|
+
outline: 1px solid transparent;
|
|
10800
|
+
}
|
|
10784
10801
|
.c4p--coachmark-overlay__light .c4p--coachmark-overlay__body .bx--btn--ghost:hover {
|
|
10785
10802
|
background-color: var(--cds-inverse-hover-ui, #4c4c4c);
|
|
10786
10803
|
}
|
|
10787
10804
|
.c4p--coachmark-overlay__light .c4p--coachmark-overlay__body .bx--btn--ghost:active {
|
|
10788
10805
|
background-color: var(--cds-active-secondary, #6f6f6f);
|
|
10789
10806
|
}
|
|
10807
|
+
.c4p--coachmark-overlay__light .c4p--coachmark-overlay__body .bx--btn--ghost:focus {
|
|
10808
|
+
box-shadow: inset 0 0 0 1px var(--cds-inverse-02, #393939), inset 0 0 0 var(--cds-spacing-01, 0.125rem) #ffffff;
|
|
10809
|
+
}
|
|
10810
|
+
.c4p--coachmark-overlay__light .c4p--coachmark-overlay__handle:focus::before {
|
|
10811
|
+
border: 1px solid #ffffff;
|
|
10812
|
+
outline: 1px solid transparent;
|
|
10813
|
+
}
|
|
10814
|
+
.c4p--coachmark-overlay__light .c4p--coachmark-overlay--close-btn {
|
|
10815
|
+
border-color: transparent !important;
|
|
10816
|
+
border-radius: 0;
|
|
10817
|
+
outline: 1px solid transparent;
|
|
10818
|
+
}
|
|
10819
|
+
.c4p--coachmark-overlay__light .c4p--coachmark-overlay--close-btn:active {
|
|
10820
|
+
background-color: var(--cds-active-secondary, #6f6f6f);
|
|
10821
|
+
}
|
|
10822
|
+
.c4p--coachmark-overlay__light .c4p--coachmark-overlay--close-btn:focus {
|
|
10823
|
+
box-shadow: inset 0 0 0 1px var(--cds-inverse-02, #393939), inset 0 0 0 var(--cds-spacing-01, 0.125rem) #ffffff;
|
|
10824
|
+
}
|
|
10790
10825
|
.c4p--coachmark-overlay__dark .c4p--coachmark-overlay__body .bx--link {
|
|
10791
10826
|
color: #0062fe;
|
|
10792
10827
|
}
|
|
@@ -10804,6 +10839,9 @@ th.c4p--datagrid__select-all-toggle-on.button {
|
|
|
10804
10839
|
background-color: var(--cds-button-primary-active, #002d9c);
|
|
10805
10840
|
box-shadow: inset 0 0 0 var(--cds-spacing-01, 0.125rem) var(--cds-interactive-01, #0f62fe), inset 0 0 0 0.1875rem var(--cds-interactive-03, #0f62fe);
|
|
10806
10841
|
}
|
|
10842
|
+
.c4p--coachmark-overlay__dark .c4p--coachmark-overlay__body .bx--btn--ghost {
|
|
10843
|
+
border-color: transparent;
|
|
10844
|
+
}
|
|
10807
10845
|
.c4p--coachmark-overlay__dark .c4p--coachmark-overlay__body .bx--btn--ghost:hover {
|
|
10808
10846
|
background-color: var(--cds-inverse-hover-ui, #4c4c4c);
|
|
10809
10847
|
}
|
|
@@ -10811,7 +10849,20 @@ th.c4p--datagrid__select-all-toggle-on.button {
|
|
|
10811
10849
|
background-color: var(--cds-button-tertiary-active, #002d9c);
|
|
10812
10850
|
}
|
|
10813
10851
|
.c4p--coachmark-overlay__dark .c4p--coachmark-overlay__body .bx--btn--ghost:focus {
|
|
10814
|
-
box-shadow: inset 0 0 0
|
|
10852
|
+
box-shadow: inset 0 0 0 1px #0f62fe, inset 0 0 0 var(--cds-spacing-01, 0.125rem) #ffffff;
|
|
10853
|
+
}
|
|
10854
|
+
.c4p--coachmark-overlay__dark .c4p--coachmark-overlay__handle:focus::before {
|
|
10855
|
+
border: 1px solid #ffffff;
|
|
10856
|
+
outline: 1px solid #0f62fe;
|
|
10857
|
+
}
|
|
10858
|
+
.c4p--coachmark-overlay__dark .c4p--coachmark-overlay--close-btn {
|
|
10859
|
+
border-color: transparent;
|
|
10860
|
+
}
|
|
10861
|
+
.c4p--coachmark-overlay__dark .c4p--coachmark-overlay--close-btn:focus {
|
|
10862
|
+
box-shadow: inset 0 0 0 1px #0f62fe, inset 0 0 0 var(--cds-spacing-01, 0.125rem) #ffffff;
|
|
10863
|
+
}
|
|
10864
|
+
.c4p--coachmark-overlay__dark .c4p--coachmark-overlay--close-btn:active {
|
|
10865
|
+
background-color: var(--cds-button-tertiary-active, #002d9c);
|
|
10815
10866
|
}
|
|
10816
10867
|
.c4p--coachmark-overlay .c4p--carousel__item {
|
|
10817
10868
|
flex: 0 0 100% !important;
|
|
@@ -10888,6 +10939,10 @@ th.c4p--datagrid__select-all-toggle-on.button {
|
|
|
10888
10939
|
line-height: var(--cds-body-short-01-line-height, 1.28572);
|
|
10889
10940
|
letter-spacing: var(--cds-body-short-01-letter-spacing, 0.16px);
|
|
10890
10941
|
}
|
|
10942
|
+
.c4p--coachmark-tagline__cta:focus {
|
|
10943
|
+
box-shadow: inset 0 0 0 3px #6929c4, inset 0 0 0 var(--cds-spacing-02, 0.25rem) #ffffff;
|
|
10944
|
+
outline: 1px solid transparent;
|
|
10945
|
+
}
|
|
10891
10946
|
.c4p--coachmark-tagline__cta:hover {
|
|
10892
10947
|
cursor: pointer !important;
|
|
10893
10948
|
}
|
|
@@ -10897,8 +10952,17 @@ th.c4p--datagrid__select-all-toggle-on.button {
|
|
|
10897
10952
|
.c4p--coachmark-tagline--close-btn {
|
|
10898
10953
|
width: var(--cds-spacing-07, 2rem);
|
|
10899
10954
|
height: var(--cds-spacing-07, 2rem);
|
|
10955
|
+
border-color: transparent !important;
|
|
10956
|
+
border-radius: 0;
|
|
10900
10957
|
margin-left: auto !important;
|
|
10901
10958
|
color: #ffffff;
|
|
10959
|
+
outline: 1px solid transparent;
|
|
10960
|
+
}
|
|
10961
|
+
.c4p--coachmark-tagline--close-btn:active {
|
|
10962
|
+
background-color: var(--cds-active-secondary, #6f6f6f);
|
|
10963
|
+
}
|
|
10964
|
+
.c4p--coachmark-tagline--close-btn:focus {
|
|
10965
|
+
box-shadow: inset 0 0 0 1px var(--cds-inverse-02, #393939), inset 0 0 0 var(--cds-spacing-01, 0.125rem) #ffffff !important;
|
|
10902
10966
|
}
|
|
10903
10967
|
.c4p--coachmark-tagline--close-btn svg > path {
|
|
10904
10968
|
margin: 0;
|
|
@@ -10923,6 +10987,9 @@ th.c4p--datagrid__select-all-toggle-on.button {
|
|
|
10923
10987
|
.c4p--coachmark-beacon {
|
|
10924
10988
|
position: relative;
|
|
10925
10989
|
}
|
|
10990
|
+
.c4p--coachmark-beacon-default .c4p--coachmark-beacon__target::before {
|
|
10991
|
+
display: none;
|
|
10992
|
+
}
|
|
10926
10993
|
.c4p--coachmark-beacon-default .c4p--coachmark-beacon__target::after {
|
|
10927
10994
|
position: absolute;
|
|
10928
10995
|
top: calc(var(--cds-spacing-01, 0.125rem) + var(--cds-spacing-03, 0.5rem));
|
|
@@ -10933,18 +11000,19 @@ th.c4p--datagrid__select-all-toggle-on.button {
|
|
|
10933
11000
|
background-color: #4589ff;
|
|
10934
11001
|
content: "";
|
|
10935
11002
|
}
|
|
10936
|
-
.c4p--coachmark-beacon-
|
|
10937
|
-
|
|
10938
|
-
mask-image: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' version='1.1' width='80px' height='80px' viewBox='008080'><pathfill='white' stroke='none' d='M0,0m37-2a404001010Zm128a1212011-10Z'/></svg>");
|
|
10939
|
-
}
|
|
10940
|
-
.c4p--coachmark-beacon-ring .c4p--coachmark-beacon__center circle {
|
|
10941
|
-
/* stylelint-disable-next-line carbon/motion-easing-use */
|
|
10942
|
-
animation: ring-ripple 2s infinite;
|
|
11003
|
+
.c4p--coachmark-beacon-default .c4p--coachmark-beacon__target:focus {
|
|
11004
|
+
outline: transparent;
|
|
10943
11005
|
}
|
|
10944
|
-
|
|
10945
|
-
|
|
10946
|
-
|
|
10947
|
-
|
|
11006
|
+
.c4p--coachmark-beacon-default .c4p--coachmark-beacon__target:focus::before {
|
|
11007
|
+
position: absolute;
|
|
11008
|
+
top: 7px;
|
|
11009
|
+
left: 7px;
|
|
11010
|
+
display: block;
|
|
11011
|
+
width: 18px;
|
|
11012
|
+
height: 18px;
|
|
11013
|
+
border-radius: 100%;
|
|
11014
|
+
content: "";
|
|
11015
|
+
outline: var(--cds-spacing-01, 0.125rem) var(--cds-focus, #0f62fe) solid;
|
|
10948
11016
|
}
|
|
10949
11017
|
.c4p--coachmark-beacon .c4p--coachmark-beacon__target {
|
|
10950
11018
|
position: absolute;
|
|
@@ -11040,6 +11108,7 @@ th.c4p--datagrid__select-all-toggle-on.button {
|
|
|
11040
11108
|
display: flex;
|
|
11041
11109
|
align-items: center;
|
|
11042
11110
|
justify-content: flex-end;
|
|
11111
|
+
padding: 0 var(--cds-spacing-05, 1rem) var(--cds-spacing-05, 1rem);
|
|
11043
11112
|
}
|
|
11044
11113
|
.c4p--coachmark-overlay-elements--controls-progress {
|
|
11045
11114
|
margin-right: auto;
|
|
@@ -11049,6 +11118,9 @@ th.c4p--datagrid__select-all-toggle-on.button {
|
|
|
11049
11118
|
letter-spacing: var(--cds-helper-text-01-letter-spacing, 0.32px);
|
|
11050
11119
|
}
|
|
11051
11120
|
|
|
11121
|
+
.c4p--coachmark-overlay-element {
|
|
11122
|
+
padding: var(--cds-spacing-01, 0.125rem) var(--cds-spacing-05, 1rem) 0;
|
|
11123
|
+
}
|
|
11052
11124
|
.c4p--coachmark-overlay-element__content {
|
|
11053
11125
|
padding-bottom: var(--cds-spacing-05, 1rem);
|
|
11054
11126
|
}
|
|
@@ -11080,6 +11152,7 @@ th.c4p--datagrid__select-all-toggle-on.button {
|
|
|
11080
11152
|
right: var(--cds-spacing-05, 1rem);
|
|
11081
11153
|
bottom: -100%;
|
|
11082
11154
|
transform: translateY(100%);
|
|
11155
|
+
visibility: hidden;
|
|
11083
11156
|
}
|
|
11084
11157
|
.c4p--coachmark-stack-element--is-mounted {
|
|
11085
11158
|
bottom: 0;
|
|
@@ -11094,6 +11167,7 @@ th.c4p--datagrid__select-all-toggle-on.button {
|
|
|
11094
11167
|
.c4p--coachmark-stack-element--is-visible {
|
|
11095
11168
|
opacity: 1;
|
|
11096
11169
|
transform: translateY(0);
|
|
11170
|
+
visibility: visible;
|
|
11097
11171
|
}
|
|
11098
11172
|
.c4p--coachmark-stack-element--is-stacked {
|
|
11099
11173
|
bottom: 0;
|
|
@@ -11101,6 +11175,7 @@ th.c4p--datagrid__select-all-toggle-on.button {
|
|
|
11101
11175
|
pointer-events: none;
|
|
11102
11176
|
transform: perspective(9rem) translate3d(0, calc(var(--cds-spacing-09, 3rem) * -1), calc(var(--cds-spacing-05, 1rem) * -1));
|
|
11103
11177
|
transform-origin: top center;
|
|
11178
|
+
visibility: visible;
|
|
11104
11179
|
}
|
|
11105
11180
|
.c4p--coachmark-stack-element--is-stacked__light {
|
|
11106
11181
|
background-color: #262626;
|
|
@@ -11281,6 +11356,7 @@ th.c4p--datagrid__select-all-toggle-on.button {
|
|
|
11281
11356
|
.c4p--checklist__header {
|
|
11282
11357
|
display: flex;
|
|
11283
11358
|
padding: var(--cds-spacing-05, 1rem);
|
|
11359
|
+
border-top: 1px solid var(--cds-ui-03, #e0e0e0);
|
|
11284
11360
|
background-color: var(--cds-ui-01, #f4f4f4);
|
|
11285
11361
|
gap: var(--cds-spacing-03, 0.5rem);
|
|
11286
11362
|
}
|
|
@@ -11383,9 +11459,6 @@ th.c4p--datagrid__select-all-toggle-on.button {
|
|
|
11383
11459
|
color: var(--cds-text-primary, #161616);
|
|
11384
11460
|
text-decoration: underline;
|
|
11385
11461
|
}
|
|
11386
|
-
.c4p--checklist__button--error {
|
|
11387
|
-
color: var(--cds-text-error, #da1e28) !important;
|
|
11388
|
-
}
|
|
11389
11462
|
.c4p--checklist__content-outer {
|
|
11390
11463
|
overflow: hidden;
|
|
11391
11464
|
}
|
|
@@ -11430,13 +11503,15 @@ th.c4p--datagrid__select-all-toggle-on.button {
|
|
|
11430
11503
|
.c4p--checklist__icon {
|
|
11431
11504
|
/* stylelint-disable-next-line carbon/layout-token-use */
|
|
11432
11505
|
margin: 0.0625rem var(--cds-spacing-03, 0.5rem) 0 0;
|
|
11506
|
+
}
|
|
11507
|
+
.c4p--checklist__icon--checked, .c4p--checklist__icon--indeterminate {
|
|
11433
11508
|
color: var(--cds-link-01, #0f62fe);
|
|
11434
11509
|
}
|
|
11435
11510
|
.c4p--checklist__icon--error {
|
|
11436
11511
|
color: var(--cds-support-error, #da1e28);
|
|
11437
11512
|
}
|
|
11438
11513
|
.c4p--checklist__icon--disabled {
|
|
11439
|
-
color: var(--cds-disabled-
|
|
11514
|
+
color: var(--cds-disabled-02, #c6c6c6);
|
|
11440
11515
|
}
|
|
11441
11516
|
.c4p--checklist__label {
|
|
11442
11517
|
font-size: var(--cds-body-short-01-font-size, 0.875rem);
|
|
@@ -11449,8 +11524,8 @@ th.c4p--datagrid__select-all-toggle-on.button {
|
|
|
11449
11524
|
-webkit-line-clamp: 2;
|
|
11450
11525
|
text-overflow: ellipsis;
|
|
11451
11526
|
}
|
|
11452
|
-
.c4p--checklist__label--
|
|
11453
|
-
color: var(--cds-disabled-
|
|
11527
|
+
.c4p--checklist__label--disabled {
|
|
11528
|
+
color: var(--cds-disabled-02, #c6c6c6);
|
|
11454
11529
|
}
|
|
11455
11530
|
.c4p--checklist__footer {
|
|
11456
11531
|
display: -webkit-box;
|