@carbon/ibm-products-styles 2.60.0 → 2.61.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/css/index-full-carbon.css +59 -143
- 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 +8 -0
- 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 +59 -143
- 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 +59 -143
- package/css/index.css.map +1 -1
- package/css/index.min.css +1 -1
- package/css/index.min.css.map +1 -1
- package/package.json +3 -3
- package/scss/components/Coachmark/_coachmark-overlay.scss +2 -0
- package/scss/components/CoachmarkOverlayElements/_coachmark-overlay-elements.scss +1 -0
- package/scss/components/CoachmarkStack/_coachmark-stack.scss +25 -0
- package/scss/components/InterstitialScreen/_interstitial-screen.scss +29 -137
- package/scss/components/NotificationsPanel/_notifications-panel.scss +2 -0
- package/scss/components/PageHeader/_page-header.scss +5 -0
- package/scss/components/_index-with-carbon.scss +0 -2
- package/scss/components/_index.scss +0 -2
- package/scss/components/InterstitialScreenView/_carbon-imports.scss +0 -9
- package/scss/components/InterstitialScreenView/_index-with-carbon.scss +0 -9
- package/scss/components/InterstitialScreenView/_index.scss +0 -8
- package/scss/components/InterstitialScreenView/_interstitial-screen-view.scss +0 -25
- package/scss/components/InterstitialScreenViewModule/_carbon-imports.scss +0 -9
- package/scss/components/InterstitialScreenViewModule/_index-with-carbon.scss +0 -9
- package/scss/components/InterstitialScreenViewModule/_index.scss +0 -8
- package/scss/components/InterstitialScreenViewModule/_interstitial-screen-view-module.scss +0 -59
|
@@ -1950,6 +1950,8 @@ p.c4p--about-modal__copyright-text:first-child {
|
|
|
1950
1950
|
display: flex;
|
|
1951
1951
|
align-items: center;
|
|
1952
1952
|
justify-content: flex-end;
|
|
1953
|
+
margin-block-start: 1rem;
|
|
1954
|
+
padding-block-end: 1rem;
|
|
1953
1955
|
}
|
|
1954
1956
|
.c4p--coachmark-overlay__light .c4p--coachmark-overlay__body .cds--link {
|
|
1955
1957
|
color: var(--cds-link-inverse, #78a9ff);
|
|
@@ -2352,6 +2354,7 @@ p.c4p--about-modal__copyright-text:first-child {
|
|
|
2352
2354
|
}
|
|
2353
2355
|
|
|
2354
2356
|
.c4p--coachmark-overlay-elements__element-stepped-media {
|
|
2357
|
+
padding: 0 1rem;
|
|
2355
2358
|
/* stylelint-disable-next-line function-no-unknown -- to-rem carbon replacement for rem */
|
|
2356
2359
|
block-size: 8rem;
|
|
2357
2360
|
margin-block-end: 1rem;
|
|
@@ -2423,6 +2426,26 @@ p.c4p--about-modal__copyright-text:first-child {
|
|
|
2423
2426
|
.c4p--coachmark-stacked-home__icon-idea {
|
|
2424
2427
|
margin-block-end: 0.5rem;
|
|
2425
2428
|
}
|
|
2429
|
+
.c4p--coachmark-stacked-home li {
|
|
2430
|
+
display: block;
|
|
2431
|
+
max-inline-size: 100%;
|
|
2432
|
+
white-space: nowrap;
|
|
2433
|
+
}
|
|
2434
|
+
.c4p--coachmark-stacked-home button, .c4p--coachmark-stacked-home__navLinkLabels-tooltip {
|
|
2435
|
+
max-inline-size: 100%;
|
|
2436
|
+
}
|
|
2437
|
+
.c4p--coachmark-stacked-home button .cds--tooltip-content, .c4p--coachmark-stacked-home__navLinkLabels-tooltip .cds--tooltip-content {
|
|
2438
|
+
color: var(--cds-text-primary, #161616);
|
|
2439
|
+
margin-inline-start: 0.375rem;
|
|
2440
|
+
max-inline-size: 100%;
|
|
2441
|
+
}
|
|
2442
|
+
.c4p--coachmark-stacked-home__navLinkLabels-text {
|
|
2443
|
+
display: inline-block;
|
|
2444
|
+
overflow: hidden;
|
|
2445
|
+
max-inline-size: 100%;
|
|
2446
|
+
text-overflow: ellipsis;
|
|
2447
|
+
white-space: nowrap;
|
|
2448
|
+
}
|
|
2426
2449
|
|
|
2427
2450
|
.c4p--combo-button {
|
|
2428
2451
|
position: relative;
|
|
@@ -5231,6 +5254,10 @@ button.c4p--add-select__global-filter-toggle--open {
|
|
|
5231
5254
|
transition: background-color 240ms cubic-bezier(0.2, 0, 0.38, 0.9);
|
|
5232
5255
|
}
|
|
5233
5256
|
.c4p--notifications-panel__container .c4p--notifications-panel__notification .c4p--notifications-panel__notification-title {
|
|
5257
|
+
font-size: var(--cds-heading-01-font-size, 0.875rem);
|
|
5258
|
+
font-weight: var(--cds-heading-01-font-weight, 600);
|
|
5259
|
+
line-height: var(--cds-heading-01-line-height, 1.42857);
|
|
5260
|
+
letter-spacing: var(--cds-heading-01-letter-spacing, 0.16px);
|
|
5234
5261
|
color: var(--cds-text-secondary, #525252);
|
|
5235
5262
|
margin-block-end: 0.25rem;
|
|
5236
5263
|
font-weight: 400;
|
|
@@ -7131,6 +7158,7 @@ button.c4p--add-select__global-filter-toggle--open {
|
|
|
7131
7158
|
z-index: 7999;
|
|
7132
7159
|
display: inline-block; /* cause top/bottom margin to reserve space */
|
|
7133
7160
|
background-color: var(--cds-background, #ffffff);
|
|
7161
|
+
border-block-end: 1px solid var(--cds-border-subtle-00, #e0e0e0);
|
|
7134
7162
|
color: var(--cds-text-primary, #161616);
|
|
7135
7163
|
inline-size: 100%;
|
|
7136
7164
|
/* stylelint-disable-next-line carbon/layout-use */
|
|
@@ -7144,6 +7172,9 @@ button.c4p--add-select__global-filter-toggle--open {
|
|
|
7144
7172
|
--c4p--page-header--button-set-in-breadcrumb-width-px: initial;
|
|
7145
7173
|
--c4p--page-header--navigation-buffer-top: $spacing-06;
|
|
7146
7174
|
}
|
|
7175
|
+
.c4p--page-header.c4p--page-header--without-background {
|
|
7176
|
+
border-block-end: none;
|
|
7177
|
+
}
|
|
7147
7178
|
.c4p--page-header.c4p--page-header--has-navigation-tags-only {
|
|
7148
7179
|
--c4p--page-header--navigation-buffer-top: $spacing-04;
|
|
7149
7180
|
}
|
|
@@ -14158,28 +14189,6 @@ th.c4p--datagrid__select-all-toggle-on.button {
|
|
|
14158
14189
|
|
|
14159
14190
|
/* stylelint-disable max-nesting-depth */
|
|
14160
14191
|
/* stylelint-disable declaration-no-important */
|
|
14161
|
-
.c4p--interstitial-screen {
|
|
14162
|
-
position: fixed;
|
|
14163
|
-
z-index: 6001;
|
|
14164
|
-
inset-block-start: 0;
|
|
14165
|
-
inset-inline: 0;
|
|
14166
|
-
}
|
|
14167
|
-
.c4p--interstitial-screen .c4p--carousel {
|
|
14168
|
-
display: flex;
|
|
14169
|
-
flex-direction: column;
|
|
14170
|
-
min-block-size: 100%;
|
|
14171
|
-
}
|
|
14172
|
-
.c4p--interstitial-screen .c4p--carousel__elements-container {
|
|
14173
|
-
display: flex;
|
|
14174
|
-
flex: 1;
|
|
14175
|
-
flex-direction: column;
|
|
14176
|
-
}
|
|
14177
|
-
.c4p--interstitial-screen .c4p--carousel__elements {
|
|
14178
|
-
flex: 1;
|
|
14179
|
-
}
|
|
14180
|
-
.c4p--interstitial-screen .c4p--interstitial-screen--auto-height-container {
|
|
14181
|
-
flex: 1;
|
|
14182
|
-
}
|
|
14183
14192
|
.c4p--interstitial-screen--body {
|
|
14184
14193
|
overflow: hidden auto;
|
|
14185
14194
|
flex-grow: 1;
|
|
@@ -14187,15 +14196,8 @@ th.c4p--datagrid__select-all-toggle-on.button {
|
|
|
14187
14196
|
margin: 0;
|
|
14188
14197
|
background-color: var(--cds-background, #ffffff);
|
|
14189
14198
|
}
|
|
14190
|
-
.c4p--interstitial-screen--body-grid {
|
|
14191
|
-
padding: 0 !important;
|
|
14192
|
-
block-size: 100%;
|
|
14193
|
-
}
|
|
14194
|
-
.c4p--interstitial-screen--body-row {
|
|
14195
|
-
block-size: 100%;
|
|
14196
|
-
}
|
|
14197
14199
|
.c4p--interstitial-screen--progress {
|
|
14198
|
-
margin:
|
|
14200
|
+
margin-block-end: 0.75rem;
|
|
14199
14201
|
}
|
|
14200
14202
|
.c4p--interstitial-screen__carousel {
|
|
14201
14203
|
block-size: 100%;
|
|
@@ -14204,29 +14206,6 @@ th.c4p--datagrid__select-all-toggle-on.button {
|
|
|
14204
14206
|
flex: 0 0 100% !important;
|
|
14205
14207
|
scroll-snap-align: start;
|
|
14206
14208
|
}
|
|
14207
|
-
.c4p--interstitial-screen--container {
|
|
14208
|
-
margin: 8rem auto;
|
|
14209
|
-
background-color: var(--cds-background, #ffffff);
|
|
14210
|
-
max-inline-size: 82rem;
|
|
14211
|
-
min-inline-size: 47rem;
|
|
14212
|
-
}
|
|
14213
|
-
.c4p--interstitial-screen--media-container {
|
|
14214
|
-
overflow: hidden;
|
|
14215
|
-
}
|
|
14216
|
-
.c4p--interstitial-screen--media {
|
|
14217
|
-
block-size: 100%;
|
|
14218
|
-
inline-size: 100%;
|
|
14219
|
-
margin-inline-end: -2.5rem;
|
|
14220
|
-
}
|
|
14221
|
-
@media (max-width: 81.98rem) {
|
|
14222
|
-
.c4p--interstitial-screen--media {
|
|
14223
|
-
margin-inline-end: -2rem;
|
|
14224
|
-
}
|
|
14225
|
-
}
|
|
14226
|
-
.c4p--interstitial-screen--stepped-animated-media {
|
|
14227
|
-
overflow: hidden;
|
|
14228
|
-
block-size: 100%;
|
|
14229
|
-
}
|
|
14230
14209
|
.c4p--interstitial-screen--internal-body {
|
|
14231
14210
|
padding: 0 !important;
|
|
14232
14211
|
margin: 0 !important;
|
|
@@ -14236,18 +14215,32 @@ th.c4p--datagrid__select-all-toggle-on.button {
|
|
|
14236
14215
|
background-color: var(--cds-background, #ffffff);
|
|
14237
14216
|
margin-block-end: 0 !important;
|
|
14238
14217
|
min-block-size: 3rem;
|
|
14218
|
+
padding-block-start: 1.5rem;
|
|
14219
|
+
padding-inline-start: 2rem !important;
|
|
14239
14220
|
}
|
|
14240
14221
|
.c4p--interstitial-screen--internal-header:empty {
|
|
14241
14222
|
min-block-size: 0;
|
|
14242
14223
|
}
|
|
14243
|
-
.c4p--interstitial-screen--internal-header
|
|
14224
|
+
.c4p--interstitial-screen--internal-header .c4p--interstitial-screen--titleContainer {
|
|
14225
|
+
margin-block-end: 1rem;
|
|
14226
|
+
}
|
|
14227
|
+
.c4p--interstitial-screen--internal-header .c4p--interstitial-screen--titleContainer h2 {
|
|
14244
14228
|
font-size: var(--cds-productive-heading-04-font-size, 1.75rem);
|
|
14245
14229
|
font-weight: var(--cds-productive-heading-04-font-weight, 400);
|
|
14246
14230
|
line-height: var(--cds-productive-heading-04-line-height, 1.28572);
|
|
14247
14231
|
letter-spacing: var(--cds-productive-heading-04-letter-spacing, 0);
|
|
14248
|
-
|
|
14232
|
+
margin-block-end: 0.5rem;
|
|
14249
14233
|
}
|
|
14250
|
-
.c4p--interstitial-screen--internal-header h2:empty {
|
|
14234
|
+
.c4p--interstitial-screen--internal-header .c4p--interstitial-screen--titleContainer h2:empty {
|
|
14235
|
+
padding: 0;
|
|
14236
|
+
}
|
|
14237
|
+
.c4p--interstitial-screen--internal-header .c4p--interstitial-screen--titleContainer h3 {
|
|
14238
|
+
font-size: var(--cds-productive-heading-03-font-size, 1.25rem);
|
|
14239
|
+
font-weight: var(--cds-productive-heading-03-font-weight, 400);
|
|
14240
|
+
line-height: var(--cds-productive-heading-03-line-height, 1.4);
|
|
14241
|
+
letter-spacing: var(--cds-productive-heading-03-letter-spacing, 0);
|
|
14242
|
+
}
|
|
14243
|
+
.c4p--interstitial-screen--internal-header .c4p--interstitial-screen--titleContainer h3:empty {
|
|
14251
14244
|
padding: 0;
|
|
14252
14245
|
}
|
|
14253
14246
|
.c4p--interstitial-screen--internal-header--has-title {
|
|
@@ -14257,13 +14250,6 @@ th.c4p--datagrid__select-all-toggle-on.button {
|
|
|
14257
14250
|
.c4p--interstitial-screen--internal-header--has-title .c4p--interstitial-screen--progress {
|
|
14258
14251
|
margin-block-start: 0;
|
|
14259
14252
|
}
|
|
14260
|
-
.c4p--interstitial-screen--internal-header > .c4p--interstitial-screen--close-icon {
|
|
14261
|
-
position: absolute !important;
|
|
14262
|
-
z-index: 1;
|
|
14263
|
-
inline-size: 3rem;
|
|
14264
|
-
inset-block-start: 0;
|
|
14265
|
-
inset-inline-end: 0;
|
|
14266
|
-
}
|
|
14267
14253
|
.c4p--interstitial-screen--footer {
|
|
14268
14254
|
display: flex;
|
|
14269
14255
|
flex-direction: row;
|
|
@@ -14284,19 +14270,21 @@ th.c4p--datagrid__select-all-toggle-on.button {
|
|
|
14284
14270
|
max-inline-size: none;
|
|
14285
14271
|
padding-inline-start: 2rem !important;
|
|
14286
14272
|
}
|
|
14273
|
+
.c4p--interstitial-screen--footer .cds--inline-loading {
|
|
14274
|
+
position: absolute;
|
|
14275
|
+
inline-size: 2rem;
|
|
14276
|
+
inset-block-start: 0;
|
|
14277
|
+
inset-inline-end: 0;
|
|
14278
|
+
}
|
|
14287
14279
|
.c4p--interstitial-screen--footer-controls {
|
|
14288
14280
|
display: flex;
|
|
14289
14281
|
flex-direction: row;
|
|
14290
14282
|
margin-inline-start: auto;
|
|
14291
14283
|
}
|
|
14292
|
-
.c4p--interstitial-screen--
|
|
14293
|
-
|
|
14294
|
-
|
|
14295
|
-
|
|
14296
|
-
min-block-size: initial;
|
|
14297
|
-
}
|
|
14298
|
-
.c4p--interstitial-screen--modal:has(> :nth-child(1)) {
|
|
14299
|
-
min-block-size: initial;
|
|
14284
|
+
.c4p--interstitial-screen--full-screen {
|
|
14285
|
+
position: fixed;
|
|
14286
|
+
inset-block-start: 0;
|
|
14287
|
+
inset-inline: 0;
|
|
14300
14288
|
}
|
|
14301
14289
|
.c4p--interstitial-screen--full-screen .c4p--interstitial-screen--container {
|
|
14302
14290
|
display: flex;
|
|
@@ -14306,44 +14294,6 @@ th.c4p--datagrid__select-all-toggle-on.button {
|
|
|
14306
14294
|
block-size: 100vh;
|
|
14307
14295
|
max-inline-size: 100vw;
|
|
14308
14296
|
}
|
|
14309
|
-
.c4p--interstitial-screen--full-screen .c4p--interstitial-screen--header {
|
|
14310
|
-
font-size: var(--cds-body-long-01-font-size, 0.875rem);
|
|
14311
|
-
font-weight: var(--cds-body-long-01-font-weight, 400);
|
|
14312
|
-
line-height: var(--cds-body-long-01-line-height, 1.42857);
|
|
14313
|
-
letter-spacing: var(--cds-body-long-01-letter-spacing, 0.16px);
|
|
14314
|
-
/* stylelint-disable-next-line carbon/theme-use */
|
|
14315
|
-
background-color: #161616;
|
|
14316
|
-
block-size: 3rem;
|
|
14317
|
-
border-block-end: 1px solid var(--cds-border-subtle-01, #c6c6c6);
|
|
14318
|
-
/* stylelint-disable-next-line carbon/theme-use */
|
|
14319
|
-
color: #f4f4f4;
|
|
14320
|
-
/* stylelint-disable-next-line carbon/type-use */
|
|
14321
|
-
font-weight: normal !important;
|
|
14322
|
-
/* stylelint-disable-next-line carbon/type-use */
|
|
14323
|
-
line-height: 3rem !important;
|
|
14324
|
-
padding-inline-start: 1rem;
|
|
14325
|
-
}
|
|
14326
|
-
.c4p--interstitial-screen--full-screen .c4p--interstitial-screen--header b {
|
|
14327
|
-
/* stylelint-disable-next-line carbon/type-use */
|
|
14328
|
-
font-weight: 600;
|
|
14329
|
-
}
|
|
14330
|
-
.c4p--interstitial-screen--full-screen .c4p--interstitial-screen--internal-header > h2 {
|
|
14331
|
-
padding: 1rem 2.5rem 0;
|
|
14332
|
-
}
|
|
14333
|
-
.c4p--interstitial-screen--full-screen .c4p--interstitial-screen--internal-header .c4p--interstitial-screen--progress {
|
|
14334
|
-
margin: 4rem 2.5rem 0.75rem;
|
|
14335
|
-
}
|
|
14336
|
-
@media (max-width: 81.98rem) {
|
|
14337
|
-
.c4p--interstitial-screen--full-screen .c4p--interstitial-screen--internal-header .c4p--interstitial-screen--progress {
|
|
14338
|
-
margin-inline-start: 2rem;
|
|
14339
|
-
}
|
|
14340
|
-
}
|
|
14341
|
-
.c4p--interstitial-screen--full-screen .c4p--interstitial-screen--internal-header--has-title .c4p--interstitial-screen--progress {
|
|
14342
|
-
margin-block-start: 1.5rem;
|
|
14343
|
-
}
|
|
14344
|
-
.c4p--interstitial-screen--full-screen .c4p--interstitial-screen--internal-header:has(> :nth-child(1)) {
|
|
14345
|
-
min-block-size: initial;
|
|
14346
|
-
}
|
|
14347
14297
|
.c4p--interstitial-screen--full-screen .c4p--interstitial-screen--footer .c4p--interstitial-screen--skip-btn {
|
|
14348
14298
|
padding-inline-start: 2.5rem !important;
|
|
14349
14299
|
}
|
|
@@ -14353,40 +14303,6 @@ th.c4p--datagrid__select-all-toggle-on.button {
|
|
|
14353
14303
|
}
|
|
14354
14304
|
}
|
|
14355
14305
|
|
|
14356
|
-
.c4p--interstitial-screen-view {
|
|
14357
|
-
block-size: 100%;
|
|
14358
|
-
}
|
|
14359
|
-
|
|
14360
|
-
/* stylelint-disable max-nesting-depth */
|
|
14361
|
-
.c4p--interstitial-screen-view-module {
|
|
14362
|
-
margin: 2rem;
|
|
14363
|
-
}
|
|
14364
|
-
.c4p--interstitial-screen-view-module--heading {
|
|
14365
|
-
font-size: var(--cds-heading-05-font-size, 2rem);
|
|
14366
|
-
font-weight: var(--cds-heading-05-font-weight, 400);
|
|
14367
|
-
line-height: var(--cds-heading-05-line-height, 1.25);
|
|
14368
|
-
letter-spacing: var(--cds-heading-05-letter-spacing, 0);
|
|
14369
|
-
margin-block-end: 2rem;
|
|
14370
|
-
}
|
|
14371
|
-
.c4p--interstitial-screen-view-module--body {
|
|
14372
|
-
font-size: var(--cds-body-01-font-size, 0.875rem);
|
|
14373
|
-
font-weight: var(--cds-body-01-font-weight, 400);
|
|
14374
|
-
line-height: var(--cds-body-01-line-height, 1.42857);
|
|
14375
|
-
letter-spacing: var(--cds-body-01-letter-spacing, 0.16px);
|
|
14376
|
-
}
|
|
14377
|
-
|
|
14378
|
-
.c4p--interstitial-screen--modal .c4p--interstitial-screen-view-module {
|
|
14379
|
-
margin: 5rem 2rem;
|
|
14380
|
-
}
|
|
14381
|
-
.c4p--interstitial-screen--full-screen .c4p--interstitial-screen-view-module {
|
|
14382
|
-
margin: 6rem 2.5rem;
|
|
14383
|
-
}
|
|
14384
|
-
@media (max-width: 81.98rem) {
|
|
14385
|
-
.c4p--interstitial-screen--full-screen .c4p--interstitial-screen-view-module {
|
|
14386
|
-
margin: 6rem 2rem;
|
|
14387
|
-
}
|
|
14388
|
-
}
|
|
14389
|
-
|
|
14390
14306
|
.c4p--delimited-list-truncate {
|
|
14391
14307
|
overflow: hidden;
|
|
14392
14308
|
text-overflow: ellipsis;
|