@carbon/ibm-products-styles 2.50.0 → 2.51.0

package/css/index-full-carbon.css

@@ -10296,7 +10296,7 @@ button.c4p--add-select__global-filter-toggle--open {
 }
 .c4p--datagrid__grid-container table.c4p--datagrid__vertical-align-center .c4p--datagrid__head .c4p--datagrid__head-select-all.c4p--datagrid__checkbox-cell.c4p--datagrid__checkbox-cell-sticky-left {
   position: sticky;
-  z-index: 1;
+  z-index: 10;
   left: 0;
 }
 .c4p--datagrid__grid-container table.c4p--datagrid__vertical-align-center .c4p--datagrid__cell {
@@ -10541,15 +10541,21 @@ button.c4p--add-select__global-filter-toggle--open {
   /* stylelint-disable-next-line declaration-no-important */
   color: var(--cds-link-primary-hover, #0043ce) !important;
 }
-.c4p--datagrid__grid-container .c4p--datagrid__carbon-row td {
+.c4p--datagrid__grid-container .c4p--datagrid__carbon-row .c4p--datagrid__left-sticky-column-cell,
+.c4p--datagrid__grid-container .c4p--datagrid__carbon-row .c4p--datagrid__right-sticky-column-cell,
+.c4p--datagrid__grid-container .c4p--datagrid__carbon-row .c4p--datagrid__checkbox-cell-sticky-left {
   /* stylelint-disable-next-line declaration-no-important */
   background-color: var(--cds-layer-01, #f4f4f4);
 }
-.c4p--datagrid__grid-container .c4p--datagrid__carbon-row:hover td {
+.c4p--datagrid__grid-container .c4p--datagrid__carbon-row:hover .c4p--datagrid__left-sticky-column-cell,
+.c4p--datagrid__grid-container .c4p--datagrid__carbon-row:hover .c4p--datagrid__right-sticky-column-cell,
+.c4p--datagrid__grid-container .c4p--datagrid__carbon-row:hover .c4p--datagrid__checkbox-cell-sticky-left {
   /* stylelint-disable-next-line declaration-no-important */
   background-color: var(--cds-layer-hover-01, #e8e8e8);
 }
-.c4p--datagrid__grid-container .cds--data-table--selected td {
+.c4p--datagrid__grid-container .cds--data-table--selected .c4p--datagrid__left-sticky-column-cell,
+.c4p--datagrid__grid-container .cds--data-table--selected .c4p--datagrid__right-sticky-column-cell,
+.c4p--datagrid__grid-container .cds--data-table--selected .c4p--datagrid__checkbox-cell-sticky-left {
   /* stylelint-disable-next-line declaration-no-important */
   background-color: var(--cds-layer-selected-01, #e0e0e0);
 }
@@ -10634,7 +10640,7 @@ button.c4p--add-select__global-filter-toggle--open {
 }
 
 .c4p--datagrid__resizableColumn:hover {
-  background-color: var(--cds-background-selected-hover, rgba(141, 141, 141, 0.32));
+  background-color: var(--cds-layer-selected-hover);
 }
 .c4p--datagrid__resizableColumn:hover .c4p--datagrid__resizer {
   border-right: 0.125rem solid var(--cds-border-strong-01, #8d8d8d);
@@ -10661,7 +10667,7 @@ button.c4p--add-select__global-filter-toggle--open {
 }
 .c4p--datagrid__head-hidden-select-all.c4p--datagrid__select-all-sticky-left {
   position: sticky;
-  z-index: 1;
+  z-index: 10;
   left: 0;
   background-color: var(--cds-layer-accent-01, #e0e0e0);
 }
@@ -11258,7 +11264,7 @@ button.c4p--add-select__global-filter-toggle--open {
 .c4p--datagrid__left-sticky-column-header {
   /* stylelint-disable-next-line declaration-no-important */
   position: sticky !important;
-  z-index: 1;
+  z-index: 10;
   left: 0;
   border-right: 1px solid var(--cds-border-subtle);
 }
@@ -11287,7 +11293,7 @@ button.c4p--add-select__global-filter-toggle--open {
 
 .c4p--datagrid__select-all-toggle-on.c4p--datagrid__select-all-sticky-left {
   position: sticky;
-  z-index: 1;
+  z-index: 10;
   left: 0;
 }
 
@@ -29666,10 +29672,6 @@ tr.cds--parent-row:not(.cds--expandable-row):not(:first-of-type) td.cds--table-c
   transition: transform 110ms cubic-bezier(0.2, 0, 0.38, 0.9), clip-path 110ms cubic-bezier(0.2, 0, 0.38, 0.9);
 }
 
-.cds--batch-actions ~ .cds--toolbar-content {
-  clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%);
-}
-
 .cds--toolbar-content .cds--search .cds--search-input {
   padding: 0 3rem;
   background-color: transparent;
@@ -31751,7 +31753,7 @@ th .cds--table-sort__flex {
   display: inline-grid;
   align-items: center;
   grid-gap: 0 1.5rem;
-  grid-template: auto auto/auto min-content;
+  grid-template: auto/auto min-content;
 }
 .cds--dropdown__wrapper--inline .cds--label {
   font-size: var(--cds-body-compact-01-font-size, 0.875rem);
@@ -33032,6 +33034,12 @@ button.cds--dropdown-text:focus {
 }
 
 .cds--list-box__wrapper--fluid .cds--skeleton .cds--list-box__field {
+  position: relative;
+  padding: 0;
+  border: none;
+  background: var(--cds-skeleton-background, #e8e8e8);
+  box-shadow: none;
+  pointer-events: none;
   position: absolute;
   padding: 0;
   block-size: 0.5rem;
@@ -33039,19 +33047,59 @@ button.cds--dropdown-text:focus {
   inset-block-start: 2.25rem;
   inset-inline-start: 1rem;
 }
+.cds--list-box__wrapper--fluid .cds--skeleton .cds--list-box__field:hover, .cds--list-box__wrapper--fluid .cds--skeleton .cds--list-box__field:focus, .cds--list-box__wrapper--fluid .cds--skeleton .cds--list-box__field:active {
+  border: none;
+  cursor: default;
+  outline: none;
+}
+.cds--list-box__wrapper--fluid .cds--skeleton .cds--list-box__field::before {
+  position: absolute;
+  animation: 3000ms ease-in-out cds--skeleton infinite;
+  background: var(--cds-skeleton-element, #c6c6c6);
+  block-size: 100%;
+  content: "";
+  inline-size: 100%;
+  inset-inline-start: 0;
+  will-change: transform-origin, transform, opacity;
+}
+@media (prefers-reduced-motion: reduce) {
+  .cds--list-box__wrapper--fluid .cds--skeleton .cds--list-box__field::before {
+    animation: none;
+  }
+}
 
 .cds--list-box__wrapper--fluid .cds--skeleton .cds--list-box__label {
+  position: relative;
+  padding: 0;
+  border: none;
+  background: var(--cds-skeleton-background, #e8e8e8);
+  box-shadow: none;
+  pointer-events: none;
   position: absolute;
   block-size: 0.5rem;
   inline-size: 25%;
   inset-block-start: 1rem;
   inset-inline-start: 1rem;
 }
-
-.cds--list-box__wrapper--fluid .cds--skeleton .cds--list-box__field,
-.cds--list-box__wrapper--fluid .cds--skeleton .cds--list-box__label {
-  animation: 3000ms ease-in-out skeleton infinite;
+.cds--list-box__wrapper--fluid .cds--skeleton .cds--list-box__label:hover, .cds--list-box__wrapper--fluid .cds--skeleton .cds--list-box__label:focus, .cds--list-box__wrapper--fluid .cds--skeleton .cds--list-box__label:active {
+  border: none;
+  cursor: default;
+  outline: none;
+}
+.cds--list-box__wrapper--fluid .cds--skeleton .cds--list-box__label::before {
+  position: absolute;
+  animation: 3000ms ease-in-out cds--skeleton infinite;
   background: var(--cds-skeleton-element, #c6c6c6);
+  block-size: 100%;
+  content: "";
+  inline-size: 100%;
+  inset-inline-start: 0;
+  will-change: transform-origin, transform, opacity;
+}
+@media (prefers-reduced-motion: reduce) {
+  .cds--list-box__wrapper--fluid .cds--skeleton .cds--list-box__label::before {
+    animation: none;
+  }
 }
 
 .cds--list-box__wrapper--fluid.cds--list-box__wrapper--slug .cds--slug {
@@ -34093,7 +34141,6 @@ button.cds--dropdown-text:focus {
   background: var(--cds-skeleton-background, #e8e8e8);
   box-shadow: none;
   pointer-events: none;
-  block-size: 2.5rem;
   inline-size: 100%;
 }
 .cds--number.cds--skeleton:hover, .cds--number.cds--skeleton:focus, .cds--number.cds--skeleton:active {
@@ -34120,6 +34167,18 @@ button.cds--dropdown-text:focus {
   display: none;
 }
 
+.cds--number.cds--skeleton.cds--number--sm {
+  block-size: 2rem;
+}
+
+.cds--number.cds--skeleton.cds--number--md {
+  block-size: 2.5rem;
+}
+
+.cds--number.cds--skeleton.cds--number--lg {
+  block-size: 3rem;
+}
+
 @media screen and (-ms-high-contrast: active), (forced-colors: active) {
   .cds--number__control-btn:hover,
   .cds--number__control-btn:focus {
@@ -36138,6 +36197,9 @@ optgroup.cds--select-optgroup:disabled,
   margin: 0;
   block-size: 4rem;
   max-inline-size: none;
+}
+
+.cds--modal-footer .cds--btn:not(.cds--skeleton) {
   padding-block: 0.875rem 2rem;
 }
 
@@ -40801,9 +40863,16 @@ span.cds--pagination__text.cds--pagination__items-count {
   }
 }
 
-.cds--toggle__button:focus + .cds--toggle__label .cds--toggle__switch,
-.cds--toggle:not(.cds--toggle--disabled):active .cds--toggle__switch {
-  box-shadow: 0 0 0 1px var(--cds-focus-inset, #ffffff), 0 0 0 3px var(--cds-focus, #0f62fe);
+.cds--toggle__button:focus + .cds--toggle__label .cds--toggle__switch::after,
+.cds--toggle:not(.cds--toggle--disabled):active .cds--toggle__switch::after {
+  display: block;
+  border: 2px solid var(--cds-focus, #0f62fe);
+  border-radius: 1rem;
+  block-size: calc(100% + 0.375rem);
+  content: "";
+  inline-size: calc(100% + 0.375rem);
+  margin-block-start: -0.1875rem;
+  margin-inline-start: -0.1875rem;
 }
 
 .cds--toggle__switch--checked {