@react-spectrum/s2/dist/IllustratedMessage.css

Spectrum 2 UI components in React

@layer _.a {
  .se1 {
    display: grid;
  }

  .uk1 {
    font-family: var(--s2-font-family-sans, adobe-clean-spectrum-vf), adobe-clean-variable, adobe-clean, ui-sans-serif, system-ui, sans-serif;
    font-family: var(--s2-font-family-sans, adobe-clean-spectrum-vf), adobe-clean-variable, adobe-clean, ui-sans-serif, system-ui, sans-serif;
    font-family: var(--s2-font-family-sans, adobe-clean-spectrum-vf), adobe-clean-variable, adobe-clean, ui-sans-serif, system-ui, sans-serif;
    font-family: var(--s2-font-family-sans, adobe-clean-spectrum-vf), adobe-clean-variable, adobe-clean, ui-sans-serif, system-ui, sans-serif;
    font-family: var(--s2-font-family-sans, adobe-clean-spectrum-vf), adobe-clean-variable, adobe-clean, ui-sans-serif, system-ui, sans-serif;
  }

  .-_6BNtrc-a1 {
    --fs: pow(1.125, -2);
  }

  .-_6BNtrc-e1 {
    --fs: pow(1.125, 2);
  }

  ._Fd1 {
    line-height: round(1em * (1.15 + (1 - ((min(32, var(--s2-font-size-base, 14) * var(--fs))  - 10)) / 22) * .15), 2px);
    line-height: round(1em * (1.15 + (1 - ((min(32, var(--s2-font-size-base, 14) * var(--fs))  - 10)) / 22) * .15), 2px);
    line-height: round(1em * (1.15 + (1 - ((min(32, var(--s2-font-size-base, 14) * var(--fs))  - 10)) / 22) * .15), 2px);
    line-height: round(1em * (1.15 + (1 - ((min(32, var(--s2-font-size-base, 14) * var(--fs))  - 10)) / 22) * .15), 2px);
    line-height: round(1em * (1.15 + (1 - ((min(32, var(--s2-font-size-base, 14) * var(--fs))  - 10)) / 22) * .15), 2px);
  }

  .Li1 {
    max-width: calc(23.75rem * var(--s2-scale));
  }

  .Lj1 {
    max-width: calc(33rem * var(--s2-scale));
  }

  .CPmblS1 {
    grid-template-areas: ". illustration ."
                         ". . ."
                         "heading heading heading"
                         ". . ."
                         "content content content"
                         ". buttonGroup .";
  }

  .CLJajOe1 {
    grid-template-areas: "illustration . heading"
                         "illustration . ."
                         "illustration . content"
                         "illustration . buttonGroup";
  }

  .E02fTrb1 {
    grid-template-rows: min-content calc(.75rem * var(--s2-scale)) min-content calc(.25rem * var(--s2-scale)) min-content min-content;
  }

  .EdL7991 {
    grid-template-rows: min-content calc(.5rem * var(--s2-scale)) min-content calc(.25rem * var(--s2-scale)) min-content min-content;
  }

  .E6zxP8c1 {
    grid-template-rows: 1fr calc(.25rem * var(--s2-scale)) 1fr;
  }

  .DrSmbR1 {
    grid-template-columns: 1fr calc(.75rem * var(--s2-scale)) auto;
  }

  ._Da1 {
    justify-items: center;
  }

  ._Dc1 {
    justify-items: start;
  }

  ._Wa1 {
    text-align: center;
  }

  .zTZ8xtd1 {
    grid-column-start: illustration;
  }

  .yTZ8xtd1 {
    grid-column-end: illustration;
  }

  .BTZ8xtd1 {
    grid-row-start: illustration;
  }

  .ATZ8xtd1 {
    grid-row-end: illustration;
  }

  ._dc1 {
    align-self: center;
  }

  .-_8sjo0b-pt1 {
    --iconPrimary: var(--lightningcss-light, #292929) var(--lightningcss-dark, #dbdbdb);
  }

  .-_8sjo0b-pu1 {
    --iconPrimary: var(--lightningcss-light, #3b63fb) var(--lightningcss-dark, #5681ff);
  }

  .zPCJngb1 {
    grid-column-start: heading;
  }

  .yPCJngb1 {
    grid-column-end: heading;
  }

  .BPCJngb1 {
    grid-row-start: heading;
  }

  .APCJngb1 {
    grid-row-end: heading;
  }

  .-_6BNtrc-d1 {
    --fs: pow(1.125, 1);
  }

  .-_6BNtrc-f1 {
    --fs: pow(1.125, 3);
  }

  .-_6BNtrc-g1 {
    --fs: pow(1.125, 4);
  }

  .xd1 {
    font-weight: 700;
  }

  ._Fd1 {
    line-height: round(1em * (1.15 + (1 - ((min(32, var(--s2-font-size-base, 14) * var(--fs))  - 10)) / 22) * .15), 2px);
    line-height: round(1em * (1.15 + (1 - ((min(32, var(--s2-font-size-base, 14) * var(--fs))  - 10)) / 22) * .15), 2px);
    line-height: round(1em * (1.15 + (1 - ((min(32, var(--s2-font-size-base, 14) * var(--fs))  - 10)) / 22) * .15), 2px);
  }

  .po1 {
    color: var(--lightningcss-light, #131313) var(--lightningcss-dark, #f2f2f2);
  }

  ._dd1 {
    align-self: end;
  }

  .Jy1 {
    margin-top: 0;
  }

  .Gy1 {
    margin-bottom: 0;
  }

  .Iy1 {
    margin-inline-start: 0;
  }

  .Hy1 {
    margin-inline-end: 0;
  }

  .uk1 {
    font-family: var(--s2-font-family-sans, adobe-clean-spectrum-vf), adobe-clean-variable, adobe-clean, ui-sans-serif, system-ui, sans-serif;
    font-family: var(--s2-font-family-sans, adobe-clean-spectrum-vf), adobe-clean-variable, adobe-clean, ui-sans-serif, system-ui, sans-serif;
    font-family: var(--s2-font-family-sans, adobe-clean-spectrum-vf), adobe-clean-variable, adobe-clean, ui-sans-serif, system-ui, sans-serif;
  }

  .-_6BNtrc-b1 {
    --fs: pow(1.125, -1);
  }

  .-_6BNtrc-c1 {
    --fs: pow(1.125, 0);
  }

  .vx1 {
    font-size: round(var(--s2-font-size-base, 14) * var(--fs) / 16 * 1rem, 1px);
  }

  .xb1 {
    font-weight: 400;
  }

  ._xa1 {
    font-synthesis-weight: none;
  }

  ._Fb1 {
    line-height: 1.5;
  }

  .pt1 {
    color: var(--lightningcss-light, #292929) var(--lightningcss-dark, #dbdbdb);
  }

  .zk52g2d1 {
    grid-column-start: content;
  }

  .yk52g2d1 {
    grid-column-end: content;
  }

  .Bk52g2d1 {
    grid-row-start: content;
  }

  .Ak52g2d1 {
    grid-row-end: content;
  }

  ._de1 {
    align-self: start;
  }

  .zmlKpq1 {
    grid-column-start: buttonGroup;
  }

  .ymlKpq1 {
    grid-column-end: buttonGroup;
  }

  .BmlKpq1 {
    grid-row-start: buttonGroup;
  }

  .AmlKpq1 {
    grid-row-end: buttonGroup;
  }

  .JC1 {
    margin-top: 1rem;
  }
}

@layer _.b {
  .xX0cczbc1:is(:lang(ja), :lang(ko), :lang(zh)) {
    font-weight: 500;
  }

  ._xX0cczba1:is(:lang(ja), :lang(ko), :lang(zh)) {
    font-synthesis-weight: none;
  }

  ._FnuYUweb1:is(:lang(ja), :lang(ko), :lang(zh), :lang(zh-Hant), :lang(zh-Hans), :lang(zh-CN), :lang(zh-SG)) {
    line-height: 1.5;
  }

  .ucJ9TBTb1:lang(ar) {
    font-family: adobe-clean-arabic, myriad-arabic, ui-sans-serif, system-ui, sans-serif;
  }

  ._FnuYUwec1:is(:lang(ja), :lang(ko), :lang(zh), :lang(zh-Hant), :lang(zh-Hans), :lang(zh-CN), :lang(zh-SG)) {
    line-height: 1.7;
  }
}

@layer _.c {
  .xfd1:is(:lang(ja), :lang(ko), :lang(zh), :lang(zh-Hant), :lang(zh-Hans)) {
    font-weight: 700;
  }

  ._xfa1:is(:lang(ja), :lang(ko), :lang(zh), :lang(zh-Hant), :lang(zh-Hans)) {
    font-synthesis-weight: none;
  }

  .ud3Euai1:lang(he) {
    font-family: adobe-clean-hebrew, myriad-hebrew, ui-sans-serif, system-ui, sans-serif;
  }
}

@layer _.d {
  .xfX0cczbc1:is(:lang(ja), :lang(ko), :lang(zh)):is(:lang(ja), :lang(ko), :lang(zh), :lang(zh-Hant), :lang(zh-Hans)) {
    font-weight: 500;
  }

  ._xfX0cczba1:is(:lang(ja), :lang(ko), :lang(zh)):is(:lang(ja), :lang(ko), :lang(zh), :lang(zh-Hant), :lang(zh-Hans)) {
    font-synthesis-weight: none;
  }

  .uea1:lang(ja) {
    font-family: adobe-clean-han-japanese, Hiragino Kaku Gothic ProN, ヒラギノ角ゴ ProN W3, Osaka, YuGothic, Yu Gothic, メイリオ, Meiryo, ＭＳ Ｐゴシック, MS PGothic, sans-serif;
  }
}

@layer _.e {
  .ugb1:lang(ko) {
    font-family: adobe-clean-han-korean, source-han-korean, Malgun Gothic, Apple Gothic, sans-serif;
  }
}

@layer _.f {
  .uhd1:lang(zh) {
    font-family: adobe-clean-han-traditional, source-han-traditional, MingLiu, Heiti TC Light, sans-serif;
  }
}

@layer _.g {
  .uje1:lang(zh-hant) {
    font-family: adobe-clean-han-traditional, source-han-traditional, MingLiu, Microsoft JhengHei UI, Microsoft JhengHei, Heiti TC Light, sans-serif;
  }
}

@layer _.h {
  .u2NhKxcl1:lang(zh-HK) {
    font-family: adobe-clean-han-hong-kong, source-han-hong-kong, MingLiu, Microsoft JhengHei UI, Microsoft JhengHei, Heiti TC Light, sans-serif;
  }
}

@layer _.i {
  .uic1:is(:lang(zh-Hans), :lang(zh-CN), :lang(zh-SG)) {
    font-family: adobe-clean-han-simplified-c, source-han-simplified-c, SimSun, Heiti SC Light, sans-serif;
  }
}
/*# sourceMappingURL=IllustratedMessage.css.map */