@carbon/ibmdotcom-styles 2.16.0-rc.1 → 2.16.0-rc.2

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.
@@ -6087,7 +6087,8 @@ screen and (prefers-contrast) {
6087
6087
  }
6088
6088
  .cds--content-layout ::slotted([data-autoid^=c4d--card]:not([slot])),
6089
6089
  .cds--content-layout ::slotted([data-autoid^=c4d--tabs-]:not([slot])),
6090
- .cds--content-layout ::slotted(c4d-content-group:not([slot])) {
6090
+ .cds--content-layout ::slotted(c4d-content-group:not([slot])),
6091
+ .cds--content-layout ::slotted(c4d-cta-block-item-row:not([slot])) {
6091
6092
  -webkit-margin-start: 0;
6092
6093
  margin-inline-start: 0
6093
6094
  }
@@ -10155,13 +10156,6 @@ screen and (prefers-contrast) {
10155
10156
  flex-direction: column;
10156
10157
  gap: 1rem
10157
10158
  }
10158
- :host(c4d-card) ::slotted(div),
10159
- :host(c4d-card-cta) ::slotted(div),
10160
- :host(c4d-card-group-item) ::slotted(div),
10161
- :host(c4d-card-in-card) ::slotted(div) {
10162
- -webkit-margin-start: -.25rem!important;
10163
- margin-inline-start: -.25rem!important
10164
- }
10165
10159
  :host(c4d-card[aspect-ratio="1:1"]) .cds--card__wrapper {
10166
10160
  display: -webkit-box;
10167
10161
  display: -ms-flexbox;
@@ -12297,9 +12291,15 @@ screen and (prefers-contrast) {
12297
12291
  :host(c4d-card-group-item) .cds--card .cds--card__wrapper::before {
12298
12292
  content: revert
12299
12293
  }
12294
+ :host(c4d-card-group-item) .cds--card .cds--card__wrapper::after {
12295
+ display: block;
12296
+ aspect-ratio: 16/9;
12297
+ content: "";
12298
+ grid-area: 1/1/-1/-1
12299
+ }
12300
12300
  :host(c4d-card-group-item) .cds--card .cds--card__content {
12301
12301
  display: grid;
12302
- grid-row: span 10;
12302
+ grid-area: 1/1/-1/-1;
12303
12303
  grid-template-rows: subgrid;
12304
12304
  row-gap: 0
12305
12305
  }
@@ -13568,6 +13568,10 @@ screen and (prefers-contrast) {
13568
13568
  -ms-flex: 1 0 50%;
13569
13569
  flex: 1 0 50%
13570
13570
  }
13571
+ :host(c4d-feature-card) .cds--card__image-wrapper,
13572
+ :host(c4d-feature-cta) .cds--card__image-wrapper {
13573
+ aspect-ratio: 1/1
13574
+ }
13571
13575
  :host(c4d-feature-card) .cds--card__wrapper::after,
13572
13576
  :host(c4d-feature-card) .cds--card__wrapper::before,
13573
13577
  :host(c4d-feature-cta) .cds--card__wrapper::after,
@@ -13722,9 +13726,18 @@ screen and (prefers-contrast) {
13722
13726
  :host(c4d-feature-cta[size=large])[color-scheme=inverse] .cds--card__wrapper ::slotted(c4d-card-heading) {
13723
13727
  color: var(--cds-icon-inverse,#fff)
13724
13728
  }
13729
+ :host(c4d-feature-card-footer)[color-scheme=inverse] .c4d-ce--card__footer .c4d-ce--cta__icon,
13725
13730
  :host(c4d-feature-card-footer)[color-scheme=inverse] .c4d-ce--card__footer ::slotted(svg[slot=icon]) {
13726
13731
  fill: var(--cds-link-inverse,#78a9ff)
13727
13732
  }
13733
+ :host(c4d-feature-card-footer)[color-scheme=inverse] .c4d-ce--card__footer:hover .c4d-ce--cta__icon,
13734
+ :host(c4d-feature-card-footer)[color-scheme=inverse] .c4d-ce--card__footer:hover ::slotted(svg[slot=icon]) {
13735
+ fill: var(--cds-link-inverse-hover,#a6c8ff)
13736
+ }
13737
+ :host(c4d-feature-card-footer)[color-scheme=inverse] .c4d-ce--card__footer:active .c4d-ce--cta__icon,
13738
+ :host(c4d-feature-card-footer)[color-scheme=inverse] .c4d-ce--card__footer:active ::slotted(svg[slot=icon]) {
13739
+ fill: var(--cds-link-inverse-active,#f4f4f4)
13740
+ }
13728
13741
  :host(c4d-feature-card[size=large]) ::slotted(c4d-feature-card-footer) {
13729
13742
  display: -webkit-box;
13730
13743
  display: -ms-flexbox;
@@ -38775,6 +38788,7 @@ button.cds--side-nav__link > .cds--side-nav__link-text {
38775
38788
  }
38776
38789
  :host(c4d-leadspace) ::slotted([slot=navigation]) {
38777
38790
  z-index: 1;
38791
+ max-inline-size: 40rem;
38778
38792
  -webkit-padding-after: 1rem!important;
38779
38793
  padding-block-end: 1rem!important;
38780
38794
  padding-inline: 1rem!important
@@ -44651,13 +44665,33 @@ button.cds--side-nav__link > .cds--side-nav__link-text {
44651
44665
  cds-hr {
44652
44666
  margin-inline: 2rem/-2
44653
44667
  }
44668
+ html {
44669
+ font-size: 100%
44670
+ }
44671
+ body {
44672
+ font-weight: 400;
44673
+ font-family: 'IBM Plex Sans',system-ui,-apple-system,BlinkMacSystemFont,'.SFNSText-Regular',sans-serif;
44674
+ -moz-osx-font-smoothing: grayscale;
44675
+ -webkit-font-smoothing: antialiased;
44676
+ text-rendering: optimizeLegibility
44677
+ }
44678
+ code {
44679
+ font-family: 'IBM Plex Mono',system-ui,-apple-system,BlinkMacSystemFont,'.SFNSText-Regular',monospace
44680
+ }
44681
+ strong {
44682
+ font-weight: 600
44683
+ }
44654
44684
  .cds--nc {
44655
44685
  max-inline-size: 640px
44656
44686
  }
44657
44687
  .cds--nc .cds--checkbox-group,
44658
44688
  .cds--nc p {
44659
44689
  -webkit-margin-after: 1.5rem;
44660
- margin-block-end: 1.5rem
44690
+ margin-block-end: 1.5rem;
44691
+ font-size: var(--cds-legal-02-font-size,.875rem);
44692
+ font-weight: var(--cds-legal-02-font-weight,400);
44693
+ line-height: var(--cds-legal-02-line-height,1.28572);
44694
+ letter-spacing: var(--cds-legal-02-letter-spacing,.16px)
44661
44695
  }
44662
44696
  .cds--nc a {
44663
44697
  color: var(--cds-link-primary,#0f62fe)
@@ -48651,8 +48685,7 @@ cds-hr {
48651
48685
  }
48652
48686
  .cds--tableofcontents__content {
48653
48687
  -webkit-box-sizing: border-box;
48654
- box-sizing: border-box;
48655
- padding-block: 1rem 3rem
48688
+ box-sizing: border-box
48656
48689
  }
48657
48690
  .cds--tableofcontents {
48658
48691
  -webkit-margin-before: 2rem;