@carbon/ibm-products 1.0.0-rc.2 → 1.0.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/README.md +11 -12
- package/css/index-full-carbon.css +23 -6
- package/css/index-full-carbon.css.map +1 -1
- package/css/index-full-carbon.min.css +1 -1
- package/css/index-without-carbon-released-only.css +23 -6
- 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.css +23 -6
- package/css/index-without-carbon.css.map +1 -1
- package/css/index-without-carbon.min.css +1 -1
- package/css/index.css +23 -6
- package/css/index.css.map +1 -1
- package/css/index.min.css +1 -1
- package/es/components/PageHeader/PageHeader.js +8 -8
- package/es/components/_Canary/Canary.js +1 -1
- package/es/global/js/utils/story-helper.js +22 -0
- package/lib/components/PageHeader/PageHeader.js +8 -8
- package/lib/components/_Canary/Canary.js +1 -1
- package/lib/global/js/utils/story-helper.js +29 -2
- package/package.json +2 -2
- package/scss/components/PageHeader/_page-header.scss +33 -6
package/css/index.css
CHANGED
|
@@ -18901,6 +18901,16 @@ a.bx--side-nav__link--current::before {
|
|
|
18901
18901
|
background-color: var(--to-color);
|
|
18902
18902
|
}
|
|
18903
18903
|
}
|
|
18904
|
+
@keyframes background-and-shadow-appear {
|
|
18905
|
+
from {
|
|
18906
|
+
background-color: var(--from-color);
|
|
18907
|
+
box-shadow: 0 1px 0 var(--from-color);
|
|
18908
|
+
}
|
|
18909
|
+
to {
|
|
18910
|
+
background-color: var(--to-color);
|
|
18911
|
+
box-shadow: 0 1px 0 var(--to-color-shadow);
|
|
18912
|
+
}
|
|
18913
|
+
}
|
|
18904
18914
|
.c4p--page-header.c4p--page-header {
|
|
18905
18915
|
/* Bleed class for the background */
|
|
18906
18916
|
position: sticky;
|
|
@@ -18928,16 +18938,16 @@ a.bx--side-nav__link--current::before {
|
|
|
18928
18938
|
.c4p--page-header::before {
|
|
18929
18939
|
--from-color: var(--cds-ui-background, #ffffff);
|
|
18930
18940
|
--to-color: var(--cds-ui-01, #f4f4f4);
|
|
18941
|
+
--to-color-shadow: var(--cds-ui-03, #e0e0e0);
|
|
18931
18942
|
position: absolute;
|
|
18932
18943
|
top: 0;
|
|
18933
18944
|
left: 0;
|
|
18934
18945
|
display: block;
|
|
18935
18946
|
width: 100%;
|
|
18936
18947
|
height: 100%;
|
|
18937
|
-
animation: background-appear 1000ms calc(-1000ms * var(--c4p--page-header--background-opacity)) linear paused forwards;
|
|
18948
|
+
animation: background-and-shadow-appear 1000ms calc(-1000ms * var(--c4p--page-header--background-opacity)) linear paused forwards;
|
|
18938
18949
|
content: "";
|
|
18939
18950
|
z-index: -1;
|
|
18940
|
-
box-shadow: 0 1px 0 var(--cds-ui-03, #e0e0e0);
|
|
18941
18951
|
}
|
|
18942
18952
|
.c4p--page-header .c4p--page-header--width--xl {
|
|
18943
18953
|
padding-right: var(--cds-spacing-07, 2rem);
|
|
@@ -19067,6 +19077,7 @@ a.bx--side-nav__link--current::before {
|
|
|
19067
19077
|
.c4p--page-header .c4p--page-header__action-bar-column--background::before {
|
|
19068
19078
|
--from-color: var(--cds-ui-background, #ffffff);
|
|
19069
19079
|
--to-color: var(--cds-ui-01, #f4f4f4);
|
|
19080
|
+
--to-color-shadow: var(--cds-ui-03, #e0e0e0);
|
|
19070
19081
|
position: absolute;
|
|
19071
19082
|
top: 0;
|
|
19072
19083
|
left: 0;
|
|
@@ -19237,6 +19248,7 @@ a.bx--side-nav__link--current::before {
|
|
|
19237
19248
|
.c4p--page-header .c4p--page-header__title-row .c4p--page-header__page-actions::before {
|
|
19238
19249
|
--from-color: var(--cds-ui-background, #ffffff);
|
|
19239
19250
|
--to-color: var(--cds-ui-01, #f4f4f4);
|
|
19251
|
+
--to-color-shadow: var(--cds-ui-03, #e0e0e0);
|
|
19240
19252
|
position: absolute;
|
|
19241
19253
|
top: 0;
|
|
19242
19254
|
left: 0;
|
|
@@ -19246,6 +19258,11 @@ a.bx--side-nav__link--current::before {
|
|
|
19246
19258
|
animation: background-appear 1000ms calc(-1000ms * var(--c4p--page-header--background-opacity)) linear paused forwards;
|
|
19247
19259
|
content: "";
|
|
19248
19260
|
}
|
|
19261
|
+
.c4p--page-header .c4p--page-header__page-actions-content {
|
|
19262
|
+
position: relative;
|
|
19263
|
+
width: 100%;
|
|
19264
|
+
height: 100%;
|
|
19265
|
+
}
|
|
19249
19266
|
.c4p--page-header .c4p--page-header__title-row .c4p--page-header__page-actions--in-breadcrumb {
|
|
19250
19267
|
opacity: 0;
|
|
19251
19268
|
visibility: hidden;
|
|
@@ -19267,10 +19284,10 @@ a.bx--side-nav__link--current::before {
|
|
|
19267
19284
|
height: var(--cds-spacing-05, 1rem);
|
|
19268
19285
|
}
|
|
19269
19286
|
.c4p--page-header .c4p--page-header__subtitle {
|
|
19270
|
-
font-size: var(--cds-body-long-
|
|
19271
|
-
font-weight: var(--cds-body-long-
|
|
19272
|
-
line-height: var(--cds-body-long-
|
|
19273
|
-
letter-spacing: var(--cds-body-long-
|
|
19287
|
+
font-size: var(--cds-body-long-01-font-size, 0.875rem);
|
|
19288
|
+
font-weight: var(--cds-body-long-01-font-weight, 400);
|
|
19289
|
+
line-height: var(--cds-body-long-01-line-height, 1.42857);
|
|
19290
|
+
letter-spacing: var(--cds-body-long-01-letter-spacing, 0.16px);
|
|
19274
19291
|
}
|
|
19275
19292
|
.c4p--page-header .c4p--page-header__available-row {
|
|
19276
19293
|
font-size: var(--cds-body-long-01-font-size, 0.875rem);
|