css.js.snap

// Jest Snapshot v1, https://goo.gl/fbAQLP

exports[`applies class when css prop is set to nil on wrapper component 1`] = `
Array [
  .emotion-0 {
  color: hotpink;
}

<button
    className="emotion-0"
  >
    I'm hotpink!
  </button>,
  .emotion-0 {
  color: hotpink;
}

<button
    className="emotion-0"
  >
    I'm hotpink too!
  </button>,
]
`;

exports[`array fallback (using camelCased property) 1`] = `
.emotion-0 {
  background-color: green;
  background-color: hotpink;
}

<div>
  <div
    className="emotion-0"
  >
    something
  </div>
</div>
`;

exports[`array fallback 1`] = `
.emotion-0 {
  color: green;
  color: hotpink;
}

<div>
  <div
    className="emotion-0"
  >
    something
  </div>
</div>
`;

exports[`child selector array 1`] = `
.emotion-0:hover {
  color: green;
  background-color: yellow;
}

<div
  className="emotion-0"
/>
`;

exports[`css call composition 1`] = `
.emotion-0:hover {
  color: hotpink;
}

<div
  className="emotion-0"
/>
`;

exports[`handles camelCased custom properties in object styles properly 1`] = `
.emotion-0 {
  --textColor: green;
  color: var(--textColor);
}

<div
  className="emotion-0"
/>
`;

exports[`handles composition of styles without a final semi in a declaration block 1`] = `
.emotion-0 {
  color: hotpink;
  background-color: green;
}

<div
  className="emotion-0"
>
  I'm hotpink on the green background.
</div>
`;

exports[`label in css call 1`] = `
.emotion-0 {
  color: hotpink;
}

<div>
  <div
    className="emotion-0"
  >
    something
  </div>
</div>
`;

exports[`nested at rule 1`] = `
@media (min-width:980px) {
  .emotion-0 {
    background-color: blue;
  }

@supports (width:100vw) {
    .emotion-0 {
      background-color: red;
    }
}
}

<div
  className="emotion-0"
>
  something
</div>
`;

exports[`object with false 1`] = `
.emotion-0 {
  color: hotpink;
}

<div>
  <div
    className="emotion-0"
  >
    something
  </div>
</div>
`;

exports[`overwrite styles from parent 1`] = `
.emotion-0 {
  color: green;
  background-color: yellow;
  color: hotpink;
}

<div
  className="emotion-0"
/>
`;

exports[`string as css prop throws 1`] = `
"Strings are not allowed as css prop values, please wrap it in a css template literal from '@emotion/css' like this: css\`
            color: hotpink;
          \`"
`;

exports[`theming with the css prop 1`] = `
.emotion-0 {
  color: hotpink;
}

<div
  className="emotion-0"
/>
`;

exports[`thing 1`] = `
.emotion-0 {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
}

<div>
  <div
    className="emotion-0"
  >
    something
  </div>
</div>
`;