@carbon/ibm-products 2.21.0 → 2.23.0
Sign up to get free protection for your applications and to get access to all the features.
- package/README.md +8 -4
- package/css/index-full-carbon.css +559 -357
- package/css/index-full-carbon.css.map +1 -1
- package/css/index-full-carbon.min.css +1 -1
- package/css/index-full-carbon.min.css.map +1 -1
- package/css/index-without-carbon-released-only.css +227 -267
- package/css/index-without-carbon-released-only.css.map +1 -1
- package/css/index-without-carbon-released-only.min.css +1 -1
- package/css/index-without-carbon-released-only.min.css.map +1 -1
- package/css/index-without-carbon.css +271 -295
- package/css/index-without-carbon.css.map +1 -1
- package/css/index-without-carbon.min.css +1 -1
- package/css/index-without-carbon.min.css.map +1 -1
- package/css/index.css +251 -298
- package/css/index.css.map +1 -1
- package/css/index.min.css +1 -1
- package/css/index.min.css.map +1 -1
- package/es/components/Datagrid/Datagrid/DatagridContent.js +8 -3
- package/es/components/Datagrid/Datagrid/DatagridHeaderRow.js +14 -4
- package/es/components/Datagrid/Datagrid/DatagridRow.js +6 -1
- package/es/components/Datagrid/Datagrid/addons/Filtering/FilterFlyout.js +6 -3
- package/es/components/Datagrid/Datagrid/addons/Filtering/FilterPanel.js +2 -2
- package/es/components/Datagrid/Datagrid/addons/Filtering/hooks/useFilters.js +30 -72
- package/es/components/Datagrid/Datagrid/addons/Slug/ColumnHeaderSlug.js +26 -0
- package/es/components/Datagrid/useDefaultStringRenderer.js +3 -3
- package/es/components/Datagrid/useRowIsMouseOver.js +3 -1
- package/es/components/Datagrid/useSortableColumns.js +15 -5
- package/es/components/DelimitedList/DelimitedList.docs-page.js +15 -0
- package/es/components/DelimitedList/DelimitedList.js +73 -0
- package/es/components/DelimitedList/index.js +8 -0
- package/es/components/FilterSummary/FilterSummary.js +100 -19
- package/es/components/SidePanel/SidePanel.js +145 -189
- package/es/components/TagSet/TagSet.js +31 -7
- package/es/components/TagSet/TagSetOverflow.js +13 -8
- package/es/components/index.js +2 -1
- package/es/global/js/hooks/useResizeObserver.js +5 -2
- package/es/global/js/package-settings.js +1 -0
- package/lib/components/Datagrid/Datagrid/DatagridContent.js +8 -3
- package/lib/components/Datagrid/Datagrid/DatagridHeaderRow.js +14 -4
- package/lib/components/Datagrid/Datagrid/DatagridRow.js +6 -1
- package/lib/components/Datagrid/Datagrid/addons/Filtering/FilterFlyout.js +6 -3
- package/lib/components/Datagrid/Datagrid/addons/Filtering/FilterPanel.js +2 -2
- package/lib/components/Datagrid/Datagrid/addons/Filtering/hooks/useFilters.js +30 -72
- package/lib/components/Datagrid/Datagrid/addons/Slug/ColumnHeaderSlug.js +36 -0
- package/lib/components/Datagrid/useDefaultStringRenderer.js +3 -3
- package/lib/components/Datagrid/useRowIsMouseOver.js +3 -1
- package/lib/components/Datagrid/useSortableColumns.js +15 -5
- package/lib/components/DelimitedList/DelimitedList.docs-page.js +25 -0
- package/lib/components/DelimitedList/DelimitedList.js +78 -0
- package/lib/components/DelimitedList/index.js +12 -0
- package/lib/components/FilterSummary/FilterSummary.js +103 -23
- package/lib/components/SidePanel/SidePanel.js +145 -189
- package/lib/components/TagSet/TagSet.js +31 -7
- package/lib/components/TagSet/TagSetOverflow.js +12 -7
- package/lib/components/index.js +8 -1
- package/lib/global/js/hooks/useResizeObserver.js +5 -2
- package/lib/global/js/package-settings.js +1 -0
- package/package.json +9 -8
- package/scss/components/CreateSidePanel/_create-side-panel.scss +1 -38
- package/scss/components/Datagrid/_datagrid.scss +4 -0
- package/scss/components/Datagrid/styles/_datagrid.scss +24 -1
- package/scss/components/Datagrid/styles/_useStickyColumn.scss +2 -0
- package/scss/components/DelimitedList/_carbon-imports.scss +9 -0
- package/scss/components/DelimitedList/_delimited-list.scss +27 -0
- package/scss/components/DelimitedList/_index-with-carbon.scss +9 -0
- package/scss/components/DelimitedList/_index.scss +8 -0
- package/scss/components/EditSidePanel/_edit-side-panel.scss +0 -18
- package/scss/components/FilterSummary/_filter-summary.scss +22 -1
- package/scss/components/SidePanel/_side-panel-variables.scss +5 -1
- package/scss/components/SidePanel/_side-panel.scss +155 -187
- package/scss/components/_index-with-carbon.scss +1 -0
- package/scss/components/_index.scss +1 -0
- package/telemetry.yml +790 -0
package/css/index.css
CHANGED
@@ -548,15 +548,15 @@
|
|
548
548
|
}
|
549
549
|
|
550
550
|
.cds--popover--left-top > .cds--popover > .cds--popover-content {
|
551
|
-
inset-block-start:
|
551
|
+
inset-block-start: 50%;
|
552
552
|
inset-inline-end: 100%;
|
553
|
-
transform: translate(calc(-1 * var(--cds-popover-offset, 0rem)), calc(-0.5 * var(--cds-popover-offset, 0rem)
|
553
|
+
transform: translate(calc(-1 * var(--cds-popover-offset, 0rem)), calc(-0.5 * var(--cds-popover-offset, 0rem) - 16px));
|
554
554
|
}
|
555
555
|
|
556
556
|
.cds--popover--left-bottom > .cds--popover > .cds--popover-content {
|
557
|
-
inset-block-end:
|
557
|
+
inset-block-end: 50%;
|
558
558
|
inset-inline-end: 100%;
|
559
|
-
transform: translate(calc(-1 * var(--cds-popover-offset, 0rem)), calc(0.5 * var(--cds-popover-offset, 0rem)
|
559
|
+
transform: translate(calc(-1 * var(--cds-popover-offset, 0rem)), calc(0.5 * var(--cds-popover-offset, 0rem) + 16px));
|
560
560
|
}
|
561
561
|
|
562
562
|
[dir=rtl] .cds--popover--left > .cds--popover > .cds--popover-content,
|
@@ -2323,18 +2323,19 @@
|
|
2323
2323
|
align-items: flex-start;
|
2324
2324
|
}
|
2325
2325
|
|
2326
|
-
.cds--modal-close {
|
2326
|
+
.cds--modal-close-button {
|
2327
2327
|
position: absolute;
|
2328
|
-
|
2329
|
-
|
2328
|
+
inset-block-start: 0;
|
2329
|
+
inset-inline-end: 0;
|
2330
|
+
}
|
2331
|
+
|
2332
|
+
.cds--modal-close {
|
2330
2333
|
padding: 0.75rem;
|
2331
2334
|
border: 2px solid transparent;
|
2332
2335
|
background-color: transparent;
|
2333
2336
|
block-size: 3rem;
|
2334
2337
|
cursor: pointer;
|
2335
2338
|
inline-size: 3rem;
|
2336
|
-
inset-block-start: 0;
|
2337
|
-
inset-inline-end: 0;
|
2338
2339
|
transition: background-color 110ms cubic-bezier(0.2, 0, 0.38, 0.9);
|
2339
2340
|
}
|
2340
2341
|
.cds--modal-close:hover {
|
@@ -2370,12 +2371,12 @@
|
|
2370
2371
|
}
|
2371
2372
|
|
2372
2373
|
.cds--modal--slug .cds--modal-container {
|
2373
|
-
background: linear-gradient(
|
2374
|
+
background: linear-gradient(to top, var(--cds-ai-aura-start, rgba(69, 137, 255, 0.1)) 0%, var(--cds-ai-aura-end, rgba(255, 255, 255, 0)) 50%) padding-box, linear-gradient(to top, var(--cds-background, #ffffff), var(--cds-background, #ffffff)) padding-box, linear-gradient(to bottom, var(--cds-ai-border-start, #78a9ff), var(--cds-ai-border-end, #d0e2ff)) border-box, linear-gradient(to top, var(--cds-background, #ffffff), var(--cds-background, #ffffff)) border-box;
|
2374
2375
|
background-color: var(--cds-layer);
|
2375
2376
|
}
|
2376
2377
|
|
2377
2378
|
.cds--modal--slug .cds--modal-container:has(.cds--btn-set:not(.cds--modal-footer--three-button) > button:not(:only-child)) {
|
2378
|
-
background: linear-gradient(
|
2379
|
+
background: linear-gradient(to top, var(--cds-ai-aura-start, rgba(69, 137, 255, 0.1)) calc(0% + 64px), var(--cds-ai-aura-end, rgba(255, 255, 255, 0)) 50%) padding-box, linear-gradient(to top, var(--cds-background, #ffffff), var(--cds-background, #ffffff)) padding-box, linear-gradient(to bottom, var(--cds-ai-border-start, #78a9ff), var(--cds-ai-border-end, #d0e2ff)) border-box, linear-gradient(to top, var(--cds-background, #ffffff), var(--cds-background, #ffffff)) border-box;
|
2379
2380
|
background-color: var(--cds-layer);
|
2380
2381
|
}
|
2381
2382
|
|
@@ -2385,8 +2386,8 @@
|
|
2385
2386
|
inset-inline-end: 0;
|
2386
2387
|
}
|
2387
2388
|
|
2388
|
-
.cds--modal-header > .cds--slug:has(+ .cds--modal-close),
|
2389
|
-
.cds--modal-header > .cds--modal-close ~ .cds--slug,
|
2389
|
+
.cds--modal-header > .cds--slug:has(+ .cds--modal-close-button),
|
2390
|
+
.cds--modal-header > .cds--modal-close-button ~ .cds--slug,
|
2390
2391
|
.cds--modal--slug .cds--modal-container-body > .cds--slug {
|
2391
2392
|
inset-inline-end: 3rem;
|
2392
2393
|
}
|
@@ -3278,8 +3279,9 @@ fieldset[disabled] .cds--form__helper-text {
|
|
3278
3279
|
transform: translateY(-50%);
|
3279
3280
|
}
|
3280
3281
|
|
3281
|
-
.cds--text-input__field-wrapper--slug .cds--text-input {
|
3282
|
-
background-image: linear-gradient(
|
3282
|
+
.cds--text-input__field-wrapper--slug .cds--text-input:not(:has(~ .cds--slug--revert)) {
|
3283
|
+
background-image: linear-gradient(0deg, var(--cds-ai-inner-shadow, rgba(69, 137, 255, 0.2)) 0%, 15%, var(--cds-ai-aura-end, rgba(255, 255, 255, 0)) 50%, transparent 100%);
|
3284
|
+
border-block-end-color: var(--cds-ai-border-strong, #4589ff);
|
3283
3285
|
padding-inline-end: 2.5rem;
|
3284
3286
|
}
|
3285
3287
|
|
@@ -7167,76 +7169,94 @@ a.cds--overflow-menu-options__btn::before {
|
|
7167
7169
|
margin-bottom: 0;
|
7168
7170
|
}
|
7169
7171
|
|
7172
|
+
/* One or two values
|
7173
|
+
* - width (first value)
|
7174
|
+
* - min-width (optional second value)
|
7175
|
+
*/
|
7176
|
+
.c4p--side-panel--scrolls {
|
7177
|
+
overflow: auto;
|
7178
|
+
overflow-x: hidden;
|
7179
|
+
}
|
7180
|
+
|
7170
7181
|
.c4p--side-panel__container {
|
7171
|
-
--c4p--side-panel--
|
7172
|
-
--c4p--side-panel--
|
7173
|
-
--c4p--side-panel--title-
|
7174
|
-
--c4p--side-panel--
|
7175
|
-
--c4p--side-panel--action-bar-container-height: 0;
|
7176
|
-
--c4p--side-panel--divider-opacity: 0;
|
7177
|
-
--c4p--side-panel--title-y-position: 0;
|
7178
|
-
--c4p--side-panel--content-bottom-padding: 4rem;
|
7179
|
-
--c4p--side-panel--collapsed-title-y-position: 1rem;
|
7180
|
-
--c4p--side-panel--label-text-height: 0;
|
7181
|
-
--c4p--side-panel--title-padding-right: 3rem;
|
7182
|
+
--c4p--side-panel--title-stop: 1rem;
|
7183
|
+
--c4p--side-panel--scroll-animation-progress: 0;
|
7184
|
+
--c4p--side-panel--title-padding-right: 2rem;
|
7185
|
+
--c4p--side-panel--actions-height: 4rem;
|
7182
7186
|
position: fixed;
|
7183
7187
|
z-index: 9000;
|
7184
7188
|
top: 3rem;
|
7189
|
+
display: grid;
|
7185
7190
|
height: calc(100% - 3rem);
|
7186
7191
|
box-sizing: border-box;
|
7187
7192
|
background-color: var(--cds-layer-01, #f4f4f4);
|
7188
7193
|
color: var(--cds-text-primary, #161616);
|
7194
|
+
grid-template-rows: 1fr auto; /* titles and content */
|
7189
7195
|
}
|
7190
7196
|
.c4p--side-panel__container.c4p--side-panel__container--xs {
|
7197
|
+
/* any value is single value list */
|
7191
7198
|
width: 16rem;
|
7192
7199
|
max-width: 100%;
|
7193
7200
|
}
|
7194
|
-
.c4p--side-panel__container.c4p--side-panel__container--xs .c4p--side-
|
7195
|
-
.c4p--side-panel__container.c4p--side-panel__container--xs .c4p--side-
|
7196
|
-
|
7201
|
+
.c4p--side-panel__container.c4p--side-panel__container--xs .c4p--side-panel__header.c4p--side-panel__header--no-title-animation,
|
7202
|
+
.c4p--side-panel__container.c4p--side-panel__container--xs .c4p--side-panel__header--no-title-animation .c4p--side-panel__subtitle-text {
|
7203
|
+
/* any value is single value list */
|
7197
7204
|
width: 16rem;
|
7198
7205
|
max-width: 100%;
|
7199
7206
|
}
|
7200
7207
|
.c4p--side-panel__container.c4p--side-panel__container--sm {
|
7208
|
+
/* any value is single value list */
|
7201
7209
|
width: 20rem;
|
7202
7210
|
max-width: 100%;
|
7203
7211
|
}
|
7204
|
-
.c4p--side-panel__container.c4p--side-panel__container--sm .c4p--side-
|
7205
|
-
.c4p--side-panel__container.c4p--side-panel__container--sm .c4p--side-
|
7206
|
-
|
7212
|
+
.c4p--side-panel__container.c4p--side-panel__container--sm .c4p--side-panel__header.c4p--side-panel__header--no-title-animation,
|
7213
|
+
.c4p--side-panel__container.c4p--side-panel__container--sm .c4p--side-panel__header--no-title-animation .c4p--side-panel__subtitle-text {
|
7214
|
+
/* any value is single value list */
|
7207
7215
|
width: 20rem;
|
7208
7216
|
max-width: 100%;
|
7209
7217
|
}
|
7210
7218
|
.c4p--side-panel__container.c4p--side-panel__container--md {
|
7219
|
+
/* any value is single value list */
|
7211
7220
|
width: 30rem;
|
7212
7221
|
max-width: 100%;
|
7213
7222
|
}
|
7214
|
-
.c4p--side-panel__container.c4p--side-panel__container--md .c4p--side-
|
7215
|
-
.c4p--side-panel__container.c4p--side-panel__container--md .c4p--side-
|
7216
|
-
|
7223
|
+
.c4p--side-panel__container.c4p--side-panel__container--md .c4p--side-panel__header.c4p--side-panel__header--no-title-animation,
|
7224
|
+
.c4p--side-panel__container.c4p--side-panel__container--md .c4p--side-panel__header--no-title-animation .c4p--side-panel__subtitle-text {
|
7225
|
+
/* any value is single value list */
|
7217
7226
|
width: 30rem;
|
7218
7227
|
max-width: 100%;
|
7219
7228
|
}
|
7220
7229
|
.c4p--side-panel__container.c4p--side-panel__container--lg {
|
7230
|
+
/* any value is single value list */
|
7221
7231
|
width: 40rem;
|
7222
7232
|
max-width: 100%;
|
7223
7233
|
}
|
7224
|
-
.c4p--side-panel__container.c4p--side-panel__container--lg .c4p--side-
|
7225
|
-
.c4p--side-panel__container.c4p--side-panel__container--lg .c4p--side-
|
7226
|
-
|
7234
|
+
.c4p--side-panel__container.c4p--side-panel__container--lg .c4p--side-panel__header.c4p--side-panel__header--no-title-animation,
|
7235
|
+
.c4p--side-panel__container.c4p--side-panel__container--lg .c4p--side-panel__header--no-title-animation .c4p--side-panel__subtitle-text {
|
7236
|
+
/* any value is single value list */
|
7227
7237
|
width: 40rem;
|
7228
7238
|
max-width: 100%;
|
7229
7239
|
}
|
7230
7240
|
.c4p--side-panel__container.c4p--side-panel__container--2xl {
|
7231
|
-
|
7241
|
+
/* any value is single value list */
|
7242
|
+
width: 40rem;
|
7243
|
+
min-width: 75%;
|
7232
7244
|
max-width: 100%;
|
7233
7245
|
}
|
7234
|
-
.c4p--side-panel__container.c4p--side-panel__container--2xl .c4p--side-
|
7235
|
-
.c4p--side-panel__container.c4p--side-panel__container--2xl .c4p--side-
|
7236
|
-
|
7237
|
-
width:
|
7246
|
+
.c4p--side-panel__container.c4p--side-panel__container--2xl .c4p--side-panel__header.c4p--side-panel__header--no-title-animation,
|
7247
|
+
.c4p--side-panel__container.c4p--side-panel__container--2xl .c4p--side-panel__header--no-title-animation .c4p--side-panel__subtitle-text {
|
7248
|
+
/* any value is single value list */
|
7249
|
+
width: 40rem;
|
7250
|
+
min-width: 75%;
|
7238
7251
|
max-width: 100%;
|
7239
7252
|
}
|
7253
|
+
.c4p--side-panel__container:not(:has(.c4p--side-panel__animated-scroll-wrapper)), .c4p--side-panel__container.c4p--side-panel__container--has-no-animated-scroll-wrapper {
|
7254
|
+
/* if the title does not scroll then we have a child scrolling section. */
|
7255
|
+
grid-template-rows: auto 1fr auto; /* titles content actions */
|
7256
|
+
}
|
7257
|
+
.c4p--side-panel__container.c4p--side-panel__container--condensed-actions {
|
7258
|
+
--c4p--side-panel--actions-height: 3rem;
|
7259
|
+
}
|
7240
7260
|
.c4p--side-panel__container .c4p--side-panel__actions-container {
|
7241
7261
|
width: 100%;
|
7242
7262
|
}
|
@@ -7248,46 +7268,30 @@ a.cds--overflow-menu-options__btn::before {
|
|
7248
7268
|
left: 0;
|
7249
7269
|
border-right: 1px solid var(--cds-border-subtle-02, #e0e0e0);
|
7250
7270
|
}
|
7251
|
-
.c4p--side-panel__container.c4p--side-panel__container-
|
7252
|
-
/* stylelint-disable-next-line max-nesting-depth */
|
7253
|
-
}
|
7254
|
-
.c4p--side-panel__container.c4p--side-panel__container-with-action-toolbar.c4p--side-panel__with-condensed-header .c4p--side-panel__title-container::before {
|
7255
|
-
content: none;
|
7256
|
-
}
|
7257
|
-
.c4p--side-panel__container.c4p--side-panel__container-with-action-toolbar.c4p--side-panel__with-condensed-header .c4p--side-panel__action-toolbar {
|
7258
|
-
/* stylelint-disable-next-line max-nesting-depth */
|
7259
|
-
}
|
7260
|
-
.c4p--side-panel__container.c4p--side-panel__container-with-action-toolbar.c4p--side-panel__with-condensed-header .c4p--side-panel__action-toolbar::before {
|
7261
|
-
position: absolute;
|
7262
|
-
bottom: 0;
|
7263
|
-
left: 0;
|
7264
|
-
width: 100%;
|
7265
|
-
height: 1px;
|
7266
|
-
background-color: var(--cds-border-subtle-02, #e0e0e0);
|
7267
|
-
content: "";
|
7268
|
-
opacity: var(--c4p--side-panel--divider-opacity);
|
7269
|
-
}
|
7270
|
-
.c4p--side-panel__container.c4p--side-panel__container-without-overlay {
|
7271
|
+
.c4p--side-panel__container.c4p--side-panel__container--slide-in, .c4p--side-panel__container.c4p--side-panel__container:not(:has(+ .c4p--side-panel__overlay)), .c4p--side-panel__container.c4p--side-panel__container--has-no-overlay {
|
7271
7272
|
box-shadow: 0 0.125rem 0.25rem var(--cds-overlay, rgba(22, 22, 22, 0.5));
|
7272
7273
|
}
|
7273
|
-
.c4p--side-panel__container .c4p--side-
|
7274
|
+
.c4p--side-panel__container .c4p--side-panel__header {
|
7275
|
+
--c4p--side-panel--title-padding-bottom: 1rem;
|
7274
7276
|
position: sticky;
|
7275
7277
|
z-index: 4;
|
7276
|
-
|
7278
|
+
/* stylelint-disable-next-line carbon/layout-token-use */
|
7279
|
+
top: calc(-1px * var(--c4p--side-panel--scroll-animation-distance));
|
7277
7280
|
padding: 1rem;
|
7281
|
+
padding-bottom: 0;
|
7278
7282
|
background-color: var(--cds-layer-01, #f4f4f4);
|
7279
7283
|
/* stylelint-disable-next-line max-nesting-depth */
|
7280
7284
|
}
|
7281
|
-
.c4p--side-panel__container .c4p--side-
|
7282
|
-
padding-bottom: 0.5rem;
|
7285
|
+
.c4p--side-panel__container .c4p--side-panel__header:has(.c4p--side-panel__subtitle-text), .c4p--side-panel__container .c4p--side-panel__header.c4p--side-panel__header--has-subtitle {
|
7286
|
+
--c4p--side-panel--title-padding-bottom: 0.5rem;
|
7283
7287
|
}
|
7284
|
-
.c4p--side-panel__container .c4p--side-
|
7288
|
+
.c4p--side-panel__container .c4p--side-panel__header:has(.c4p--side-panel__navigation-back-button), .c4p--side-panel__container .c4p--side-panel__header.c4p--side-panel__header--has-navigation-back {
|
7285
7289
|
padding-top: 2rem;
|
7286
7290
|
}
|
7287
|
-
.c4p--side-panel__container .c4p--side-
|
7291
|
+
.c4p--side-panel__container .c4p--side-panel__header:has(.c4p--side-panel__navigation-back-button.cds--btn--md), .c4p--side-panel__container .c4p--side-panel__header.c4p--side-panel__header--has-navigation-back.cds--btn--md {
|
7288
7292
|
padding-top: 2.5rem;
|
7289
7293
|
}
|
7290
|
-
.c4p--side-panel__container .c4p--side-
|
7294
|
+
.c4p--side-panel__container .c4p--side-panel__header::before {
|
7291
7295
|
position: absolute;
|
7292
7296
|
bottom: 0;
|
7293
7297
|
left: 0;
|
@@ -7295,47 +7299,56 @@ a.cds--overflow-menu-options__btn::before {
|
|
7295
7299
|
height: 1px;
|
7296
7300
|
background-color: var(--cds-border-subtle-02, #e0e0e0);
|
7297
7301
|
content: "";
|
7298
|
-
opacity: var(--c4p--side-panel--
|
7302
|
+
opacity: var(--c4p--side-panel--scroll-animation-progress);
|
7303
|
+
z-index: 9;
|
7304
|
+
}
|
7305
|
+
.c4p--side-panel__container .c4p--side-panel__header.c4p--side-panel__header--no-title-animation {
|
7306
|
+
position: relative;
|
7307
|
+
top: 0;
|
7299
7308
|
}
|
7300
|
-
.c4p--side-panel__container .c4p--side-
|
7309
|
+
.c4p--side-panel__container .c4p--side-panel__header.c4p--side-panel__header--no-title-animation::before {
|
7310
|
+
opacity: 1;
|
7311
|
+
}
|
7312
|
+
.c4p--side-panel__container .c4p--side-panel__header.c4p--side-panel__header--reduced-motion {
|
7301
7313
|
z-index: 5;
|
7302
7314
|
border-bottom: 1px solid var(--cds-border-subtle-02, #e0e0e0);
|
7303
7315
|
margin-bottom: 1rem;
|
7304
7316
|
}
|
7305
|
-
.c4p--side-panel__container .c4p--side-
|
7317
|
+
.c4p--side-panel__container .c4p--side-panel__header.c4p--side-panel__header--reduced-motion.c4p--side-panel__header--no-title-animation {
|
7306
7318
|
border-bottom: 0;
|
7307
7319
|
margin-bottom: 0;
|
7308
7320
|
}
|
7309
|
-
.c4p--side-panel__container .c4p--side-
|
7310
|
-
top:
|
7311
|
-
}
|
7312
|
-
.c4p--side-panel__container .c4p--side-panel__title-container.c4p--side-panel__on-detail-step .c4p--side-panel__navigation-back-button.cds--btn--md ~ .c4p--side-panel__collapsed-title-text {
|
7313
|
-
top: 2.5rem;
|
7321
|
+
.c4p--side-panel__container .c4p--side-panel__header.c4p--side-panel--on-detail-step .c4p--side-panel__collapsed-title-text {
|
7322
|
+
top: 1rem;
|
7314
7323
|
}
|
7315
|
-
.c4p--side-panel__container .c4p--side-
|
7316
|
-
|
7324
|
+
.c4p--side-panel__container .c4p--side-panel__header.c4p--side-panel--on-detail-step .c4p--side-panel__navigation-back-button.cds--btn--md ~ .c4p--side-panel__collapsed-title-text {
|
7325
|
+
top: 1.5rem;
|
7317
7326
|
}
|
7318
|
-
.c4p--side-panel__container .c4p--side-
|
7327
|
+
.c4p--side-panel__container .c4p--side-panel__header.c4p--side-panel--on-detail-step:not(:has(.c4p--side-panel__title-text)) {
|
7319
7328
|
height: calc(2.5rem + 0.25rem);
|
7320
7329
|
padding: 1rem 1rem 0.5rem 1rem;
|
7321
7330
|
}
|
7322
|
-
.c4p--side-panel__container .c4p--side-panel__title-
|
7331
|
+
.c4p--side-panel__container .c4p--side-panel__header:not(:has(.c4p--side-panel__title-text))::before, .c4p--side-panel__container .c4p--side-panel__header.c4p--side-panel__header--has-no-title::before {
|
7323
7332
|
background-color: transparent;
|
7324
7333
|
}
|
7325
|
-
.c4p--side-panel__container.c4p--side-panel__container--has-slug {
|
7326
|
-
--c4p--side-panel--title-padding-right:
|
7327
|
-
}
|
7328
|
-
.c4p--side-panel__container.c4p--side-panel__container-is-animating {
|
7329
|
-
pointer-events: none;
|
7334
|
+
.c4p--side-panel__container.c4p--side-panel__container:has(.c4p--side-panel__action-toolbar), .c4p--side-panel__container.c4p--side-panel__container--has-action-toolbar, .c4p--side-panel__container.c4p--side-panel__container--has-slug {
|
7335
|
+
--c4p--side-panel--title-padding-right: 4rem;
|
7330
7336
|
}
|
7331
|
-
.c4p--side-panel__container.c4p--side-panel__container-
|
7332
|
-
|
7337
|
+
.c4p--side-panel__container.c4p--side-panel__container:has(.c4p--side-panel__action-toolbar).c4p--side-panel__container--has-slug, .c4p--side-panel__container.c4p--side-panel__container--has-action-toolbar.c4p--side-panel__container--has-slug {
|
7338
|
+
--c4p--side-panel--title-padding-right: 5rem;
|
7333
7339
|
}
|
7334
|
-
.c4p--side-panel__container
|
7335
|
-
|
7340
|
+
.c4p--side-panel__container .c4p--side-panel__animated-scroll-wrapper {
|
7341
|
+
display: grid;
|
7342
|
+
grid-template-rows: auto 1fr;
|
7336
7343
|
}
|
7337
|
-
.c4p--side-panel__container
|
7338
|
-
|
7344
|
+
.c4p--side-panel__container .c4p--side-panel__title {
|
7345
|
+
position: sticky;
|
7346
|
+
z-index: 4;
|
7347
|
+
/* stylelint-disable-next-line carbon/layout-token-use */
|
7348
|
+
top: var(--c4p--side-panel--title-stop);
|
7349
|
+
/* border-bottom used instead of padding which wrapped text shows through */
|
7350
|
+
border-bottom: var(--c4p--side-panel--title-padding-bottom) solid transparent;
|
7351
|
+
background-color: var(--cds-layer-01, #f4f4f4);
|
7339
7352
|
}
|
7340
7353
|
.c4p--side-panel__container .c4p--side-panel__title-text {
|
7341
7354
|
font-size: var(--cds-heading-03-font-size, 1.25rem);
|
@@ -7348,12 +7361,14 @@ a.cds--overflow-menu-options__btn::before {
|
|
7348
7361
|
padding-right: var(--c4p--side-panel--title-padding-right);
|
7349
7362
|
-webkit-box-orient: vertical;
|
7350
7363
|
-webkit-line-clamp: 2;
|
7351
|
-
|
7352
|
-
|
7353
|
-
|
7354
|
-
|
7355
|
-
|
7356
|
-
|
7364
|
+
opacity: calc(1 - var(--c4p--side-panel--scroll-animation-progress));
|
7365
|
+
}
|
7366
|
+
.c4p--side-panel__container .c4p--side-panel__title--no-label .c4p--side-panel__title-text {
|
7367
|
+
/* stylelint-disable-next-line carbon/layout-token-use */
|
7368
|
+
transform: translateY(calc(-1 * 1rem * var(--c4p--side-panel--scroll-animation-progress)));
|
7369
|
+
}
|
7370
|
+
.c4p--side-panel__container .c4p--side-panel__header--no-title-animation .c4p--side-panel__title-text {
|
7371
|
+
position: static;
|
7357
7372
|
}
|
7358
7373
|
.c4p--side-panel__container .c4p--side-panel__label-text {
|
7359
7374
|
font-size: var(--cds-label-01-font-size, 0.75rem);
|
@@ -7362,9 +7377,8 @@ a.cds--overflow-menu-options__btn::before {
|
|
7362
7377
|
letter-spacing: var(--cds-label-01-letter-spacing, 0.32px);
|
7363
7378
|
overflow: hidden;
|
7364
7379
|
padding-right: var(--c4p--side-panel--title-padding-right);
|
7365
|
-
opacity: var(--c4p--side-panel--
|
7380
|
+
opacity: calc(1 - var(--c4p--side-panel--scroll-animation-progress));
|
7366
7381
|
text-overflow: ellipsis;
|
7367
|
-
transform: translateY(var(--c4p--side-panel--title-y-position));
|
7368
7382
|
white-space: nowrap;
|
7369
7383
|
}
|
7370
7384
|
.c4p--side-panel__container .c4p--side-panel__collapsed-title-text {
|
@@ -7379,9 +7393,13 @@ a.cds--overflow-menu-options__btn::before {
|
|
7379
7393
|
-webkit-box-orient: vertical;
|
7380
7394
|
-webkit-line-clamp: 2;
|
7381
7395
|
position: absolute;
|
7382
|
-
|
7383
|
-
|
7384
|
-
|
7396
|
+
/* stylelint-disable-next-line carbon/layout-token-use */
|
7397
|
+
top: 0;
|
7398
|
+
opacity: var(--c4p--side-panel--scroll-animation-progress);
|
7399
|
+
}
|
7400
|
+
.c4p--side-panel__container .c4p--side-panel__title--no-label .c4p--side-panel__collapsed-title-text {
|
7401
|
+
/* stylelint-disable-next-line carbon/layout-token-use */
|
7402
|
+
transform: translateY(calc(1rem * (1 - var(--c4p--side-panel--scroll-animation-progress))));
|
7385
7403
|
}
|
7386
7404
|
.c4p--side-panel__container .c4p--side-panel__subtitle-text {
|
7387
7405
|
font-size: var(--cds-body-compact-01-font-size, 0.875rem);
|
@@ -7389,75 +7407,41 @@ a.cds--overflow-menu-options__btn::before {
|
|
7389
7407
|
line-height: var(--cds-body-compact-01-line-height, 1.28572);
|
7390
7408
|
letter-spacing: var(--cds-body-compact-01-letter-spacing, 0.16px);
|
7391
7409
|
overflow: hidden;
|
7392
|
-
padding:
|
7410
|
+
padding-right: var(--c4p--side-panel--title-padding-right);
|
7411
|
+
padding-bottom: 1rem;
|
7393
7412
|
-webkit-box-orient: vertical;
|
7394
7413
|
-webkit-line-clamp: 3;
|
7395
|
-
opacity: var(--c4p--side-panel--
|
7414
|
+
opacity: calc(1 - var(--c4p--side-panel--scroll-animation-progress));
|
7396
7415
|
}
|
7397
|
-
.c4p--side-panel__container .c4p--side-
|
7398
|
-
position: fixed;
|
7416
|
+
.c4p--side-panel__container .c4p--side-panel__header--no-title-animation .c4p--side-panel__subtitle-text {
|
7399
7417
|
z-index: 2;
|
7400
|
-
top: calc(var(--c4p--side-panel--title-text-height) + var(--c4p--side-panel--label-text-height));
|
7401
7418
|
background-color: var(--cds-layer-01, #f4f4f4);
|
7402
7419
|
}
|
7403
|
-
.c4p--side-panel__container .c4p--side-
|
7404
|
-
top: var(--c4p--side-panel--title-text-height);
|
7405
|
-
}
|
7406
|
-
.c4p--side-panel__container .c4p--side-panel__subtitle-text.c4p--side-panel__subtitle-without-title {
|
7420
|
+
.c4p--side-panel__container .c4p--side-panel__title-text + .c4p--side-panel__subtitle-text {
|
7407
7421
|
padding-top: 1rem;
|
7408
|
-
padding-right: 3rem;
|
7409
|
-
}
|
7410
|
-
.c4p--side-panel__container .c4p--side-panel__title-container.c4p--side-panel__title-container--no-title-animation.c4p--side-panel__title-container-is-animating {
|
7411
|
-
top: 0;
|
7412
|
-
}
|
7413
|
-
.c4p--side-panel__container .c4p--side-panel__title-container.c4p--side-panel__title-container--no-title-animation {
|
7414
|
-
position: fixed;
|
7415
|
-
height: calc(var(--c4p--side-panel--title-text-height) + var(--c4p--side-panel--label-text-height));
|
7416
7422
|
}
|
7417
7423
|
.c4p--side-panel__container .c4p--side-panel__inner-content {
|
7418
|
-
|
7419
|
-
|
7420
|
-
margin-top: calc(var(--c4p--side-panel--title-text-height) + var(--c4p--side-panel--subtitle-container-height) + var(--c4p--side-panel--action-bar-container-height) + var(--c4p--side-panel--label-text-height));
|
7421
|
-
overflow-x: hidden;
|
7424
|
+
padding: 1rem;
|
7425
|
+
padding-top: 0;
|
7422
7426
|
}
|
7423
|
-
.c4p--side-panel__container.c4p--side-
|
7424
|
-
|
7427
|
+
.c4p--side-panel__container .c4p--side-panel__header:has(.c4p--side-panel__action-toolbar) + .c4p--side-panel__inner-content,
|
7428
|
+
.c4p--side-panel__container .c4p--side-panel__header--has-action-toolbar + .c4p--side-panel__inner-content {
|
7429
|
+
padding-top: 0.5rem;
|
7425
7430
|
}
|
7426
|
-
.c4p--side-panel__container .c4p--side-panel__inner-content
|
7427
|
-
|
7431
|
+
.c4p--side-panel__container.c4p--side-panel__container--has-slug .c4p--side-panel__inner-content {
|
7432
|
+
background-image: linear-gradient(0deg, var(--cds-ai-inner-shadow, rgba(69, 137, 255, 0.2)) 0%, 15%, var(--cds-ai-aura-end, rgba(255, 255, 255, 0)) 50%, transparent 100%);
|
7433
|
+
border-block-end-color: var(--cds-ai-border-strong, #4589ff);
|
7428
7434
|
}
|
7429
|
-
.c4p--side-panel__container .c4p--side-panel__inner-content.c4p--side-
|
7430
|
-
height: calc(100vh - (var(--c4p--side-panel--title-text-height) + var(--c4p--side-panel--subtitle-container-height) + var(--c4p--side-panel--action-bar-container-height)) + -1 * (3rem + 4rem));
|
7435
|
+
.c4p--side-panel__container .c4p--side-panel__inner-content.c4p--side-panel__inner-content--static {
|
7431
7436
|
padding-top: 1rem;
|
7432
7437
|
}
|
7433
|
-
.c4p--side-panel__container .c4p--side-panel__inner-content.c4p--side-panel__static-inner-content-no-actions {
|
7434
|
-
height: calc(100vh - (var(--c4p--side-panel--title-text-height) + var(--c4p--side-panel--subtitle-container-height) + var(--c4p--side-panel--action-bar-container-height) + var(--c4p--side-panel--label-text-height)));
|
7435
|
-
}
|
7436
|
-
.c4p--side-panel__container .c4p--side-panel__action-toolbar.c4p--side-panel__action-toolbar-no-animation {
|
7437
|
-
position: fixed;
|
7438
|
-
top: calc(var(--c4p--side-panel--title-text-height) + var(--c4p--side-panel--subtitle-container-height));
|
7439
|
-
width: 100%;
|
7440
|
-
border-bottom: 1px solid var(--cds-layer-active-01, #c6c6c6);
|
7441
|
-
}
|
7442
|
-
.c4p--side-panel__container .c4p--side-panel__action-toolbar.c4p--side-panel__action-toolbar-no-animation + .c4p--side-panel__body-content {
|
7443
|
-
margin-top: calc(var(--c4p--side-panel--title-text-height) + var(--c4p--side-panel--subtitle-container-height) + 3rem);
|
7444
|
-
}
|
7445
|
-
.c4p--side-panel__container .c4p--side-panel__subtitle-text.c4p--side-panel__subtitle-text-no-animation.c4p--side-panel__subtitle-text-no-animation-no-action-toolbar {
|
7446
|
-
border-bottom: 1px solid var(--cds-layer-active-01, #c6c6c6);
|
7447
|
-
margin-bottom: 1rem;
|
7448
|
-
}
|
7449
7438
|
.c4p--side-panel__container .c4p--side-panel__action-toolbar {
|
7450
7439
|
position: sticky;
|
7451
7440
|
z-index: 4;
|
7452
|
-
/* stylelint-disable-next-line carbon/layout-token-use */
|
7453
|
-
top: var(--c4p--side-panel--title-height);
|
7454
7441
|
display: flex;
|
7455
7442
|
align-items: center;
|
7456
7443
|
justify-content: flex-start;
|
7457
|
-
padding: 0 1rem;
|
7458
|
-
margin-bottom: 0.5rem;
|
7459
7444
|
background-color: var(--cds-layer-01, #f4f4f4);
|
7460
|
-
transition: transform 150ms cubic-bezier(0.2, 0, 0.38, 0.9);
|
7461
7445
|
}
|
7462
7446
|
.c4p--side-panel__container .c4p--side-panel__action-toolbar-leading-button {
|
7463
7447
|
margin-right: 0.5rem;
|
@@ -7489,21 +7473,13 @@ a.cds--overflow-menu-options__btn::before {
|
|
7489
7473
|
}
|
7490
7474
|
.c4p--side-panel__container .c4p--side-panel__slug-and-close {
|
7491
7475
|
position: fixed;
|
7492
|
-
z-index:
|
7476
|
+
z-index: 10; /* must be higher than title container border bottom */
|
7493
7477
|
top: 0;
|
7494
7478
|
right: 0;
|
7495
7479
|
display: flex;
|
7496
7480
|
}
|
7497
|
-
.c4p--side-panel__container .c4p--side-panel__body-content {
|
7498
|
-
padding: 1rem;
|
7499
|
-
padding-top: 0;
|
7500
|
-
}
|
7501
|
-
.c4p--side-panel__container.c4p--side-panel__container-is-animating .c4p--side-panel__actions-container.c4p--action-set--2xl {
|
7502
|
-
width: 100%;
|
7503
|
-
max-width: 100%;
|
7504
|
-
}
|
7505
7481
|
.c4p--side-panel__container .c4p--side-panel__actions-container {
|
7506
|
-
position:
|
7482
|
+
position: sticky;
|
7507
7483
|
bottom: 0;
|
7508
7484
|
border-top: 1px solid var(--cds-border-subtle-02, #e0e0e0);
|
7509
7485
|
background-color: var(--cds-layer-01, #f4f4f4);
|
@@ -7523,13 +7499,11 @@ a.cds--overflow-menu-options__btn::before {
|
|
7523
7499
|
width: 25%;
|
7524
7500
|
}
|
7525
7501
|
}
|
7526
|
-
.c4p--side-panel__container .c4p--side-panel__actions-container .c4p--action-set__action-button {
|
7527
|
-
height:
|
7528
|
-
}
|
7529
|
-
.c4p--side-panel__container .c4p--side-panel__actions-container.c4p--side-panel__actions-container-condensed .c4p--action-set__action-button {
|
7530
|
-
height: 3rem;
|
7502
|
+
.c4p--side-panel__container .c4p--side-panel__actions-container .c4p--action-set__action-button.c4p--action-set__action-button {
|
7503
|
+
height: var(--c4p--side-panel--actions-height);
|
7531
7504
|
}
|
7532
7505
|
.c4p--side-panel__container.c4p--side-panel__container.c4p--side-panel__container--xs .c4p--side-panel__actions-container.c4p--action-set--sm {
|
7506
|
+
/* any value is single value list */
|
7533
7507
|
width: 16rem;
|
7534
7508
|
max-width: 100%;
|
7535
7509
|
}
|
@@ -7587,76 +7561,6 @@ a.cds--overflow-menu-options__btn::before {
|
|
7587
7561
|
padding-right: calc(20% - 1rem);
|
7588
7562
|
}
|
7589
7563
|
|
7590
|
-
.c4p--create-side-panel.c4p--side-panel__container--xs .c4p--side-panel__title-text {
|
7591
|
-
width: calc(16rem - 1rem);
|
7592
|
-
padding-right: calc(16rem * 0.2 - 1rem);
|
7593
|
-
margin-bottom: 0.25rem;
|
7594
|
-
}
|
7595
|
-
|
7596
|
-
.c4p--create-side-panel.c4p--side-panel__container--xs .c4p--side-panel__subtitle-text {
|
7597
|
-
width: calc(16rem - 1rem);
|
7598
|
-
padding-right: calc(16rem * 0.2 - 1rem);
|
7599
|
-
padding-bottom: 1rem;
|
7600
|
-
border-bottom: 1px solid var(--cds-layer-accent-01, #e0e0e0);
|
7601
|
-
color: var(--cds-text-secondary, #525252);
|
7602
|
-
}
|
7603
|
-
|
7604
|
-
.c4p--create-side-panel.c4p--side-panel__container--sm .c4p--side-panel__title-text {
|
7605
|
-
width: calc(20rem - 1rem);
|
7606
|
-
padding-right: calc(20rem * 0.2 - 1rem);
|
7607
|
-
margin-bottom: 0.25rem;
|
7608
|
-
}
|
7609
|
-
|
7610
|
-
.c4p--create-side-panel.c4p--side-panel__container--sm .c4p--side-panel__subtitle-text {
|
7611
|
-
width: calc(20rem - 1rem);
|
7612
|
-
padding-right: calc(20rem * 0.2 - 1rem);
|
7613
|
-
padding-bottom: 1rem;
|
7614
|
-
border-bottom: 1px solid var(--cds-layer-accent-01, #e0e0e0);
|
7615
|
-
color: var(--cds-text-secondary, #525252);
|
7616
|
-
}
|
7617
|
-
|
7618
|
-
.c4p--create-side-panel.c4p--side-panel__container--md .c4p--side-panel__title-text {
|
7619
|
-
width: calc(30rem - 1rem);
|
7620
|
-
padding-right: calc(30rem * 0.2 - 1rem);
|
7621
|
-
margin-bottom: 0.25rem;
|
7622
|
-
}
|
7623
|
-
|
7624
|
-
.c4p--create-side-panel.c4p--side-panel__container--md .c4p--side-panel__subtitle-text {
|
7625
|
-
width: calc(30rem - 1rem);
|
7626
|
-
padding-right: calc(30rem * 0.2 - 1rem);
|
7627
|
-
padding-bottom: 1rem;
|
7628
|
-
border-bottom: 1px solid var(--cds-layer-accent-01, #e0e0e0);
|
7629
|
-
color: var(--cds-text-secondary, #525252);
|
7630
|
-
}
|
7631
|
-
|
7632
|
-
.c4p--create-side-panel.c4p--side-panel__container--lg .c4p--side-panel__title-text {
|
7633
|
-
width: calc(40rem - 1rem);
|
7634
|
-
padding-right: calc(40rem * 0.2 - 1rem);
|
7635
|
-
margin-bottom: 0.25rem;
|
7636
|
-
}
|
7637
|
-
|
7638
|
-
.c4p--create-side-panel.c4p--side-panel__container--lg .c4p--side-panel__subtitle-text {
|
7639
|
-
width: calc(40rem - 1rem);
|
7640
|
-
padding-right: calc(40rem * 0.2 - 1rem);
|
7641
|
-
padding-bottom: 1rem;
|
7642
|
-
border-bottom: 1px solid var(--cds-layer-accent-01, #e0e0e0);
|
7643
|
-
color: var(--cds-text-secondary, #525252);
|
7644
|
-
}
|
7645
|
-
|
7646
|
-
.c4p--create-side-panel.c4p--side-panel__container--2xl .c4p--side-panel__title-text {
|
7647
|
-
width: calc(75% - 1rem);
|
7648
|
-
padding-right: calc(75% * 0.2 - 1rem);
|
7649
|
-
margin-bottom: 0.25rem;
|
7650
|
-
}
|
7651
|
-
|
7652
|
-
.c4p--create-side-panel.c4p--side-panel__container--2xl .c4p--side-panel__subtitle-text {
|
7653
|
-
width: calc(75% - 1rem);
|
7654
|
-
padding-right: calc(75% * 0.2 - 1rem);
|
7655
|
-
padding-bottom: 1rem;
|
7656
|
-
border-bottom: 1px solid var(--cds-layer-accent-01, #e0e0e0);
|
7657
|
-
color: var(--cds-text-secondary, #525252);
|
7658
|
-
}
|
7659
|
-
|
7660
7564
|
.cds--form.c4p--create-side-panel__form {
|
7661
7565
|
padding-top: 1rem;
|
7662
7566
|
}
|
@@ -7688,32 +7592,10 @@ a.cds--overflow-menu-options__btn::before {
|
|
7688
7592
|
display: none;
|
7689
7593
|
}
|
7690
7594
|
|
7691
|
-
.c4p--create-side-
|
7692
|
-
font-size: var(--cds-heading-03-font-size, 1.25rem);
|
7693
|
-
font-weight: var(--cds-heading-03-font-weight, 400);
|
7694
|
-
line-height: var(--cds-heading-03-line-height, 1.4);
|
7695
|
-
letter-spacing: var(--cds-heading-03-letter-spacing, 0);
|
7696
|
-
margin-bottom: 0.25rem;
|
7697
|
-
}
|
7698
|
-
|
7699
|
-
.c4p--create-side-panel__subtitle {
|
7700
|
-
font-size: var(--cds-body-compact-01-font-size, 0.875rem);
|
7701
|
-
font-weight: var(--cds-body-compact-01-font-weight, 400);
|
7702
|
-
line-height: var(--cds-body-compact-01-line-height, 1.28572);
|
7703
|
-
letter-spacing: var(--cds-body-compact-01-letter-spacing, 0.16px);
|
7704
|
-
margin-bottom: 0.5rem;
|
7595
|
+
.c4p--create-side-panel .c4p--side-panel__subtitle-text {
|
7705
7596
|
color: var(--cds-text-secondary, #525252);
|
7706
7597
|
}
|
7707
7598
|
|
7708
|
-
.c4p--side-panel .c4p--create-side-panel__actions-container {
|
7709
|
-
position: absolute;
|
7710
|
-
z-index: 4;
|
7711
|
-
right: 0;
|
7712
|
-
bottom: 0;
|
7713
|
-
width: 100%;
|
7714
|
-
margin-bottom: 0;
|
7715
|
-
}
|
7716
|
-
|
7717
7599
|
.c4p--tearsheet.c4p--tearsheet {
|
7718
7600
|
z-index: 9001;
|
7719
7601
|
align-items: flex-end;
|
@@ -8352,6 +8234,7 @@ a.cds--overflow-menu-options__btn::before {
|
|
8352
8234
|
font-weight: var(--cds-body-compact-01-font-weight, 400);
|
8353
8235
|
line-height: var(--cds-body-compact-01-line-height, 1.28572);
|
8354
8236
|
letter-spacing: var(--cds-body-compact-01-letter-spacing, 0.16px);
|
8237
|
+
flex: 1;
|
8355
8238
|
}
|
8356
8239
|
|
8357
8240
|
.cds--radio-button__appearance {
|
@@ -8734,7 +8617,7 @@ a.cds--overflow-menu-options__btn::before {
|
|
8734
8617
|
}
|
8735
8618
|
|
8736
8619
|
.c4p--card .cds--slug {
|
8737
|
-
background: linear-gradient(
|
8620
|
+
background: linear-gradient(to top, var(--cds-ai-aura-start, rgba(69, 137, 255, 0.1)) 0%, var(--cds-ai-aura-end, rgba(255, 255, 255, 0)) 50%) padding-box, linear-gradient(to top, var(--cds-background, #ffffff), var(--cds-background, #ffffff)) padding-box, linear-gradient(to bottom, var(--cds-ai-border-start, #78a9ff), var(--cds-ai-border-end, #d0e2ff)) border-box, linear-gradient(to top, var(--cds-background, #ffffff), var(--cds-background, #ffffff)) border-box;
|
8738
8621
|
position: absolute;
|
8739
8622
|
top: 1rem;
|
8740
8623
|
right: 1rem;
|
@@ -8763,7 +8646,7 @@ a.cds--overflow-menu-options__btn::before {
|
|
8763
8646
|
}
|
8764
8647
|
|
8765
8648
|
.c4p--card--has-slug {
|
8766
|
-
background: linear-gradient(
|
8649
|
+
background: linear-gradient(to top, var(--cds-ai-aura-start, rgba(69, 137, 255, 0.1)) 0%, var(--cds-ai-aura-end, rgba(255, 255, 255, 0)) 50%) padding-box, linear-gradient(to top, var(--cds-background, #ffffff), var(--cds-background, #ffffff)) padding-box, linear-gradient(to bottom, var(--cds-ai-border-start, #78a9ff), var(--cds-ai-border-end, #d0e2ff)) border-box, linear-gradient(to top, var(--cds-background, #ffffff), var(--cds-background, #ffffff)) border-box;
|
8767
8650
|
border: 1px solid var(--cds-border-tile);
|
8768
8651
|
}
|
8769
8652
|
|
@@ -9807,9 +9690,16 @@ button.c4p--add-select__global-filter-toggle--open {
|
|
9807
9690
|
}
|
9808
9691
|
}
|
9809
9692
|
.c4p--notifications-panel__container {
|
9693
|
+
--cds-ai-aura-end: rgba(0, 0, 0, 0);
|
9694
|
+
--cds-ai-aura-start: rgba(69, 137, 255, 0.1);
|
9695
|
+
--cds-ai-border-end: rgba(166, 200, 255, 0.24);
|
9696
|
+
--cds-ai-border-start: #4589ff;
|
9697
|
+
--cds-ai-border-strong: #78a9ff;
|
9698
|
+
--cds-ai-drop-shadow: rgba(15, 98, 254, 0.32);
|
9810
9699
|
--cds-ai-gradient-end: rgba(38, 38, 38, 0);
|
9811
9700
|
--cds-ai-gradient-start-01: rgba(208, 226, 255, 0.2);
|
9812
9701
|
--cds-ai-gradient-start-02: transparent;
|
9702
|
+
--cds-ai-inner-shadow: rgba(69, 137, 255, 0.2);
|
9813
9703
|
--cds-background: #161616;
|
9814
9704
|
--cds-background-active: rgba(141, 141, 141, 0.4);
|
9815
9705
|
--cds-background-brand: #0f62fe;
|
@@ -9825,11 +9715,11 @@ button.c4p--add-select__global-filter-toggle--open {
|
|
9825
9715
|
--cds-border-strong-02: #8d8d8d;
|
9826
9716
|
--cds-border-strong-03: #a8a8a8;
|
9827
9717
|
--cds-border-subtle-00: #393939;
|
9828
|
-
--cds-border-subtle-01: #
|
9829
|
-
--cds-border-subtle-02: #
|
9718
|
+
--cds-border-subtle-01: #525252;
|
9719
|
+
--cds-border-subtle-02: #6f6f6f;
|
9830
9720
|
--cds-border-subtle-03: #6f6f6f;
|
9831
|
-
--cds-border-subtle-selected-01: #
|
9832
|
-
--cds-border-subtle-selected-02: #
|
9721
|
+
--cds-border-subtle-selected-01: #6f6f6f;
|
9722
|
+
--cds-border-subtle-selected-02: #8d8d8d;
|
9833
9723
|
--cds-border-subtle-selected-03: #8d8d8d;
|
9834
9724
|
--cds-border-tile-01: #525252;
|
9835
9725
|
--cds-border-tile-02: #6f6f6f;
|
@@ -9891,20 +9781,26 @@ button.c4p--add-select__global-filter-toggle--open {
|
|
9891
9781
|
--cds-skeleton-element: #393939;
|
9892
9782
|
--cds-slug-background: #c6c6c6;
|
9893
9783
|
--cds-slug-background-hover: #e0e0e0;
|
9894
|
-
--cds-slug-callout-aura-end: rgba(
|
9784
|
+
--cds-slug-callout-aura-end: rgba(0, 0, 0, 0);
|
9895
9785
|
--cds-slug-callout-aura-end-hover-01: rgba(22, 22, 22, 0);
|
9896
9786
|
--cds-slug-callout-aura-end-hover-02: transparent;
|
9897
9787
|
--cds-slug-callout-aura-end-selected: rgba(22, 22, 22, 0);
|
9898
|
-
--cds-slug-callout-aura-start: rgba(
|
9788
|
+
--cds-slug-callout-aura-start: rgba(69, 137, 255, 0.1);
|
9899
9789
|
--cds-slug-callout-aura-start-hover-01: rgba(184, 211, 255, 0.3);
|
9900
9790
|
--cds-slug-callout-aura-start-hover-02: transparent;
|
9901
9791
|
--cds-slug-callout-aura-start-selected: rgba(208, 226, 255, 0.2);
|
9792
|
+
--cds-slug-callout-caret-bottom: #3d4655;
|
9793
|
+
--cds-slug-callout-caret-bottom-background: #213250;
|
9794
|
+
--cds-slug-callout-caret-bottom-background-actions: #192436;
|
9795
|
+
--cds-slug-callout-caret-center: #3f68af;
|
9902
9796
|
--cds-slug-callout-gradient-bottom: rgba(38, 38, 38, 0.85);
|
9903
9797
|
--cds-slug-callout-gradient-bottom-hover: rgba(71, 71, 71, 0.55);
|
9904
9798
|
--cds-slug-callout-gradient-bottom-selected: rgba(71, 71, 71, 0.85);
|
9905
9799
|
--cds-slug-callout-gradient-top: rgba(22, 22, 22, 0.85);
|
9906
9800
|
--cds-slug-callout-gradient-top-hover: rgba(57, 57, 57, 0.55);
|
9907
9801
|
--cds-slug-callout-gradient-top-selected: rgba(57, 57, 57, 0.85);
|
9802
|
+
--cds-slug-callout-shadow-outer-01: rgba(0, 45, 156, 0.25);
|
9803
|
+
--cds-slug-callout-shadow-outer-02: rgba(0, 0, 0, 0.65);
|
9908
9804
|
--cds-slug-gradient: #8d8d8d linear-gradient(135deg, #f4f4f4 0%, rgba(255, 255, 255, 0) 100%);
|
9909
9805
|
--cds-slug-gradient-hover: #a8a8a8 linear-gradient(135deg, #ffffff 0%, rgba(255, 255, 255, 0) 100%);
|
9910
9806
|
--cds-slug-hollow-hover: #b5b5b5;
|
@@ -14504,9 +14400,16 @@ button.c4p--add-select__global-filter-toggle--open {
|
|
14504
14400
|
despite of which carbon theme the user has.
|
14505
14401
|
*/
|
14506
14402
|
.c4p--web-terminal {
|
14403
|
+
--cds-ai-aura-end: rgba(0, 0, 0, 0);
|
14404
|
+
--cds-ai-aura-start: rgba(69, 137, 255, 0.1);
|
14405
|
+
--cds-ai-border-end: rgba(166, 200, 255, 0.24);
|
14406
|
+
--cds-ai-border-start: #4589ff;
|
14407
|
+
--cds-ai-border-strong: #78a9ff;
|
14408
|
+
--cds-ai-drop-shadow: rgba(15, 98, 254, 0.32);
|
14507
14409
|
--cds-ai-gradient-end: rgba(38, 38, 38, 0);
|
14508
14410
|
--cds-ai-gradient-start-01: rgba(208, 226, 255, 0.2);
|
14509
14411
|
--cds-ai-gradient-start-02: transparent;
|
14412
|
+
--cds-ai-inner-shadow: rgba(69, 137, 255, 0.2);
|
14510
14413
|
--cds-background: #262626;
|
14511
14414
|
--cds-background-active: rgba(141, 141, 141, 0.4);
|
14512
14415
|
--cds-background-brand: #0f62fe;
|
@@ -14522,11 +14425,11 @@ button.c4p--add-select__global-filter-toggle--open {
|
|
14522
14425
|
--cds-border-strong-02: #a8a8a8;
|
14523
14426
|
--cds-border-strong-03: #c6c6c6;
|
14524
14427
|
--cds-border-subtle-00: #525252;
|
14525
|
-
--cds-border-subtle-01: #
|
14526
|
-
--cds-border-subtle-02: #
|
14428
|
+
--cds-border-subtle-01: #6f6f6f;
|
14429
|
+
--cds-border-subtle-02: #8d8d8d;
|
14527
14430
|
--cds-border-subtle-03: #8d8d8d;
|
14528
|
-
--cds-border-subtle-selected-01: #
|
14529
|
-
--cds-border-subtle-selected-02: #
|
14431
|
+
--cds-border-subtle-selected-01: #8d8d8d;
|
14432
|
+
--cds-border-subtle-selected-02: #a8a8a8;
|
14530
14433
|
--cds-border-subtle-selected-03: #a8a8a8;
|
14531
14434
|
--cds-border-tile-01: #6f6f6f;
|
14532
14435
|
--cds-border-tile-02: #8d8d8d;
|
@@ -14588,20 +14491,26 @@ button.c4p--add-select__global-filter-toggle--open {
|
|
14588
14491
|
--cds-skeleton-element: #525252;
|
14589
14492
|
--cds-slug-background: #c6c6c6;
|
14590
14493
|
--cds-slug-background-hover: #e0e0e0;
|
14591
|
-
--cds-slug-callout-aura-end: rgba(
|
14494
|
+
--cds-slug-callout-aura-end: rgba(0, 0, 0, 0);
|
14592
14495
|
--cds-slug-callout-aura-end-hover-01: rgba(22, 22, 22, 0);
|
14593
14496
|
--cds-slug-callout-aura-end-hover-02: transparent;
|
14594
14497
|
--cds-slug-callout-aura-end-selected: rgba(22, 22, 22, 0);
|
14595
|
-
--cds-slug-callout-aura-start: rgba(
|
14498
|
+
--cds-slug-callout-aura-start: rgba(69, 137, 255, 0.1);
|
14596
14499
|
--cds-slug-callout-aura-start-hover-01: rgba(184, 211, 255, 0.3);
|
14597
14500
|
--cds-slug-callout-aura-start-hover-02: transparent;
|
14598
14501
|
--cds-slug-callout-aura-start-selected: rgba(208, 226, 255, 0.2);
|
14502
|
+
--cds-slug-callout-caret-bottom: #465060;
|
14503
|
+
--cds-slug-callout-caret-bottom-background: #2d3f5c;
|
14504
|
+
--cds-slug-callout-caret-bottom-background-actions: #253042;
|
14505
|
+
--cds-slug-callout-caret-center: #456fb5;
|
14599
14506
|
--cds-slug-callout-gradient-bottom: rgba(38, 38, 38, 0.85);
|
14600
14507
|
--cds-slug-callout-gradient-bottom-hover: rgba(71, 71, 71, 0.55);
|
14601
14508
|
--cds-slug-callout-gradient-bottom-selected: rgba(71, 71, 71, 0.85);
|
14602
14509
|
--cds-slug-callout-gradient-top: rgba(22, 22, 22, 0.85);
|
14603
14510
|
--cds-slug-callout-gradient-top-hover: rgba(57, 57, 57, 0.55);
|
14604
14511
|
--cds-slug-callout-gradient-top-selected: rgba(57, 57, 57, 0.85);
|
14512
|
+
--cds-slug-callout-shadow-outer-01: rgba(0, 45, 156, 0.25);
|
14513
|
+
--cds-slug-callout-shadow-outer-02: rgba(0, 0, 0, 0.65);
|
14605
14514
|
--cds-slug-gradient: #8d8d8d linear-gradient(135deg, #f4f4f4 0%, rgba(255, 255, 255, 0) 100%);
|
14606
14515
|
--cds-slug-gradient-hover: #a8a8a8 linear-gradient(135deg, #ffffff 0%, rgba(255, 255, 255, 0) 100%);
|
14607
14516
|
--cds-slug-hollow-hover: #b5b5b5;
|
@@ -14963,9 +14872,16 @@ button.c4p--add-select__global-filter-toggle--open {
|
|
14963
14872
|
}
|
14964
14873
|
|
14965
14874
|
.c4p--web-terminal__documentation-overflow {
|
14875
|
+
--cds-ai-aura-end: rgba(0, 0, 0, 0);
|
14876
|
+
--cds-ai-aura-start: rgba(69, 137, 255, 0.1);
|
14877
|
+
--cds-ai-border-end: rgba(166, 200, 255, 0.24);
|
14878
|
+
--cds-ai-border-start: #4589ff;
|
14879
|
+
--cds-ai-border-strong: #78a9ff;
|
14880
|
+
--cds-ai-drop-shadow: rgba(15, 98, 254, 0.32);
|
14966
14881
|
--cds-ai-gradient-end: rgba(38, 38, 38, 0);
|
14967
14882
|
--cds-ai-gradient-start-01: rgba(208, 226, 255, 0.2);
|
14968
14883
|
--cds-ai-gradient-start-02: transparent;
|
14884
|
+
--cds-ai-inner-shadow: rgba(69, 137, 255, 0.2);
|
14969
14885
|
--cds-background: #161616;
|
14970
14886
|
--cds-background-active: rgba(141, 141, 141, 0.4);
|
14971
14887
|
--cds-background-brand: #0f62fe;
|
@@ -14981,11 +14897,11 @@ button.c4p--add-select__global-filter-toggle--open {
|
|
14981
14897
|
--cds-border-strong-02: #8d8d8d;
|
14982
14898
|
--cds-border-strong-03: #a8a8a8;
|
14983
14899
|
--cds-border-subtle-00: #393939;
|
14984
|
-
--cds-border-subtle-01: #
|
14985
|
-
--cds-border-subtle-02: #
|
14900
|
+
--cds-border-subtle-01: #525252;
|
14901
|
+
--cds-border-subtle-02: #6f6f6f;
|
14986
14902
|
--cds-border-subtle-03: #6f6f6f;
|
14987
|
-
--cds-border-subtle-selected-01: #
|
14988
|
-
--cds-border-subtle-selected-02: #
|
14903
|
+
--cds-border-subtle-selected-01: #6f6f6f;
|
14904
|
+
--cds-border-subtle-selected-02: #8d8d8d;
|
14989
14905
|
--cds-border-subtle-selected-03: #8d8d8d;
|
14990
14906
|
--cds-border-tile-01: #525252;
|
14991
14907
|
--cds-border-tile-02: #6f6f6f;
|
@@ -15047,20 +14963,26 @@ button.c4p--add-select__global-filter-toggle--open {
|
|
15047
14963
|
--cds-skeleton-element: #393939;
|
15048
14964
|
--cds-slug-background: #c6c6c6;
|
15049
14965
|
--cds-slug-background-hover: #e0e0e0;
|
15050
|
-
--cds-slug-callout-aura-end: rgba(
|
14966
|
+
--cds-slug-callout-aura-end: rgba(0, 0, 0, 0);
|
15051
14967
|
--cds-slug-callout-aura-end-hover-01: rgba(22, 22, 22, 0);
|
15052
14968
|
--cds-slug-callout-aura-end-hover-02: transparent;
|
15053
14969
|
--cds-slug-callout-aura-end-selected: rgba(22, 22, 22, 0);
|
15054
|
-
--cds-slug-callout-aura-start: rgba(
|
14970
|
+
--cds-slug-callout-aura-start: rgba(69, 137, 255, 0.1);
|
15055
14971
|
--cds-slug-callout-aura-start-hover-01: rgba(184, 211, 255, 0.3);
|
15056
14972
|
--cds-slug-callout-aura-start-hover-02: transparent;
|
15057
14973
|
--cds-slug-callout-aura-start-selected: rgba(208, 226, 255, 0.2);
|
14974
|
+
--cds-slug-callout-caret-bottom: #3d4655;
|
14975
|
+
--cds-slug-callout-caret-bottom-background: #213250;
|
14976
|
+
--cds-slug-callout-caret-bottom-background-actions: #192436;
|
14977
|
+
--cds-slug-callout-caret-center: #3f68af;
|
15058
14978
|
--cds-slug-callout-gradient-bottom: rgba(38, 38, 38, 0.85);
|
15059
14979
|
--cds-slug-callout-gradient-bottom-hover: rgba(71, 71, 71, 0.55);
|
15060
14980
|
--cds-slug-callout-gradient-bottom-selected: rgba(71, 71, 71, 0.85);
|
15061
14981
|
--cds-slug-callout-gradient-top: rgba(22, 22, 22, 0.85);
|
15062
14982
|
--cds-slug-callout-gradient-top-hover: rgba(57, 57, 57, 0.55);
|
15063
14983
|
--cds-slug-callout-gradient-top-selected: rgba(57, 57, 57, 0.85);
|
14984
|
+
--cds-slug-callout-shadow-outer-01: rgba(0, 45, 156, 0.25);
|
14985
|
+
--cds-slug-callout-shadow-outer-02: rgba(0, 0, 0, 0.65);
|
15064
14986
|
--cds-slug-gradient: #8d8d8d linear-gradient(135deg, #f4f4f4 0%, rgba(255, 255, 255, 0) 100%);
|
15065
14987
|
--cds-slug-gradient-hover: #a8a8a8 linear-gradient(135deg, #ffffff 0%, rgba(255, 255, 255, 0) 100%);
|
15066
14988
|
--cds-slug-hollow-hover: #b5b5b5;
|
@@ -15664,22 +15586,6 @@ button.c4p--add-select__global-filter-toggle--open {
|
|
15664
15586
|
.c4p--edit-side-panel.c4p--side-panel .cds--btn.c4p--side-panel__close-button {
|
15665
15587
|
display: none;
|
15666
15588
|
}
|
15667
|
-
.c4p--edit-side-panel .c4p--side-panel .c4p--edit-side-panel__actions-container {
|
15668
|
-
position: absolute;
|
15669
|
-
z-index: 4;
|
15670
|
-
bottom: 0;
|
15671
|
-
left: 0;
|
15672
|
-
width: 100%;
|
15673
|
-
margin-bottom: 0;
|
15674
|
-
}
|
15675
|
-
.c4p--edit-side-panel .c4p--edit-side-panel__actions-container {
|
15676
|
-
position: absolute;
|
15677
|
-
z-index: 4;
|
15678
|
-
right: 0;
|
15679
|
-
bottom: 0;
|
15680
|
-
width: 100%;
|
15681
|
-
margin-bottom: 0;
|
15682
|
-
}
|
15683
15589
|
|
15684
15590
|
.c4p--options-tile {
|
15685
15591
|
position: relative;
|
@@ -16310,6 +16216,7 @@ button.c4p--add-select__global-filter-toggle--open {
|
|
16310
16216
|
position: sticky;
|
16311
16217
|
z-index: 1;
|
16312
16218
|
left: 0;
|
16219
|
+
background-color: var(--cds-layer-01, #f4f4f4);
|
16313
16220
|
}
|
16314
16221
|
.c4p--datagrid__grid-container table.c4p--datagrid__vertical-align-center .c4p--datagrid__cell {
|
16315
16222
|
align-items: center;
|
@@ -16331,6 +16238,7 @@ button.c4p--add-select__global-filter-toggle--open {
|
|
16331
16238
|
.c4p--datagrid__grid-container table.c4p--datagrid__vertical-align-center th.cds--table-column-checkbox.c4p--datagrid__checkbox-cell-sticky-left {
|
16332
16239
|
position: sticky;
|
16333
16240
|
left: 0;
|
16241
|
+
background-color: var(--cds-layer-01, #f4f4f4);
|
16334
16242
|
}
|
16335
16243
|
.c4p--datagrid__grid-container table.c4p--datagrid__vertical-align-center .c4p--datagrid__checkbox-cell th.cds--table-column-checkbox {
|
16336
16244
|
display: flex;
|
@@ -16381,6 +16289,15 @@ button.c4p--add-select__global-filter-toggle--open {
|
|
16381
16289
|
background-color: var(--cds-background, #ffffff);
|
16382
16290
|
}
|
16383
16291
|
|
16292
|
+
.c4p--datagrid th.c4p--datagrid__with-slug {
|
16293
|
+
background-image: linear-gradient(180deg, var(--cds-ai-inner-shadow, rgba(69, 137, 255, 0.2)) 0%, 15%, var(--cds-ai-aura-end, rgba(255, 255, 255, 0)) 100%, transparent 100%);
|
16294
|
+
border-block-end-color: var(--cds-ai-border-strong, #4589ff);
|
16295
|
+
}
|
16296
|
+
|
16297
|
+
.c4p--datagrid th.c4p--datagrid__with-slug .cds--slug {
|
16298
|
+
margin-left: 0.5rem;
|
16299
|
+
}
|
16300
|
+
|
16384
16301
|
.c4p--datagrid__grid-container {
|
16385
16302
|
display: block;
|
16386
16303
|
width: 100%;
|
@@ -16407,6 +16324,9 @@ button.c4p--add-select__global-filter-toggle--open {
|
|
16407
16324
|
height: 100%;
|
16408
16325
|
overflow-x: auto;
|
16409
16326
|
}
|
16327
|
+
.c4p--datagrid__grid-container .c4p--datagrid-filter-panel + .c4p--datagrid__table-container-inner .cds--data-table-content {
|
16328
|
+
height: fit-content;
|
16329
|
+
}
|
16410
16330
|
.c4p--datagrid__grid-container table.c4p--datagrid__table-simple {
|
16411
16331
|
display: flex;
|
16412
16332
|
overflow: auto;
|
@@ -16449,6 +16369,9 @@ button.c4p--add-select__global-filter-toggle--open {
|
|
16449
16369
|
-webkit-line-clamp: 2;
|
16450
16370
|
white-space: initial;
|
16451
16371
|
}
|
16372
|
+
.c4p--datagrid__grid-container .c4p--datagrid__defaultStringRenderer.c4p--datagrid__defaultStringRenderer--slug {
|
16373
|
+
width: fit-content;
|
16374
|
+
}
|
16452
16375
|
.c4p--datagrid__grid-container .c4p--datagrid__expanded-row {
|
16453
16376
|
display: flex;
|
16454
16377
|
overflow: hidden;
|
@@ -16544,7 +16467,7 @@ button.c4p--add-select__global-filter-toggle--open {
|
|
16544
16467
|
}
|
16545
16468
|
|
16546
16469
|
.c4p--datagrid__resizableColumn:hover {
|
16547
|
-
background-color: var(--cds-
|
16470
|
+
background-color: var(--cds-layer-selected-hover);
|
16548
16471
|
}
|
16549
16472
|
.c4p--datagrid__resizableColumn:hover .c4p--datagrid__resizer {
|
16550
16473
|
border-right: 0.125rem solid var(--cds-border-strong-01, #8d8d8d);
|
@@ -17091,6 +17014,7 @@ button.c4p--add-select__global-filter-toggle--open {
|
|
17091
17014
|
display: flex;
|
17092
17015
|
align-items: center;
|
17093
17016
|
border-left: 1px solid var(--cds-layer-active-02, #c6c6c6);
|
17017
|
+
background-color: var(--cds-layer-01, #f4f4f4);
|
17094
17018
|
}
|
17095
17019
|
|
17096
17020
|
.c4p--datagrid__right-sticky-column-header {
|
@@ -17106,6 +17030,7 @@ button.c4p--add-select__global-filter-toggle--open {
|
|
17106
17030
|
display: flex;
|
17107
17031
|
align-items: center;
|
17108
17032
|
border-right: 1px solid var(--cds-layer-active-02, #c6c6c6);
|
17033
|
+
background-color: var(--cds-layer-01, #f4f4f4);
|
17109
17034
|
}
|
17110
17035
|
|
17111
17036
|
.c4p--datagrid__left-sticky-column-header {
|
@@ -18067,16 +17992,34 @@ th.c4p--datagrid__select-all-toggle-on.button {
|
|
18067
17992
|
width: 100%;
|
18068
17993
|
/* stylelint-disable-next-line -- to-rem carbon replacement for rem */
|
18069
17994
|
height: 3rem;
|
18070
|
-
align-items:
|
17995
|
+
align-items: start;
|
18071
17996
|
padding: 0.5rem;
|
18072
17997
|
border-top: 1px solid var(--cds-border-subtle-01, #c6c6c6);
|
18073
17998
|
background: var(--cds-layer-01, #f4f4f4);
|
18074
17999
|
}
|
18000
|
+
.c4p--filter-summary.c4p--filter-summary__expanded {
|
18001
|
+
height: fit-content;
|
18002
|
+
}
|
18075
18003
|
|
18076
18004
|
.c4p--filter-summary .c4p--tag-set.c4p--tag-set.c4p--filter-summary__clear-button-inline {
|
18077
18005
|
width: auto;
|
18078
18006
|
}
|
18079
18007
|
|
18008
|
+
.c4p--filter-summary__view-all--wrapper {
|
18009
|
+
position: absolute;
|
18010
|
+
top: 0.5rem;
|
18011
|
+
right: 0;
|
18012
|
+
}
|
18013
|
+
|
18014
|
+
.c4p--filter-summary__expanded .c4p--filter-summary__clear-all-button.cds--btn {
|
18015
|
+
margin-right: 2rem;
|
18016
|
+
}
|
18017
|
+
|
18018
|
+
.c4p--filter-summary__view-all--wrapper .c4p--filter-summary__view-all--chevron-multiline {
|
18019
|
+
transform: rotate(180deg);
|
18020
|
+
transition: transform 70ms cubic-bezier(0.2, 0, 0.38, 0.9);
|
18021
|
+
}
|
18022
|
+
|
18080
18023
|
.c4p--datagrid__datagridWrap {
|
18081
18024
|
display: block;
|
18082
18025
|
width: 100%;
|
@@ -18115,6 +18058,10 @@ th.c4p--datagrid__select-all-toggle-on.button {
|
|
18115
18058
|
min-width: auto;
|
18116
18059
|
}
|
18117
18060
|
|
18061
|
+
.c4p--datagrid .cds--pagination {
|
18062
|
+
background-color: var(--cds-layer-02, #ffffff);
|
18063
|
+
}
|
18064
|
+
|
18118
18065
|
/* stylelint-disable max-nesting-depth */
|
18119
18066
|
.c4p--edit-update-cards#c4p--edit-update-cards--edit {
|
18120
18067
|
/* Used id for overriding the SVG path fill */
|
@@ -18161,4 +18108,10 @@ th.c4p--datagrid__select-all-toggle-on.button {
|
|
18161
18108
|
color: #ffffff;
|
18162
18109
|
}
|
18163
18110
|
|
18111
|
+
.c4p--delimited-list-truncate {
|
18112
|
+
overflow: hidden;
|
18113
|
+
text-overflow: ellipsis;
|
18114
|
+
white-space: nowrap;
|
18115
|
+
}
|
18116
|
+
|
18164
18117
|
/*# sourceMappingURL=index.css.map */
|