@carbon/styles 1.8.0 → 1.10.0-rc.0

package/css/styles.css

@@ -2751,6 +2751,8 @@ em {
 }
 
 .cds--white {
+  background: var(--cds-background);
+  color: var(--cds-text-primary);
   --cds-background: #ffffff;
   --cds-background-active: rgba(141, 141, 141, 0.5);
   --cds-background-brand: #0f62fe;
@@ -2918,6 +2920,8 @@ em {
 }
 
 .cds--g10 {
+  background: var(--cds-background);
+  color: var(--cds-text-primary);
   --cds-background: #f4f4f4;
   --cds-background-active: rgba(141, 141, 141, 0.5);
   --cds-background-brand: #0f62fe;
@@ -3085,6 +3089,8 @@ em {
 }
 
 .cds--g90 {
+  background: var(--cds-background);
+  color: var(--cds-text-primary);
   --cds-background: #262626;
   --cds-background-active: rgba(141, 141, 141, 0.4);
   --cds-background-brand: #0f62fe;
@@ -3247,6 +3253,8 @@ em {
 }
 
 .cds--g100 {
+  background: var(--cds-background);
+  color: var(--cds-text-primary);
   --cds-background: #161616;
   --cds-background-active: rgba(141, 141, 141, 0.4);
   --cds-background-brand: #0f62fe;
@@ -3454,6 +3462,7 @@ em {
           appearance: none;
   background: none;
   cursor: pointer;
+  text-align: start;
   width: 100%;
   position: relative;
   display: -webkit-box;
@@ -4856,12 +4865,71 @@ li.cds--accordion__item--disabled:last-of-type {
   margin-bottom: 0;
 }
 
-.cds--label .cds--tooltip__trigger {
+.cds--label + .cds--tooltip {
+  position: relative;
+  top: 0.2rem;
+  left: 0.5rem;
+}
+
+.cds--label + .cds--tooltip .cds--tooltip__trigger {
+  -webkit-box-sizing: border-box;
+          box-sizing: border-box;
+  padding: 0;
+  border: 0;
+  margin: 0;
+  font-family: inherit;
+  font-size: 100%;
+  vertical-align: baseline;
+  display: inline-block;
+  padding: 0;
+  border: 0;
+  -webkit-appearance: none;
+     -moz-appearance: none;
+          appearance: none;
+  background: none;
+  cursor: pointer;
+  text-align: start;
+  width: 100%;
+  display: -webkit-box;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-box-align: center;
+      -ms-flex-align: center;
+          align-items: center;
+  -webkit-box-pack: center;
+      -ms-flex-pack: center;
+          justify-content: center;
   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);
 }
+.cds--label + .cds--tooltip .cds--tooltip__trigger *,
+.cds--label + .cds--tooltip .cds--tooltip__trigger *::before,
+.cds--label + .cds--tooltip .cds--tooltip__trigger *::after {
+  -webkit-box-sizing: inherit;
+          box-sizing: inherit;
+}
+.cds--label + .cds--tooltip .cds--tooltip__trigger::-moz-focus-inner {
+  border: 0;
+}
+
+.cds--label + .cds--tooltip .cds--tooltip__trigger:focus {
+  outline: 1px solid var(--cds-focus, #0f62fe);
+}
+
+.cds--label + .cds--tooltip .cds--tooltip__trigger svg {
+  fill: var(--cds-icon-secondary, #525252);
+}
+
+.cds--label + .cds--tooltip .cds--tooltip__trigger svg :hover {
+  fill: var(--cds-icon-primary, #161616);
+}
+
+.cds--label + .cds--toggletip {
+  top: 0.2rem;
+  left: 0.5rem;
+}
 
 .cds--label.cds--skeleton {
   position: relative;
@@ -7110,7 +7178,8 @@ fieldset[disabled] .cds--form__helper-text {
   border-bottom: 0;
 }
 
-.cds--list-box[data-invalid].cds--list-box--inline .cds--list-box__field {
+.cds--list-box[data-invalid].cds--list-box--inline .cds--list-box__field,
+.cds--list-box.cds--list-box--warning.cds--list-box--inline .cds--list-box__field {
   padding-right: 3.5rem;
 }
 
@@ -7250,6 +7319,7 @@ fieldset[disabled] .cds--form__helper-text {
           appearance: none;
   background: none;
   cursor: pointer;
+  text-align: start;
   width: 100%;
   position: relative;
   display: -webkit-inline-box;
@@ -7352,6 +7422,7 @@ fieldset[disabled] .cds--form__helper-text {
           appearance: none;
   background: none;
   cursor: pointer;
+  text-align: start;
   position: absolute;
   right: 1rem;
   display: -webkit-box;
@@ -7412,6 +7483,7 @@ fieldset[disabled] .cds--form__helper-text {
           appearance: none;
   background: none;
   cursor: pointer;
+  text-align: start;
   position: absolute;
   top: 50%;
   /* to preserve .5rem space between icons according to spec top/transform used to center the combobox clear selection icon in IE11 */
@@ -8111,6 +8183,16 @@ fieldset[disabled] .cds--form__helper-text {
   letter-spacing: var(--cds-body-compact-01-letter-spacing, 0.16px);
   color: var(--cds-text-secondary, #525252);
 }
+@media (min-width: 42rem) {
+  .cds--data-table-header__description {
+    max-width: 50ch;
+  }
+}
+@media (min-width: 66rem) {
+  .cds--data-table-header__description {
+    max-width: 80ch;
+  }
+}
 
 .cds--data-table {
   width: 100%;
@@ -8963,6 +9045,7 @@ tr.cds--data-table--selected:last-of-type td {
           appearance: none;
   background: none;
   cursor: pointer;
+  text-align: start;
   width: 100%;
   display: -webkit-box;
   display: -ms-flexbox;
@@ -9001,6 +9084,7 @@ tr.cds--data-table--selected:last-of-type td {
           appearance: none;
   background: none;
   cursor: pointer;
+  text-align: start;
   width: 100%;
   display: -webkit-box;
   display: -ms-flexbox;
@@ -9561,6 +9645,7 @@ tr.cds--parent-row.cds--expandable-row.cds--expandable-row--hover td:first-of-ty
           appearance: none;
   background: none;
   cursor: pointer;
+  text-align: start;
   display: -webkit-inline-box;
   display: -ms-inline-flexbox;
   display: inline-flex;
@@ -9900,6 +9985,7 @@ tr.cds--parent-row.cds--data-table--selected.cds--expandable-row--hover + tr[dat
           appearance: none;
   background: none;
   cursor: pointer;
+  text-align: start;
   display: -webkit-box;
   display: -ms-flexbox;
   display: flex;
@@ -14285,6 +14371,7 @@ button.cds--dropdown-text:focus {
           appearance: none;
   background: none;
   cursor: pointer;
+  text-align: start;
   width: 100%;
   position: relative;
   display: -webkit-inline-box;
@@ -14645,6 +14732,7 @@ button.cds--dropdown-text:focus {
           appearance: none;
   background: none;
   cursor: pointer;
+  text-align: start;
   width: 100%;
   outline: 2px solid transparent;
   outline-offset: -2px;
@@ -15892,6 +15980,7 @@ span.cds--pagination__text.cds--pagination__items-count {
           appearance: none;
   background: none;
   cursor: pointer;
+  text-align: start;
   position: relative;
   display: block;
   min-width: 3rem;
@@ -16543,6 +16632,7 @@ span.cds--pagination__text.cds--pagination__items-count {
           appearance: none;
   background: none;
   cursor: pointer;
+  text-align: start;
   width: 100%;
   border-bottom: 1px dotted var(--cds-border-strong);
   border-radius: 0;
@@ -16784,6 +16874,7 @@ span.cds--pagination__text.cds--pagination__items-count {
           appearance: none;
   background: none;
   cursor: pointer;
+  text-align: start;
   width: 100%;
   display: -webkit-box;
   display: -ms-flexbox;
@@ -17354,6 +17445,7 @@ span.cds--pagination__text.cds--pagination__items-count {
           appearance: none;
   background: none;
   cursor: pointer;
+  text-align: start;
   outline: 2px solid transparent;
   outline-offset: -2px;
   position: absolute;
@@ -18444,6 +18536,7 @@ span.cds--pagination__text.cds--pagination__items-count {
           appearance: none;
   background: none;
   cursor: pointer;
+  text-align: start;
   width: 100%;
   display: -webkit-box;
   display: -ms-flexbox;
@@ -18624,6 +18717,7 @@ span.cds--pagination__text.cds--pagination__items-count {
           appearance: none;
   background: none;
   cursor: pointer;
+  text-align: start;
   outline: 2px solid transparent;
   outline-offset: -2px;
   font-size: var(--cds-body-compact-01-font-size, 0.875rem);
@@ -19233,6 +19327,7 @@ span.cds--pagination__text.cds--pagination__items-count {
           appearance: none;
   background: none;
   cursor: pointer;
+  text-align: start;
   width: 100%;
   position: absolute;
   right: 0;
@@ -19539,6 +19634,7 @@ span.cds--pagination__text.cds--pagination__items-count {
           appearance: none;
   background: none;
   cursor: pointer;
+  text-align: start;
   width: 100%;
   display: -webkit-box;
   display: -ms-flexbox;
@@ -19984,6 +20080,7 @@ span.cds--pagination__text.cds--pagination__items-count {
           appearance: none;
   background: none;
   cursor: pointer;
+  text-align: start;
   width: 100%;
   display: -webkit-inline-box;
   display: -ms-inline-flexbox;
@@ -20549,6 +20646,7 @@ a.cds--header__menu-item.cds--header__menu-item--current:focus {
           appearance: none;
   background: none;
   cursor: pointer;
+  text-align: start;
   width: 100%;
   font-size: var(--cds-heading-compact-01-font-size, 0.875rem);
   font-weight: var(--cds-heading-compact-01-font-weight, 600);
@@ -21015,6 +21113,7 @@ a.cds--side-nav__link--current::before {
           appearance: none;
   background: none;
   cursor: pointer;
+  text-align: start;
   width: 100%;
   display: -webkit-inline-box;
   display: -ms-inline-flexbox;
@@ -21580,6 +21679,7 @@ a.cds--header__menu-item.cds--header__menu-item--current:focus {
           appearance: none;
   background: none;
   cursor: pointer;
+  text-align: start;
   width: 100%;
   font-size: var(--cds-heading-compact-01-font-size, 0.875rem);
   font-weight: var(--cds-heading-compact-01-font-weight, 600);