@carbon/ibm-products 2.0.0-rc.22 → 2.0.0-rc.24

package/css/index-full-carbon.css

@@ -1006,7 +1006,7 @@
 .c4p--action-set.cds--btn-set.c4p--action-set--xl .c4p--action-set__action-button:not(.c4p--action-set__action-button--ghost),
 .c4p--action-set.cds--btn-set.c4p--action-set--2xl .c4p--action-set__action-button:not(.c4p--action-set__action-button--ghost),
 .c4p--action-set.cds--btn-set.c4p--action-set--row-quadruple .c4p--action-set__action-button:not(.c4p--action-set__action-button--ghost) {
-  max-width: rem(232px);
+  max-width: 14.5rem;
   flex: 0 1 25%;
 }
 
@@ -3640,6 +3640,9 @@
 .c4p--tearsheet.c4p--tearsheet--wide .c4p--tearsheet__header.c4p--tearsheet__header--with-close-icon {
   padding-right: 4rem;
 }
+.c4p--tearsheet.c4p--tearsheet--narrow .c4p--tearsheet__header-description {
+  max-width: 80%;
+}
 .c4p--tearsheet .c4p--tearsheet__header-navigation {
   margin: 0.75rem 0 0;
 }
@@ -3673,6 +3676,7 @@
 .c4p--tearsheet .c4p--tearsheet__main {
   display: flex;
   flex-direction: row;
+  background-color: var(--cds-layer);
   grid-column: 1/-1;
   grid-row: 1/-1;
 }
@@ -3684,9 +3688,6 @@
   overflow: auto;
   flex-grow: 1;
 }
-.c4p--tearsheet.c4p--tearsheet--wide .c4p--tearsheet__content {
-  background: var(--cds-background, #ffffff);
-}
 .c4p--tearsheet.c4p--tearsheet--wide .c4p--tearsheet__content .cds--pagination,
 .c4p--tearsheet.c4p--tearsheet--wide .c4p--tearsheet__content .cds--pagination__control-buttons,
 .c4p--tearsheet.c4p--tearsheet--wide .c4p--tearsheet__content .cds--text-input,
@@ -3697,7 +3698,7 @@
 .c4p--tearsheet.c4p--tearsheet--wide .c4p--tearsheet__content .cds--dropdown-list,
 .c4p--tearsheet.c4p--tearsheet--wide .c4p--tearsheet__content .cds--number input[type=number],
 .c4p--tearsheet.c4p--tearsheet--wide .c4p--tearsheet__content .cds--date-picker__input {
-  background-color: var(--cds-field-01, #f4f4f4);
+  background-color: var(--cds-field);
 }
 .c4p--tearsheet.c4p--tearsheet--wide .c4p--tearsheet__content .cds--select--inline .cds--select-input {
   background-color: transparent;
@@ -3883,25 +3884,25 @@
   color: var(--cds-text-primary, #161616);
 }
 .c4p--empty-state .c4p--empty-state__header {
-  font-size: var(--cds-productive-heading-03-font-size, 1.25rem);
-  font-weight: var(--cds-productive-heading-03-font-weight, 400);
-  line-height: var(--cds-productive-heading-03-line-height, 1.4);
-  letter-spacing: var(--cds-productive-heading-03-letter-spacing, 0);
+  font-size: var(--cds-heading-03-font-size, 1.25rem);
+  font-weight: var(--cds-heading-03-font-weight, 400);
+  line-height: var(--cds-heading-03-line-height, 1.4);
+  letter-spacing: var(--cds-heading-03-letter-spacing, 0);
   padding-bottom: 0.375rem;
   margin: 0;
 }
 .c4p--empty-state .c4p--empty-state__subtitle {
-  font-size: var(--cds-body-long-01-font-size, 0.875rem);
-  font-weight: var(--cds-body-long-01-font-weight, 400);
-  line-height: var(--cds-body-long-01-line-height, 1.42857);
-  letter-spacing: var(--cds-body-long-01-letter-spacing, 0.16px);
+  font-size: var(--cds-body-01-font-size, 0.875rem);
+  font-weight: var(--cds-body-01-font-weight, 400);
+  line-height: var(--cds-body-01-line-height, 1.42857);
+  letter-spacing: var(--cds-body-01-letter-spacing, 0.16px);
   padding-bottom: 1rem;
 }
 .c4p--empty-state .c4p--empty-state__header--small {
-  font-size: var(--cds-body-short-02-font-size, 1rem);
-  font-weight: var(--cds-body-short-02-font-weight, 400);
-  line-height: var(--cds-body-short-02-line-height, 1.375);
-  letter-spacing: var(--cds-body-short-02-letter-spacing, 0);
+  font-size: var(--cds-body-compact-02-font-size, 1rem);
+  font-weight: var(--cds-body-compact-02-font-weight, 400);
+  line-height: var(--cds-body-compact-02-line-height, 1.375);
+  letter-spacing: var(--cds-body-compact-02-letter-spacing, 0);
   padding-bottom: 0.5rem;
 }
 .c4p--empty-state .c4p--empty-state__subtitle--small {
@@ -4109,26 +4110,26 @@
 }
 
 .c4p--http-errors .c4p--http-errors__error-code-label {
-  font-size: var(--cds-productive-heading-02-font-size, 1rem);
-  font-weight: var(--cds-productive-heading-02-font-weight, 600);
-  line-height: var(--cds-productive-heading-02-line-height, 1.375);
-  letter-spacing: var(--cds-productive-heading-02-letter-spacing, 0);
+  font-size: var(--cds-heading-compact-02-font-size, 1rem);
+  font-weight: var(--cds-heading-compact-02-font-weight, 600);
+  line-height: var(--cds-heading-compact-02-line-height, 1.375);
+  letter-spacing: var(--cds-heading-compact-02-letter-spacing, 0);
   margin-bottom: 0.25rem;
 }
 
 .c4p--http-errors .c4p--http-errors__title {
-  font-size: var(--cds-productive-heading-05-font-size, 2rem);
-  font-weight: var(--cds-productive-heading-05-font-weight, 400);
-  line-height: var(--cds-productive-heading-05-line-height, 1.25);
-  letter-spacing: var(--cds-productive-heading-05-letter-spacing, 0);
+  font-size: var(--cds-heading-05-font-size, 2rem);
+  font-weight: var(--cds-heading-05-font-weight, 400);
+  line-height: var(--cds-heading-05-line-height, 1.25);
+  letter-spacing: var(--cds-heading-05-letter-spacing, 0);
   margin-bottom: 0.75rem;
 }
 
 .c4p--http-errors .c4p--http-errors__description {
-  font-size: var(--cds-body-short-01-font-size, 0.875rem);
-  font-weight: var(--cds-body-short-01-font-weight, 400);
-  line-height: var(--cds-body-short-01-line-height, 1.28572);
-  letter-spacing: var(--cds-body-short-01-letter-spacing, 0.16px);
+  font-size: var(--cds-body-compact-01-font-size, 0.875rem);
+  font-weight: var(--cds-body-compact-01-font-weight, 400);
+  line-height: var(--cds-body-compact-01-line-height, 1.28572);
+  letter-spacing: var(--cds-body-compact-01-letter-spacing, 0.16px);
   margin-bottom: 1.5rem;
 }
 
@@ -4337,13 +4338,6 @@
   flex-direction: column;
   justify-content: center;
 }
-.c4p--add-select__selections-cell:hover .c4p--add-select__selections-hidden-hover,
-.c4p--add-select__selections .cds--structured-list-row:focus-within .c4p--add-select__selections-hidden-hover {
-  visibility: visible;
-}
-.c4p--add-select__selections-hidden-hover {
-  visibility: hidden;
-}
 .c4p--add-select__selections-row--selected.cds--structured-list-row {
   border-bottom: 1px solid var(--cds-layer-selected-01, #e0e0e0);
   background-color: var(--cds-layer-selected-01, #e0e0e0);
@@ -9864,7 +9858,6 @@ button.c4p--add-select__global-filter-toggle--open {
   top: 0;
   right: 0;
   display: flex;
-  width: var(--c4p--inline-edit--toolbar-width);
   height: 100%;
   justify-content: space-between;
   cursor: text;
@@ -9887,8 +9880,6 @@ button.c4p--add-select__global-filter-toggle--open {
 }
 .c4p--inline-edit.c4p--inline-edit.c4p--inline-edit .c4p--inline-edit__save, .c4p--inline-edit.c4p--inline-edit.c4p--inline-edit .c4p--inline-edit__cancel {
   display: inline-flex;
-  width: var(--c4p--inline-edit--size);
-  max-width: var(--c4p--inline-edit--size);
   height: 100%;
   min-height: initial;
   max-height: var(--c4p--inline-edit--size);
@@ -9952,8 +9943,6 @@ button.c4p--add-select__global-filter-toggle--open {
 }
 .c4p--inline-edit.c4p--inline-edit.c4p--inline-edit .c4p--inline-edit__edit {
   display: inline-flex;
-  width: var(--c4p--inline-edit--size);
-  max-width: var(--c4p--inline-edit--size);
   height: 100%;
   min-height: initial;
   max-height: var(--c4p--inline-edit--size);
@@ -9981,8 +9970,6 @@ button.c4p--add-select__global-filter-toggle--open {
 }
 .c4p--inline-edit .c4p--inline-edit__validation-icon {
   display: inline-flex;
-  width: var(--c4p--inline-edit--size);
-  max-width: var(--c4p--inline-edit--size);
   height: 100%;
   min-height: initial;
   max-height: var(--c4p--inline-edit--size);
@@ -11897,6 +11884,10 @@ th.c4p--datagrid__select-all-toggle-on.button {
   outline-color: var(--cds-support-error, #da1e28);
 }
 
+.c4p--datagrid .cds--text-input:focus {
+  background: var(--cds-field-01, #f4f4f4);
+}
+
 .c4p--datagrid .c4p--datagrid__inline-edit--outer-cell-button--invalid .cds--number input[type=number][data-invalid]:focus ~ .cds--number__controls .cds--number__control-btn.up-icon::after {
   background-color: var(--cds-support-error, #da1e28);
 }
@@ -14007,7 +13998,7 @@ a.cds--side-nav__link--current::before {
 .c4p--action-set.cds--btn-set.c4p--action-set--xl .c4p--action-set__action-button:not(.c4p--action-set__action-button--ghost),
 .c4p--action-set.cds--btn-set.c4p--action-set--2xl .c4p--action-set__action-button:not(.c4p--action-set__action-button--ghost),
 .c4p--action-set.cds--btn-set.c4p--action-set--row-quadruple .c4p--action-set__action-button:not(.c4p--action-set__action-button--ghost) {
-  max-width: rem(232px);
+  max-width: 14.5rem;
   flex: 0 1 25%;
 }
 
@@ -14190,6 +14181,10 @@ a.cds--side-nav__link--current::before {
   padding-right: 4rem;
 }
 
+.c4p--tearsheet.c4p--tearsheet--narrow .c4p--tearsheet__header-description {
+  max-width: 80%;
+}
+
 .c4p--tearsheet .c4p--tearsheet__header-navigation {
   margin: 0.75rem 0 0;
 }
@@ -14230,6 +14225,7 @@ a.cds--side-nav__link--current::before {
 .c4p--tearsheet .c4p--tearsheet__main {
   display: flex;
   flex-direction: row;
+  background-color: var(--cds-layer);
   grid-column: 1/-1;
   grid-row: 1/-1;
 }
@@ -14244,10 +14240,6 @@ a.cds--side-nav__link--current::before {
   flex-grow: 1;
 }
 
-.c4p--tearsheet.c4p--tearsheet--wide .c4p--tearsheet__content {
-  background: var(--cds-background, #ffffff);
-}
-
 .c4p--tearsheet.c4p--tearsheet--wide .c4p--tearsheet__content .cds--pagination,
 .c4p--tearsheet.c4p--tearsheet--wide .c4p--tearsheet__content .cds--pagination__control-buttons,
 .c4p--tearsheet.c4p--tearsheet--wide .c4p--tearsheet__content .cds--text-input,
@@ -14258,7 +14250,7 @@ a.cds--side-nav__link--current::before {
 .c4p--tearsheet.c4p--tearsheet--wide .c4p--tearsheet__content .cds--dropdown-list,
 .c4p--tearsheet.c4p--tearsheet--wide .c4p--tearsheet__content .cds--number input[type=number],
 .c4p--tearsheet.c4p--tearsheet--wide .c4p--tearsheet__content .cds--date-picker__input {
-  background-color: var(--cds-field-01, #f4f4f4);
+  background-color: var(--cds-field);
 }
 
 .c4p--tearsheet.c4p--tearsheet--wide .c4p--tearsheet__content .cds--select--inline .cds--select-input {