@carbon/ibm-products 2.64.0 → 2.65.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.
Files changed (104) hide show
  1. package/css/index-full-carbon.css +59 -143
  2. package/css/index-full-carbon.css.map +1 -1
  3. package/css/index-full-carbon.min.css +1 -1
  4. package/css/index-full-carbon.min.css.map +1 -1
  5. package/css/index-without-carbon-released-only.css +8 -0
  6. package/css/index-without-carbon-released-only.css.map +1 -1
  7. package/css/index-without-carbon-released-only.min.css +1 -1
  8. package/css/index-without-carbon-released-only.min.css.map +1 -1
  9. package/css/index-without-carbon.css +59 -143
  10. package/css/index-without-carbon.css.map +1 -1
  11. package/css/index-without-carbon.min.css +1 -1
  12. package/css/index-without-carbon.min.css.map +1 -1
  13. package/css/index.css +59 -143
  14. package/css/index.css.map +1 -1
  15. package/css/index.min.css +1 -1
  16. package/css/index.min.css.map +1 -1
  17. package/es/components/Checklist/Checklist.js +8 -7
  18. package/es/components/CoachmarkStack/CoachmarkStack.d.ts +5 -0
  19. package/es/components/CoachmarkStack/CoachmarkStack.js +9 -3
  20. package/es/components/CoachmarkStack/CoachmarkStackHome.d.ts +5 -0
  21. package/es/components/CoachmarkStack/CoachmarkStackHome.js +39 -6
  22. package/es/components/CreateFullPage/CreateFullPage.d.ts +1 -1
  23. package/es/components/CreateFullPage/CreateFullPage.js +23 -18
  24. package/es/components/Datagrid/Datagrid/DraggableElement.d.ts +3 -1
  25. package/es/components/Datagrid/Datagrid/DraggableElement.js +3 -1
  26. package/es/components/Datagrid/Datagrid/addons/CustomizeColumns/DraggableItemsList.js +3 -0
  27. package/es/components/InlineTip/InlineTip.js +3 -3
  28. package/es/components/InterstitialScreen/InterstitialScreen.d.ts +36 -59
  29. package/es/components/InterstitialScreen/InterstitialScreen.js +75 -271
  30. package/es/components/InterstitialScreen/InterstitialScreenBody.d.ts +27 -0
  31. package/es/components/InterstitialScreen/InterstitialScreenBody.js +110 -0
  32. package/es/components/InterstitialScreen/InterstitialScreenFooter.d.ts +47 -0
  33. package/es/components/InterstitialScreen/InterstitialScreenFooter.js +184 -0
  34. package/es/components/InterstitialScreen/InterstitialScreenHeader.d.ts +35 -0
  35. package/es/components/InterstitialScreen/InterstitialScreenHeader.js +90 -0
  36. package/es/components/{InterstitialScreenView → InterstitialScreen/_story-assets/InterstitialScreenView}/InterstitialScreenView.d.ts +1 -0
  37. package/{lib/components → es/components/InterstitialScreen/_story-assets}/InterstitialScreenViewModule/InterstitialScreenViewModule.d.ts +8 -0
  38. package/es/components/NotificationsPanel/NotificationsPanel.js +15 -10
  39. package/es/components/PageHeader/PageHeader.js +1 -1
  40. package/es/components/SidePanel/SidePanel.js +3 -2
  41. package/es/components/Tearsheet/Tearsheet.js +3 -2
  42. package/es/components/index.d.ts +0 -2
  43. package/es/global/js/hooks/useOverflowItems/useOverflowItems.d.ts +2 -2
  44. package/es/global/js/package-settings.d.ts +0 -2
  45. package/es/global/js/package-settings.js +0 -2
  46. package/es/index.js +0 -2
  47. package/es/settings.d.ts +0 -2
  48. package/lib/components/Checklist/Checklist.js +7 -6
  49. package/lib/components/CoachmarkStack/CoachmarkStack.d.ts +5 -0
  50. package/lib/components/CoachmarkStack/CoachmarkStack.js +9 -3
  51. package/lib/components/CoachmarkStack/CoachmarkStackHome.d.ts +5 -0
  52. package/lib/components/CoachmarkStack/CoachmarkStackHome.js +37 -4
  53. package/lib/components/CreateFullPage/CreateFullPage.d.ts +1 -1
  54. package/lib/components/CreateFullPage/CreateFullPage.js +22 -17
  55. package/lib/components/Datagrid/Datagrid/DraggableElement.d.ts +3 -1
  56. package/lib/components/Datagrid/Datagrid/DraggableElement.js +3 -1
  57. package/lib/components/Datagrid/Datagrid/addons/CustomizeColumns/DraggableItemsList.js +3 -0
  58. package/lib/components/InlineTip/InlineTip.js +2 -2
  59. package/lib/components/InterstitialScreen/InterstitialScreen.d.ts +36 -59
  60. package/lib/components/InterstitialScreen/InterstitialScreen.js +73 -267
  61. package/lib/components/InterstitialScreen/InterstitialScreenBody.d.ts +27 -0
  62. package/lib/components/InterstitialScreen/InterstitialScreenBody.js +114 -0
  63. package/lib/components/InterstitialScreen/InterstitialScreenFooter.d.ts +47 -0
  64. package/lib/components/InterstitialScreen/InterstitialScreenFooter.js +188 -0
  65. package/lib/components/InterstitialScreen/InterstitialScreenHeader.d.ts +35 -0
  66. package/lib/components/InterstitialScreen/InterstitialScreenHeader.js +94 -0
  67. package/lib/components/{InterstitialScreenView → InterstitialScreen/_story-assets/InterstitialScreenView}/InterstitialScreenView.d.ts +1 -0
  68. package/{es/components → lib/components/InterstitialScreen/_story-assets}/InterstitialScreenViewModule/InterstitialScreenViewModule.d.ts +8 -0
  69. package/lib/components/NotificationsPanel/NotificationsPanel.js +14 -9
  70. package/lib/components/PageHeader/PageHeader.js +1 -1
  71. package/lib/components/SidePanel/SidePanel.js +3 -2
  72. package/lib/components/Tearsheet/Tearsheet.js +3 -2
  73. package/lib/components/index.d.ts +0 -2
  74. package/lib/global/js/hooks/useOverflowItems/useOverflowItems.d.ts +2 -2
  75. package/lib/global/js/package-settings.d.ts +0 -2
  76. package/lib/global/js/package-settings.js +0 -2
  77. package/lib/index.js +0 -10
  78. package/lib/settings.d.ts +0 -2
  79. package/package.json +7 -7
  80. package/scss/components/Coachmark/_coachmark-overlay.scss +2 -0
  81. package/scss/components/CoachmarkOverlayElements/_coachmark-overlay-elements.scss +1 -0
  82. package/scss/components/CoachmarkStack/_coachmark-stack.scss +25 -0
  83. package/scss/components/InterstitialScreen/_interstitial-screen.scss +29 -137
  84. package/scss/components/NotificationsPanel/_notifications-panel.scss +2 -0
  85. package/scss/components/PageHeader/_page-header.scss +5 -0
  86. package/scss/components/_index-with-carbon.scss +0 -2
  87. package/scss/components/_index.scss +0 -2
  88. package/telemetry.yml +17 -8
  89. package/es/components/InterstitialScreenView/InterstitialScreenView.js +0 -78
  90. package/es/components/InterstitialScreenView/index.d.ts +0 -8
  91. package/es/components/InterstitialScreenViewModule/InterstitialScreenViewModule.js +0 -81
  92. package/es/components/InterstitialScreenViewModule/index.d.ts +0 -8
  93. package/lib/components/InterstitialScreenView/InterstitialScreenView.js +0 -78
  94. package/lib/components/InterstitialScreenView/index.d.ts +0 -8
  95. package/lib/components/InterstitialScreenViewModule/InterstitialScreenViewModule.js +0 -81
  96. package/lib/components/InterstitialScreenViewModule/index.d.ts +0 -8
  97. package/scss/components/InterstitialScreenView/_carbon-imports.scss +0 -9
  98. package/scss/components/InterstitialScreenView/_index-with-carbon.scss +0 -9
  99. package/scss/components/InterstitialScreenView/_index.scss +0 -8
  100. package/scss/components/InterstitialScreenView/_interstitial-screen-view.scss +0 -25
  101. package/scss/components/InterstitialScreenViewModule/_carbon-imports.scss +0 -9
  102. package/scss/components/InterstitialScreenViewModule/_index-with-carbon.scss +0 -9
  103. package/scss/components/InterstitialScreenViewModule/_index.scss +0 -8
  104. package/scss/components/InterstitialScreenViewModule/_interstitial-screen-view-module.scss +0 -59
package/css/index.css CHANGED
@@ -10745,6 +10745,10 @@ button.c4p--add-select__global-filter-toggle--open {
10745
10745
  transition: background-color 240ms cubic-bezier(0.2, 0, 0.38, 0.9);
10746
10746
  }
10747
10747
  .c4p--notifications-panel__container .c4p--notifications-panel__notification .c4p--notifications-panel__notification-title {
10748
+ font-size: var(--cds-heading-01-font-size, 0.875rem);
10749
+ font-weight: var(--cds-heading-01-font-weight, 600);
10750
+ line-height: var(--cds-heading-01-line-height, 1.42857);
10751
+ letter-spacing: var(--cds-heading-01-letter-spacing, 0.16px);
10748
10752
  color: var(--cds-text-secondary, #525252);
10749
10753
  margin-block-end: 0.25rem;
10750
10754
  font-weight: 400;
@@ -13555,6 +13559,7 @@ button.c4p--add-select__global-filter-toggle--open {
13555
13559
  z-index: 7999;
13556
13560
  display: inline-block; /* cause top/bottom margin to reserve space */
13557
13561
  background-color: var(--cds-background, #ffffff);
13562
+ border-block-end: 1px solid var(--cds-border-subtle-00, #e0e0e0);
13558
13563
  color: var(--cds-text-primary, #161616);
13559
13564
  inline-size: 100%;
13560
13565
  /* stylelint-disable-next-line carbon/layout-use */
@@ -13568,6 +13573,9 @@ button.c4p--add-select__global-filter-toggle--open {
13568
13573
  --c4p--page-header--button-set-in-breadcrumb-width-px: initial;
13569
13574
  --c4p--page-header--navigation-buffer-top: $spacing-06;
13570
13575
  }
13576
+ .c4p--page-header.c4p--page-header--without-background {
13577
+ border-block-end: none;
13578
+ }
13571
13579
  .c4p--page-header.c4p--page-header--has-navigation-tags-only {
13572
13580
  --c4p--page-header--navigation-buffer-top: $spacing-04;
13573
13581
  }
@@ -20194,28 +20202,6 @@ th.c4p--datagrid__select-all-toggle-on.button {
20194
20202
  display: none;
20195
20203
  }
20196
20204
 
20197
- .c4p--interstitial-screen {
20198
- position: fixed;
20199
- z-index: 6001;
20200
- inset-block-start: 0;
20201
- inset-inline: 0;
20202
- }
20203
- .c4p--interstitial-screen .c4p--carousel {
20204
- display: flex;
20205
- flex-direction: column;
20206
- min-block-size: 100%;
20207
- }
20208
- .c4p--interstitial-screen .c4p--carousel__elements-container {
20209
- display: flex;
20210
- flex: 1;
20211
- flex-direction: column;
20212
- }
20213
- .c4p--interstitial-screen .c4p--carousel__elements {
20214
- flex: 1;
20215
- }
20216
- .c4p--interstitial-screen .c4p--interstitial-screen--auto-height-container {
20217
- flex: 1;
20218
- }
20219
20205
  .c4p--interstitial-screen--body {
20220
20206
  overflow: hidden auto;
20221
20207
  flex-grow: 1;
@@ -20223,15 +20209,8 @@ th.c4p--datagrid__select-all-toggle-on.button {
20223
20209
  margin: 0;
20224
20210
  background-color: var(--cds-background, #ffffff);
20225
20211
  }
20226
- .c4p--interstitial-screen--body-grid {
20227
- padding: 0 !important;
20228
- block-size: 100%;
20229
- }
20230
- .c4p--interstitial-screen--body-row {
20231
- block-size: 100%;
20232
- }
20233
20212
  .c4p--interstitial-screen--progress {
20234
- margin: 2rem 1rem 0.75rem;
20213
+ margin-block-end: 0.75rem;
20235
20214
  }
20236
20215
  .c4p--interstitial-screen__carousel {
20237
20216
  block-size: 100%;
@@ -20240,29 +20219,6 @@ th.c4p--datagrid__select-all-toggle-on.button {
20240
20219
  flex: 0 0 100% !important;
20241
20220
  scroll-snap-align: start;
20242
20221
  }
20243
- .c4p--interstitial-screen--container {
20244
- margin: 8rem auto;
20245
- background-color: var(--cds-background, #ffffff);
20246
- max-inline-size: 82rem;
20247
- min-inline-size: 47rem;
20248
- }
20249
- .c4p--interstitial-screen--media-container {
20250
- overflow: hidden;
20251
- }
20252
- .c4p--interstitial-screen--media {
20253
- block-size: 100%;
20254
- inline-size: 100%;
20255
- margin-inline-end: -2.5rem;
20256
- }
20257
- @media (max-width: 81.98rem) {
20258
- .c4p--interstitial-screen--media {
20259
- margin-inline-end: -2rem;
20260
- }
20261
- }
20262
- .c4p--interstitial-screen--stepped-animated-media {
20263
- overflow: hidden;
20264
- block-size: 100%;
20265
- }
20266
20222
  .c4p--interstitial-screen--internal-body {
20267
20223
  padding: 0 !important;
20268
20224
  margin: 0 !important;
@@ -20272,18 +20228,32 @@ th.c4p--datagrid__select-all-toggle-on.button {
20272
20228
  background-color: var(--cds-background, #ffffff);
20273
20229
  margin-block-end: 0 !important;
20274
20230
  min-block-size: 3rem;
20231
+ padding-block-start: 1.5rem;
20232
+ padding-inline-start: 2rem !important;
20275
20233
  }
20276
20234
  .c4p--interstitial-screen--internal-header:empty {
20277
20235
  min-block-size: 0;
20278
20236
  }
20279
- .c4p--interstitial-screen--internal-header h2 {
20237
+ .c4p--interstitial-screen--internal-header .c4p--interstitial-screen--titleContainer {
20238
+ margin-block-end: 1rem;
20239
+ }
20240
+ .c4p--interstitial-screen--internal-header .c4p--interstitial-screen--titleContainer h2 {
20280
20241
  font-size: var(--cds-productive-heading-04-font-size, 1.75rem);
20281
20242
  font-weight: var(--cds-productive-heading-04-font-weight, 400);
20282
20243
  line-height: var(--cds-productive-heading-04-line-height, 1.28572);
20283
20244
  letter-spacing: var(--cds-productive-heading-04-letter-spacing, 0);
20284
- padding: 0 1rem 1.5rem;
20245
+ margin-block-end: 0.5rem;
20246
+ }
20247
+ .c4p--interstitial-screen--internal-header .c4p--interstitial-screen--titleContainer h2:empty {
20248
+ padding: 0;
20249
+ }
20250
+ .c4p--interstitial-screen--internal-header .c4p--interstitial-screen--titleContainer h3 {
20251
+ font-size: var(--cds-productive-heading-03-font-size, 1.25rem);
20252
+ font-weight: var(--cds-productive-heading-03-font-weight, 400);
20253
+ line-height: var(--cds-productive-heading-03-line-height, 1.4);
20254
+ letter-spacing: var(--cds-productive-heading-03-letter-spacing, 0);
20285
20255
  }
20286
- .c4p--interstitial-screen--internal-header h2:empty {
20256
+ .c4p--interstitial-screen--internal-header .c4p--interstitial-screen--titleContainer h3:empty {
20287
20257
  padding: 0;
20288
20258
  }
20289
20259
  .c4p--interstitial-screen--internal-header--has-title {
@@ -20293,13 +20263,6 @@ th.c4p--datagrid__select-all-toggle-on.button {
20293
20263
  .c4p--interstitial-screen--internal-header--has-title .c4p--interstitial-screen--progress {
20294
20264
  margin-block-start: 0;
20295
20265
  }
20296
- .c4p--interstitial-screen--internal-header > .c4p--interstitial-screen--close-icon {
20297
- position: absolute !important;
20298
- z-index: 1;
20299
- inline-size: 3rem;
20300
- inset-block-start: 0;
20301
- inset-inline-end: 0;
20302
- }
20303
20266
  .c4p--interstitial-screen--footer {
20304
20267
  display: flex;
20305
20268
  flex-direction: row;
@@ -20320,19 +20283,21 @@ th.c4p--datagrid__select-all-toggle-on.button {
20320
20283
  max-inline-size: none;
20321
20284
  padding-inline-start: 2rem !important;
20322
20285
  }
20286
+ .c4p--interstitial-screen--footer .cds--inline-loading {
20287
+ position: absolute;
20288
+ inline-size: 2rem;
20289
+ inset-block-start: 0;
20290
+ inset-inline-end: 0;
20291
+ }
20323
20292
  .c4p--interstitial-screen--footer-controls {
20324
20293
  display: flex;
20325
20294
  flex-direction: row;
20326
20295
  margin-inline-start: auto;
20327
20296
  }
20328
- .c4p--interstitial-screen--modal .c4p--interstitial-screen--content {
20329
- margin-block-start: 0;
20330
- }
20331
- .c4p--interstitial-screen--modal .c4p--interstitial-screen--internal-header:has(> :nth-child(2)) {
20332
- min-block-size: initial;
20333
- }
20334
- .c4p--interstitial-screen--modal:has(> :nth-child(1)) {
20335
- min-block-size: initial;
20297
+ .c4p--interstitial-screen--full-screen {
20298
+ position: fixed;
20299
+ inset-block-start: 0;
20300
+ inset-inline: 0;
20336
20301
  }
20337
20302
  .c4p--interstitial-screen--full-screen .c4p--interstitial-screen--container {
20338
20303
  display: flex;
@@ -20342,44 +20307,6 @@ th.c4p--datagrid__select-all-toggle-on.button {
20342
20307
  block-size: 100vh;
20343
20308
  max-inline-size: 100vw;
20344
20309
  }
20345
- .c4p--interstitial-screen--full-screen .c4p--interstitial-screen--header {
20346
- font-size: var(--cds-body-long-01-font-size, 0.875rem);
20347
- font-weight: var(--cds-body-long-01-font-weight, 400);
20348
- line-height: var(--cds-body-long-01-line-height, 1.42857);
20349
- letter-spacing: var(--cds-body-long-01-letter-spacing, 0.16px);
20350
- /* stylelint-disable-next-line carbon/theme-use */
20351
- background-color: #161616;
20352
- block-size: 3rem;
20353
- border-block-end: 1px solid var(--cds-border-subtle-01, #c6c6c6);
20354
- /* stylelint-disable-next-line carbon/theme-use */
20355
- color: #f4f4f4;
20356
- /* stylelint-disable-next-line carbon/type-use */
20357
- font-weight: normal !important;
20358
- /* stylelint-disable-next-line carbon/type-use */
20359
- line-height: 3rem !important;
20360
- padding-inline-start: 1rem;
20361
- }
20362
- .c4p--interstitial-screen--full-screen .c4p--interstitial-screen--header b {
20363
- /* stylelint-disable-next-line carbon/type-use */
20364
- font-weight: 600;
20365
- }
20366
- .c4p--interstitial-screen--full-screen .c4p--interstitial-screen--internal-header > h2 {
20367
- padding: 1rem 2.5rem 0;
20368
- }
20369
- .c4p--interstitial-screen--full-screen .c4p--interstitial-screen--internal-header .c4p--interstitial-screen--progress {
20370
- margin: 4rem 2.5rem 0.75rem;
20371
- }
20372
- @media (max-width: 81.98rem) {
20373
- .c4p--interstitial-screen--full-screen .c4p--interstitial-screen--internal-header .c4p--interstitial-screen--progress {
20374
- margin-inline-start: 2rem;
20375
- }
20376
- }
20377
- .c4p--interstitial-screen--full-screen .c4p--interstitial-screen--internal-header--has-title .c4p--interstitial-screen--progress {
20378
- margin-block-start: 1.5rem;
20379
- }
20380
- .c4p--interstitial-screen--full-screen .c4p--interstitial-screen--internal-header:has(> :nth-child(1)) {
20381
- min-block-size: initial;
20382
- }
20383
20310
  .c4p--interstitial-screen--full-screen .c4p--interstitial-screen--footer .c4p--interstitial-screen--skip-btn {
20384
20311
  padding-inline-start: 2.5rem !important;
20385
20312
  }
@@ -20389,40 +20316,6 @@ th.c4p--datagrid__select-all-toggle-on.button {
20389
20316
  }
20390
20317
  }
20391
20318
 
20392
- .c4p--interstitial-screen-view {
20393
- block-size: 100%;
20394
- }
20395
-
20396
- /* stylelint-disable max-nesting-depth */
20397
- .c4p--interstitial-screen-view-module {
20398
- margin: 2rem;
20399
- }
20400
- .c4p--interstitial-screen-view-module--heading {
20401
- font-size: var(--cds-heading-05-font-size, 2rem);
20402
- font-weight: var(--cds-heading-05-font-weight, 400);
20403
- line-height: var(--cds-heading-05-line-height, 1.25);
20404
- letter-spacing: var(--cds-heading-05-letter-spacing, 0);
20405
- margin-block-end: 2rem;
20406
- }
20407
- .c4p--interstitial-screen-view-module--body {
20408
- font-size: var(--cds-body-01-font-size, 0.875rem);
20409
- font-weight: var(--cds-body-01-font-weight, 400);
20410
- line-height: var(--cds-body-01-line-height, 1.42857);
20411
- letter-spacing: var(--cds-body-01-letter-spacing, 0.16px);
20412
- }
20413
-
20414
- .c4p--interstitial-screen--modal .c4p--interstitial-screen-view-module {
20415
- margin: 5rem 2rem;
20416
- }
20417
- .c4p--interstitial-screen--full-screen .c4p--interstitial-screen-view-module {
20418
- margin: 6rem 2.5rem;
20419
- }
20420
- @media (max-width: 81.98rem) {
20421
- .c4p--interstitial-screen--full-screen .c4p--interstitial-screen-view-module {
20422
- margin: 6rem 2rem;
20423
- }
20424
- }
20425
-
20426
20319
  .c4p--coachmark-dragbar {
20427
20320
  display: flex;
20428
20321
  /* stylelint-disable-next-line max-nesting-depth */
@@ -20586,6 +20479,8 @@ th.c4p--datagrid__select-all-toggle-on.button {
20586
20479
  display: flex;
20587
20480
  align-items: center;
20588
20481
  justify-content: flex-end;
20482
+ margin-block-start: 1rem;
20483
+ padding-block-end: 1rem;
20589
20484
  }
20590
20485
  .c4p--coachmark-overlay__light .c4p--coachmark-overlay__body .cds--link {
20591
20486
  color: var(--cds-link-inverse, #78a9ff);
@@ -20934,6 +20829,7 @@ th.c4p--datagrid__select-all-toggle-on.button {
20934
20829
 
20935
20830
  /* stylelint-disable max-nesting-depth */
20936
20831
  .c4p--coachmark-overlay-elements__element-stepped-media {
20832
+ padding: 0 1rem;
20937
20833
  /* stylelint-disable-next-line function-no-unknown -- to-rem carbon replacement for rem */
20938
20834
  block-size: 8rem;
20939
20835
  margin-block-end: 1rem;
@@ -21005,6 +20901,26 @@ th.c4p--datagrid__select-all-toggle-on.button {
21005
20901
  .c4p--coachmark-stacked-home__icon-idea {
21006
20902
  margin-block-end: 0.5rem;
21007
20903
  }
20904
+ .c4p--coachmark-stacked-home li {
20905
+ display: block;
20906
+ max-inline-size: 100%;
20907
+ white-space: nowrap;
20908
+ }
20909
+ .c4p--coachmark-stacked-home button, .c4p--coachmark-stacked-home__navLinkLabels-tooltip {
20910
+ max-inline-size: 100%;
20911
+ }
20912
+ .c4p--coachmark-stacked-home button .cds--tooltip-content, .c4p--coachmark-stacked-home__navLinkLabels-tooltip .cds--tooltip-content {
20913
+ color: var(--cds-text-primary, #161616);
20914
+ margin-inline-start: 0.375rem;
20915
+ max-inline-size: 100%;
20916
+ }
20917
+ .c4p--coachmark-stacked-home__navLinkLabels-text {
20918
+ display: inline-block;
20919
+ overflow: hidden;
20920
+ max-inline-size: 100%;
20921
+ text-overflow: ellipsis;
20922
+ white-space: nowrap;
20923
+ }
21008
20924
 
21009
20925
  .c4p--delimited-list-truncate {
21010
20926
  overflow: hidden;