@carbon/ibm-products 1.61.1 → 1.62.0
Sign up to get free protection for your applications and to get access to all the features.
- package/css/index-full-carbon.css +156 -68
- 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 +156 -68
- 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 +156 -68
- 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 +41 -25
- 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 +50 -14
- package/es/components/Datagrid/Datagrid.stories/StickyActionsColumnStory.js +1 -1
- package/es/components/Datagrid/useActionsColumn.js +9 -9
- 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/useOnRowClick.js +6 -7
- package/es/components/Datagrid/useParentDimensions.js +6 -6
- package/es/components/Datagrid/useResizeTable.js +7 -7
- 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 +4 -5
- 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/global/js/hooks/index.js +3 -2
- package/es/global/js/hooks/usePrefix.js +11 -0
- package/es/global/js/package-settings.js +1 -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 +41 -32
- 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 +52 -15
- 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/useOnRowClick.js +6 -7
- package/lib/components/Datagrid/useParentDimensions.js +5 -6
- package/lib/components/Datagrid/useResizeTable.js +6 -7
- 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 +4 -5
- 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/global/js/hooks/index.js +8 -1
- package/lib/global/js/hooks/usePrefix.js +19 -0
- package/lib/global/js/package-settings.js +1 -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 +19 -1
- 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/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,6 +11000,20 @@ th.c4p--datagrid__select-all-toggle-on.button {
|
|
10933
11000
|
background-color: #4589ff;
|
10934
11001
|
content: "";
|
10935
11002
|
}
|
11003
|
+
.c4p--coachmark-beacon-default .c4p--coachmark-beacon__target:focus {
|
11004
|
+
outline: transparent;
|
11005
|
+
}
|
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;
|
11016
|
+
}
|
10936
11017
|
.c4p--coachmark-beacon .c4p--coachmark-beacon__target {
|
10937
11018
|
position: absolute;
|
10938
11019
|
top: calc(-1 * var(--cds-spacing-05, 1rem));
|
@@ -11027,6 +11108,7 @@ th.c4p--datagrid__select-all-toggle-on.button {
|
|
11027
11108
|
display: flex;
|
11028
11109
|
align-items: center;
|
11029
11110
|
justify-content: flex-end;
|
11111
|
+
padding: 0 var(--cds-spacing-05, 1rem) var(--cds-spacing-05, 1rem);
|
11030
11112
|
}
|
11031
11113
|
.c4p--coachmark-overlay-elements--controls-progress {
|
11032
11114
|
margin-right: auto;
|
@@ -11036,6 +11118,9 @@ th.c4p--datagrid__select-all-toggle-on.button {
|
|
11036
11118
|
letter-spacing: var(--cds-helper-text-01-letter-spacing, 0.32px);
|
11037
11119
|
}
|
11038
11120
|
|
11121
|
+
.c4p--coachmark-overlay-element {
|
11122
|
+
padding: var(--cds-spacing-01, 0.125rem) var(--cds-spacing-05, 1rem) 0;
|
11123
|
+
}
|
11039
11124
|
.c4p--coachmark-overlay-element__content {
|
11040
11125
|
padding-bottom: var(--cds-spacing-05, 1rem);
|
11041
11126
|
}
|
@@ -11067,6 +11152,7 @@ th.c4p--datagrid__select-all-toggle-on.button {
|
|
11067
11152
|
right: var(--cds-spacing-05, 1rem);
|
11068
11153
|
bottom: -100%;
|
11069
11154
|
transform: translateY(100%);
|
11155
|
+
visibility: hidden;
|
11070
11156
|
}
|
11071
11157
|
.c4p--coachmark-stack-element--is-mounted {
|
11072
11158
|
bottom: 0;
|
@@ -11081,6 +11167,7 @@ th.c4p--datagrid__select-all-toggle-on.button {
|
|
11081
11167
|
.c4p--coachmark-stack-element--is-visible {
|
11082
11168
|
opacity: 1;
|
11083
11169
|
transform: translateY(0);
|
11170
|
+
visibility: visible;
|
11084
11171
|
}
|
11085
11172
|
.c4p--coachmark-stack-element--is-stacked {
|
11086
11173
|
bottom: 0;
|
@@ -11088,6 +11175,7 @@ th.c4p--datagrid__select-all-toggle-on.button {
|
|
11088
11175
|
pointer-events: none;
|
11089
11176
|
transform: perspective(9rem) translate3d(0, calc(var(--cds-spacing-09, 3rem) * -1), calc(var(--cds-spacing-05, 1rem) * -1));
|
11090
11177
|
transform-origin: top center;
|
11178
|
+
visibility: visible;
|
11091
11179
|
}
|
11092
11180
|
.c4p--coachmark-stack-element--is-stacked__light {
|
11093
11181
|
background-color: #262626;
|
@@ -11268,6 +11356,7 @@ th.c4p--datagrid__select-all-toggle-on.button {
|
|
11268
11356
|
.c4p--checklist__header {
|
11269
11357
|
display: flex;
|
11270
11358
|
padding: var(--cds-spacing-05, 1rem);
|
11359
|
+
border-top: 1px solid var(--cds-ui-03, #e0e0e0);
|
11271
11360
|
background-color: var(--cds-ui-01, #f4f4f4);
|
11272
11361
|
gap: var(--cds-spacing-03, 0.5rem);
|
11273
11362
|
}
|
@@ -11370,9 +11459,6 @@ th.c4p--datagrid__select-all-toggle-on.button {
|
|
11370
11459
|
color: var(--cds-text-primary, #161616);
|
11371
11460
|
text-decoration: underline;
|
11372
11461
|
}
|
11373
|
-
.c4p--checklist__button--error {
|
11374
|
-
color: var(--cds-text-error, #da1e28) !important;
|
11375
|
-
}
|
11376
11462
|
.c4p--checklist__content-outer {
|
11377
11463
|
overflow: hidden;
|
11378
11464
|
}
|
@@ -11417,13 +11503,15 @@ th.c4p--datagrid__select-all-toggle-on.button {
|
|
11417
11503
|
.c4p--checklist__icon {
|
11418
11504
|
/* stylelint-disable-next-line carbon/layout-token-use */
|
11419
11505
|
margin: 0.0625rem var(--cds-spacing-03, 0.5rem) 0 0;
|
11506
|
+
}
|
11507
|
+
.c4p--checklist__icon--checked, .c4p--checklist__icon--indeterminate {
|
11420
11508
|
color: var(--cds-link-01, #0f62fe);
|
11421
11509
|
}
|
11422
11510
|
.c4p--checklist__icon--error {
|
11423
11511
|
color: var(--cds-support-error, #da1e28);
|
11424
11512
|
}
|
11425
11513
|
.c4p--checklist__icon--disabled {
|
11426
|
-
color: var(--cds-disabled-
|
11514
|
+
color: var(--cds-disabled-02, #c6c6c6);
|
11427
11515
|
}
|
11428
11516
|
.c4p--checklist__label {
|
11429
11517
|
font-size: var(--cds-body-short-01-font-size, 0.875rem);
|
@@ -11436,8 +11524,8 @@ th.c4p--datagrid__select-all-toggle-on.button {
|
|
11436
11524
|
-webkit-line-clamp: 2;
|
11437
11525
|
text-overflow: ellipsis;
|
11438
11526
|
}
|
11439
|
-
.c4p--checklist__label--
|
11440
|
-
color: var(--cds-disabled-
|
11527
|
+
.c4p--checklist__label--disabled {
|
11528
|
+
color: var(--cds-disabled-02, #c6c6c6);
|
11441
11529
|
}
|
11442
11530
|
.c4p--checklist__footer {
|
11443
11531
|
display: -webkit-box;
|