@carbon/ibm-products 1.6.1 → 1.9.0

package/css/index-without-carbon.css

@@ -3060,8 +3060,7 @@
   margin: 0;
 }
 .c4p--tearsheet.c4p--tearsheet--wide .c4p--tearsheet__header--with-close-icon {
-  padding-right: var(--cds-spacing-05, 1rem);
-  margin-right: var(--cds-spacing-09, 3rem);
+  padding-right: var(--cds-spacing-10, 4rem);
 }
 .c4p--tearsheet .c4p--tearsheet__header-content {
   display: flex;
@@ -4884,6 +4883,18 @@
   align-items: center;
   justify-content: space-between;
 }
+.c4p--add-select__selections-cell-title {
+  display: block;
+  color: var(--cds-text-01, #161616);
+}
+.c4p--add-select__selections-cell-subtitle {
+  font-size: var(--cds-label-01-font-size, 0.75rem);
+  font-weight: var(--cds-label-01-font-weight, 400);
+  line-height: var(--cds-label-01-line-height, 1.33333);
+  letter-spacing: var(--cds-label-01-letter-spacing, 0.32px);
+  display: block;
+  color: var(--cds-text-02, #525252);
+}
 
 .c4p--add-select__sidebar-header {
   display: flex;
@@ -4901,6 +4912,17 @@
   margin-right: var(--cds-spacing-03, 0.5rem);
 }
 
+.c4p--add-select__sidebar-selected-item-title {
+  color: var(--cds-text-01, #161616);
+}
+.c4p--add-select__sidebar-selected-item-subtitle {
+  font-size: var(--cds-label-01-font-size, 0.75rem);
+  font-weight: var(--cds-label-01-font-weight, 400);
+  line-height: var(--cds-label-01-line-height, 1.33333);
+  letter-spacing: var(--cds-label-01-letter-spacing, 0.32px);
+  color: var(--cds-text-02, #525252);
+}
+
 .c4p--add-select__sidebar-body {
   padding: var(--cds-spacing-05, 1rem);
 }
@@ -4910,6 +4932,8 @@
   font-weight: var(--cds-label-01-font-weight, 400);
   line-height: var(--cds-label-01-line-height, 1.33333);
   letter-spacing: var(--cds-label-01-letter-spacing, 0.32px);
+  margin-bottom: var(--cds-spacing-03, 0.5rem);
+  color: var(--cds-text-02, #525252);
 }
 
 .c4p--add-select .c4p--add-select__sidebar-item-body {
@@ -4917,7 +4941,31 @@
   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);
-  margin-bottom: var(--cds-spacing-03, 0.5rem);
+  margin-bottom: var(--cds-spacing-05, 1rem);
+}
+
+.c4p--add-select .c4p--add-select__sidebar-item-remove-button:hover {
+  background: var(--cds-disabled-02, #c6c6c6);
+}
+
+.c4p--add-select .c4p--add-select__sidebar-accordion-title {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+}
+
+.c4p--add-select__columns {
+  display: flex;
+  flex-direction: row;
+}
+
+.c4p--add-select__columns .c4p--add-select__selections-cell {
+  padding: 0 var(--cds-spacing-05, 1rem) !important;
+}
+
+.c4p--add-select__column {
+  padding: var(--cds-spacing-05, 1rem);
+  border-right: var(--cds-ui-03, #e0e0e0);
 }
 
 .c4p--add-select .c4p--tearsheet .c4p--tearsheet__influencer {
@@ -4925,6 +4973,10 @@
   flex: 0 0 50%;
 }
 
+.c4p--add-select .c4p--tearsheet__header-description {
+  color: var(--cds-text-02, #525252);
+}
+
 .c4p--add-select .c4p--add-select__items-label {
   font-size: var(--cds-productive-heading-01-font-size, 0.875rem);
   font-weight: var(--cds-productive-heading-01-font-weight, 600);
@@ -4940,6 +4992,10 @@
   padding-bottom: var(--cds-spacing-05, 1rem);
 }
 
+.c4p--add-select .bx--radio-button__appearance {
+  margin: 0 var(--cds-spacing-05, 1rem) 0 0;
+}
+
 .c4p--add-select .bx--radio-button-wrapper .bx--radio-button__label {
   justify-content: left;
 }
@@ -4948,6 +5004,17 @@
   cursor: pointer;
 }
 
+.c4p--add-select .bx--accordion__item:hover .c4p--add-select__sidebar-accordion-title button {
+  opacity: 1;
+}
+.c4p--add-select .bx--accordion__item .c4p--add-select__sidebar-accordion-title button {
+  opacity: 0;
+}
+
+.c4p--add-select .bx--checkbox-label-text {
+  padding-left: var(--cds-spacing-05, 1rem);
+}
+
 /* stylelint-disable-line no-invalid-position-at-import-rule */
 /* stylelint-disable-line no-invalid-position-at-import-rule */
 /* stylelint-disable-line no-invalid-position-at-import-rule */
@@ -9990,134 +10057,6 @@
     transition: none;
   }
 }
-/* stylelint-disable-line no-invalid-position-at-import-rule */
-/* stylelint-disable-line no-invalid-position-at-import-rule */
-/* stylelint-disable-line no-invalid-position-at-import-rule */
-.c4p--cancelable-text-edit {
-  --size: var(--cds-spacing-08, 2.5rem);
-  --icon-size: var(--cds-spacing-05, 1rem);
-}
-
-.c4p--cancelable-text-edit--sm {
-  --size: var(--cds-spacing-07, 2rem);
-  --icon-size: var(--cds-spacing-05, 1rem);
-}
-
-.c4p--cancelable-text-edit--lg {
-  --size: var(--cds-spacing-09, 3rem);
-  --icon-size: var(--cds-spacing-05, 1rem);
-}
-
-.c4p--cancelable-text-edit.c4p--cancelable-text-edit.c4p--cancelable-text-edit .c4p--cancelable-text-edit__main {
-  position: relative;
-  display: inline-flex;
-  width: 100%;
-  min-height: var(--size);
-  vertical-align: top;
-}
-.c4p--cancelable-text-edit.c4p--cancelable-text-edit.c4p--cancelable-text-edit .c4p--cancelable-text-edit__input {
-  height: var(--size);
-  padding-right: calc(2 * var(--size));
-}
-.c4p--cancelable-text-edit.c4p--cancelable-text-edit.c4p--cancelable-text-edit .c4p--cancelable-text-edit__buttons {
-  position: absolute;
-  top: 0;
-  right: 0;
-  display: flex;
-  flex-direction: column;
-}
-.c4p--cancelable-text-edit.c4p--cancelable-text-edit.c4p--cancelable-text-edit .c4p--cancelable-text-edit__buttons-inner {
-  display: flex;
-}
-.c4p--cancelable-text-edit.c4p--cancelable-text-edit.c4p--cancelable-text-edit .c4p--cancelable-text-edit__revert,
-.c4p--cancelable-text-edit.c4p--cancelable-text-edit.c4p--cancelable-text-edit .c4p--cancelable-text-edit__save {
-  border: 1px solid transparent;
-}
-.c4p--cancelable-text-edit.c4p--cancelable-text-edit.c4p--cancelable-text-edit .c4p--cancelable-text-edit__revert:hover,
-.c4p--cancelable-text-edit.c4p--cancelable-text-edit.c4p--cancelable-text-edit .c4p--cancelable-text-edit__save:hover {
-  border-color: var(--cds-hover-field, #e5e5e5);
-  border-bottom-color: transparent;
-  background-clip: content-box;
-  box-shadow: initial;
-  outline: initial;
-}
-.c4p--cancelable-text-edit.c4p--cancelable-text-edit.c4p--cancelable-text-edit .c4p--cancelable-text-edit__revert:focus:active, .c4p--cancelable-text-edit.c4p--cancelable-text-edit.c4p--cancelable-text-edit .c4p--cancelable-text-edit__revert:focus,
-.c4p--cancelable-text-edit.c4p--cancelable-text-edit.c4p--cancelable-text-edit .c4p--cancelable-text-edit__save:focus:active,
-.c4p--cancelable-text-edit.c4p--cancelable-text-edit.c4p--cancelable-text-edit .c4p--cancelable-text-edit__save:focus {
-  border-color: var(--cds-focus, #0f62fe);
-  box-shadow: inset 0 0 0 1px var(--cds-focus, #0f62fe);
-  outline: initial;
-}
-.c4p--cancelable-text-edit.c4p--cancelable-text-edit.c4p--cancelable-text-edit .c4p--cancelable-text-edit__revert:focus:active:hover,
-.c4p--cancelable-text-edit.c4p--cancelable-text-edit.c4p--cancelable-text-edit .c4p--cancelable-text-edit__save:focus:active:hover {
-  box-shadow: inset 0 0 0 1px var(--cds-focus, #0f62fe), inset 0 0 0 2px var(--cds-field-01, #f4f4f4);
-}
-.c4p--cancelable-text-edit.c4p--cancelable-text-edit.c4p--cancelable-text-edit .c4p--cancelable-text-edit__revert::before,
-.c4p--cancelable-text-edit.c4p--cancelable-text-edit.c4p--cancelable-text-edit .c4p--cancelable-text-edit__save::before {
-  background-color: transparent;
-}
-.c4p--cancelable-text-edit.c4p--cancelable-text-edit.c4p--cancelable-text-edit .c4p--cancelable-text-edit__revert[disabled],
-.c4p--cancelable-text-edit.c4p--cancelable-text-edit.c4p--cancelable-text-edit .c4p--cancelable-text-edit__save[disabled] {
-  border-color: transparent;
-}
-.c4p--cancelable-text-edit.c4p--cancelable-text-edit.c4p--cancelable-text-edit.c4p--cancelable-text-edit--invalid .c4p--cancelable-text-edit__save:hover,
-.c4p--cancelable-text-edit.c4p--cancelable-text-edit.c4p--cancelable-text-edit.c4p--cancelable-text-edit--invalid .c4p--cancelable-text-edit__revert:hover {
-  border: 1px solid transparent;
-  box-shadow: inset 0 1px 0 var(--cds-support-01, #da1e28), inset 0 -1px 0 var(--cds-support-01, #da1e28);
-}
-.c4p--cancelable-text-edit.c4p--cancelable-text-edit.c4p--cancelable-text-edit.c4p--cancelable-text-edit--invalid .c4p--cancelable-text-edit__save:hover {
-  box-shadow: inset 0 1px 0 var(--cds-support-01, #da1e28), inset 0 -1px 0 var(--cds-support-01, #da1e28), inset -1px 0 0 var(--cds-support-01, #da1e28);
-}
-.c4p--cancelable-text-edit.c4p--cancelable-text-edit.c4p--cancelable-text-edit .bx--text-input-wrapper:focus-within ~ .c4p--cancelable-text-edit__buttons .c4p--cancelable-text-edit__revert,
-.c4p--cancelable-text-edit.c4p--cancelable-text-edit.c4p--cancelable-text-edit .bx--text-input-wrapper:focus-within ~ .c4p--cancelable-text-edit__buttons .c4p--cancelable-text-edit__save {
-  border: 1px solid transparent;
-  box-shadow: inset 0 1px 0 var(--cds-focus, #0f62fe), inset 0 -1px 0 var(--cds-focus, #0f62fe);
-}
-.c4p--cancelable-text-edit.c4p--cancelable-text-edit.c4p--cancelable-text-edit .bx--text-input-wrapper:focus-within ~ .c4p--cancelable-text-edit__buttons .c4p--cancelable-text-edit__revert:hover,
-.c4p--cancelable-text-edit.c4p--cancelable-text-edit.c4p--cancelable-text-edit .bx--text-input-wrapper:focus-within ~ .c4p--cancelable-text-edit__buttons .c4p--cancelable-text-edit__save:hover {
-  background-clip: content-box;
-}
-.c4p--cancelable-text-edit.c4p--cancelable-text-edit.c4p--cancelable-text-edit .bx--text-input-wrapper:focus-within ~ .c4p--cancelable-text-edit__buttons .c4p--cancelable-text-edit__save {
-  box-shadow: inset 0 1px 0 var(--cds-focus, #0f62fe), inset 0 -1px 0 var(--cds-focus, #0f62fe), inset -1px 0 0 var(--cds-focus, #0f62fe);
-}
-.c4p--cancelable-text-edit.c4p--cancelable-text-edit.c4p--cancelable-text-edit .c4p--cancelable-text-edit__revert,
-.c4p--cancelable-text-edit.c4p--cancelable-text-edit.c4p--cancelable-text-edit .c4p--cancelable-text-edit__save {
-  display: flex;
-  width: var(--size);
-  height: var(--size);
-  min-height: var(--size);
-  flex-direction: column;
-  align-items: center;
-  justify-content: center;
-  padding: 0;
-}
-.c4p--cancelable-text-edit.c4p--cancelable-text-edit.c4p--cancelable-text-edit .c4p--cancelable-text-edit__revert svg,
-.c4p--cancelable-text-edit.c4p--cancelable-text-edit.c4p--cancelable-text-edit .c4p--cancelable-text-edit__save svg {
-  width: var(--icon-size);
-  height: var(--icon-size);
-}
-.c4p--cancelable-text-edit.c4p--cancelable-text-edit.c4p--cancelable-text-edit.c4p--cancelable-text-edit--invalid .bx--form-requirement, .c4p--cancelable-text-edit.c4p--cancelable-text-edit.c4p--cancelable-text-edit.c4p--cancelable-text-edit--warn .bx--form-requirement {
-  display: block;
-  max-height: initial;
-}
-.c4p--cancelable-text-edit.c4p--cancelable-text-edit.c4p--cancelable-text-edit.c4p--cancelable-text-edit--invalid.c4p--cancelable-text-edit--inline .bx--form-requirement, .c4p--cancelable-text-edit.c4p--cancelable-text-edit.c4p--cancelable-text-edit.c4p--cancelable-text-edit--warn.c4p--cancelable-text-edit--inline .bx--form-requirement {
-  margin-left: calc(20% + 1.25rem);
-}
-.c4p--cancelable-text-edit.c4p--cancelable-text-edit.c4p--cancelable-text-edit.c4p--cancelable-text-edit--invalid .bx--form-requirement {
-  display: block;
-  overflow: visible;
-  color: var(--cds-text-error, #da1e28);
-}
-.c4p--cancelable-text-edit.c4p--cancelable-text-edit.c4p--cancelable-text-edit .bx--text-input {
-  padding-right: calc(2 * var(--size));
-}
-.c4p--cancelable-text-edit.c4p--cancelable-text-edit.c4p--cancelable-text-edit .bx--text-input--invalid {
-  padding-right: calc(3 * var(--size));
-}
-.c4p--cancelable-text-edit.c4p--cancelable-text-edit.c4p--cancelable-text-edit .bx--text-input__invalid-icon {
-  margin-right: var(--cds-spacing-11, 5rem);
-}
-
 /* stylelint-disable-line no-invalid-position-at-import-rule */
 /* stylelint-disable-line no-invalid-position-at-import-rule */
 /* stylelint-disable-line no-invalid-position-at-import-rule */
@@ -10132,6 +10071,7 @@
   background-color: var(--c4p--inline-edit--background-color);
   cursor: text;
   transition: background-color 70ms cubic-bezier(0, 0, 0.38, 0.9), box-shadow 70ms cubic-bezier(0, 0, 0.38, 0.9), border-color 70ms cubic-bezier(0, 0, 0.38, 0.9);
+  vertical-align: middle;
   white-space: nowrap;
 }
 .c4p--inline-edit.c4p--inline-edit--light {
@@ -10148,22 +10088,22 @@
   --c4p--inline-edit--size: var(--cds-spacing-09, 3rem);
   --c4p--inline-edit--icon-size: var(--cds-spacing-05, 1rem);
 }
-.c4p--inline-edit.c4p--inline-edit--editing {
-  outline: var(--cds-spacing-01, 0.125rem) solid var(--cds-focus, #0f62fe);
+.c4p--inline-edit.c4p--inline-edit--invalid {
+  outline: var(--cds-spacing-01, 0.125rem) solid var(--cds-support-01, #da1e28);
   outline-offset: calc(-1 * var(--cds-spacing-01, 0.125rem));
-  background-color: var(--cds-ui-01, #f4f4f4);
 }
 @media screen and (prefers-contrast) {
-  .c4p--inline-edit.c4p--inline-edit--editing {
+  .c4p--inline-edit.c4p--inline-edit--invalid {
     outline-style: dotted;
   }
 }
-.c4p--inline-edit .c4p--inline-edit--invalid {
-  outline: var(--cds-spacing-01, 0.125rem) solid var(--cds-support-01, #da1e28);
+.c4p--inline-edit.c4p--inline-edit--editing {
+  outline: var(--cds-spacing-01, 0.125rem) solid var(--cds-focus, #0f62fe);
   outline-offset: calc(-1 * var(--cds-spacing-01, 0.125rem));
+  background-color: var(--cds-ui-01, #f4f4f4);
 }
 @media screen and (prefers-contrast) {
-  .c4p--inline-edit .c4p--inline-edit--invalid {
+  .c4p--inline-edit.c4p--inline-edit--editing {
     outline-style: dotted;
   }
 }
@@ -10185,10 +10125,13 @@
   top: 0;
   left: 0;
   display: block;
+  overflow: hidden;
+  width: 0;
   margin-left: var(--cds-spacing-05, 1rem);
   color: var(--cds-text-05, #6f6f6f);
   content: attr(data-placeholder);
   opacity: 0;
+  visibility: hidden;
 }
 .c4p--inline-edit .c4p--inline-edit__ellipsis {
   display: inline-block;
@@ -10217,8 +10160,10 @@
   pointer-events: all;
 }
 .c4p--inline-edit .c4p--inline-edit__input--empty::after {
+  width: initial;
   opacity: 1;
   transition: opacity 240ms cubic-bezier(0.2, 0, 0.38, 0.9);
+  visibility: visible;
 }
 .c4p--inline-edit .c4p--inline-edit__after-input-elements {
   position: absolute;
@@ -10298,11 +10243,16 @@
   box-shadow: initial;
   outline: initial;
 }
-.c4p--inline-edit .c4p--inline-edit__edit--hover-visible {
-  opacity: 0;
-  transition: opacity 70ms cubic-bezier(0, 0, 0.38, 0.9);
+@media (hover: hover) {
+  .c4p--inline-edit .c4p--inline-edit__edit {
+    opacity: 0;
+    transition: opacity 70ms cubic-bezier(0, 0, 0.38, 0.9);
+  }
+  .c4p--inline-edit:hover .c4p--inline-edit__edit {
+    opacity: 1;
+  }
 }
-.c4p--inline-edit:hover .c4p--inline-edit__edit--hover-visible {
+.c4p--inline-edit .c4p--inline-edit__edit--always-visible {
   opacity: 1;
 }
 .c4p--inline-edit .c4p--inline-edit__validation-icon {
@@ -10331,4 +10281,90 @@
   color: var(--cds-support-error, #da1e28);
 }
 
+/* stylelint-disable-line no-invalid-position-at-import-rule */
+/* stylelint-disable-line no-invalid-position-at-import-rule */
+/* stylelint-disable-line no-invalid-position-at-import-rule */
+.c4p--data-spreadsheet {
+  display: inline-block;
+  border-spacing: 0;
+}
+.c4p--data-spreadsheet.c4p--data-spreadsheet__container-has-focus {
+  outline: 2px solid var(--cds-inverse-link, #78a9ff);
+}
+.c4p--data-spreadsheet .c4p--data-spreadsheet__header--container {
+  position: relative;
+}
+.c4p--data-spreadsheet button.c4p--data-spreadsheet__td {
+  margin: 0;
+  background-color: transparent;
+}
+.c4p--data-spreadsheet .c4p--data-spreadsheet__tr :last-child .c4p--data-spreadsheet__td {
+  border-bottom: 0;
+}
+.c4p--data-spreadsheet .c4p--data-spreadsheet__th,
+.c4p--data-spreadsheet .c4p--data-spreadsheet__td {
+  padding: 0 var(--cds-spacing-03, 0.5rem);
+  border: 0;
+  margin: 0;
+  color: var(--cds-text-01, #161616);
+}
+.c4p--data-spreadsheet .c4p--data-spreadsheet__th:last-child,
+.c4p--data-spreadsheet .c4p--data-spreadsheet__td:last-child {
+  border-right: 1px solid var(--cds-text-03, #a8a8a8);
+}
+.c4p--data-spreadsheet .c4p--data-spreadsheet__th,
+.c4p--data-spreadsheet button.c4p--data-spreadsheet__td-th {
+  border-right: 1px solid var(--cds-text-03, #a8a8a8);
+  border-bottom: 1px solid var(--cds-text-03, #a8a8a8);
+  background-color: var(--cds-ui-01, #f4f4f4);
+  cursor: pointer;
+}
+.c4p--data-spreadsheet .c4p--data-spreadsheet__td-th {
+  font-weight: 600;
+  display: flex;
+  align-items: center;
+  justify-content: flex-end;
+}
+.c4p--data-spreadsheet .c4p--data-spreadsheet__td {
+  border-right: 1px solid var(--cds-ui-03, #e0e0e0);
+  border-bottom: 1px solid var(--cds-ui-03, #e0e0e0);
+  cursor: cell;
+  text-align: left;
+}
+.c4p--data-spreadsheet .c4p--data-spreadsheet__th {
+  font-size: var(--cds-productive-heading-01-font-size, 0.875rem);
+  font-weight: var(--cds-productive-heading-01-font-weight, 600);
+  line-height: var(--cds-productive-heading-01-line-height, 1.28572);
+  letter-spacing: var(--cds-productive-heading-01-letter-spacing, 0.16px);
+  color: var(--cds-text-01, #161616);
+  text-align: left;
+}
+.c4p--data-spreadsheet .c4p--data-spreadsheet__active-cell--highlight {
+  position: absolute;
+  z-index: 2;
+  border: var(--cds-spacing-01, 0.125rem) solid var(--cds-interactive-01, #0f62fe);
+  background-color: transparent;
+}
+.c4p--data-spreadsheet .c4p--data-spreadsheet__active-cell--highlight:focus {
+  border: var(--cds-spacing-01, 0.125rem) solid var(--cds-interactive-01, #0f62fe);
+  outline: 0;
+}
+.c4p--data-spreadsheet .c4p--data-spreadsheet__selection-area--element {
+  position: absolute;
+  z-index: 2;
+  border: 1px solid var(--cds-interactive-01, #0f62fe);
+  pointer-events: none;
+}
+.c4p--data-spreadsheet .c4p--data-spreadsheet__selection-area--element::before {
+  position: absolute;
+  top: 0;
+  left: 0;
+  display: block;
+  width: 100%;
+  height: 100%;
+  background-color: var(--cds-interactive-01, #0f62fe);
+  content: "";
+  opacity: 0.25;
+}
+
 /*# sourceMappingURL=index-without-carbon.css.map */