Is there something I'm missing?

css={css({':focus': {borderColor: 'blue20'}}

This is being used on a <Flexbox /> component built in @emotion/styled + styled-system.

// @flow

import styled from '@emotion/styled';

import {
  alignItems,
  alignContent,
  justifyContent,
  justifyItems,
  flexWrap,
  flexBasis,
  flexDirection,
  flex,
  justifySelf,
  alignSelf,
  order,
} from 'styled-system';
import shouldForwardProp from '@styled-system/should-forward-prop';

import {Box} from './Box';

export const Flexbox = styled(Box, {
  shouldForwardProp,
})(
  {
    boxSizing: 'border-box',
    display: 'flex',
    label: 'flexbox-primitive',
  },
  alignItems,
  alignContent,
  justifyContent,
  justifyItems,
  flexWrap,
  flexBasis,
  flexDirection,
  flex,
  justifySelf,
  alignSelf,
  order
);

What's odd is that I can get it to work here: https://stackblitz.com/edit/react-zzznyy

Hey,
I'm really enjoying this new CSS prop! Thanks for your work. I'm seeing a failure on some responsive arrays where a number is being appended. For example:

<style data-emotion="css">.css-wnbiem-NavLink-StyledSubNavLink 0{padding:4px;}</style>
<style data-emotion="css">@media screen and (min-width:480px){.css-wnbiem-NavLink-StyledSubNavLink 1{padding:4px;}}</style>
<style data-emotion="css">@media screen and (min-width:750px){.css-wnbiem-NavLink-StyledSubNavLink 2{padding:16px;}}</style>

If I can find some time, I'll will try to put together a minimal example with demonstrates this.

We've got a lot of cases where props are ending up in the dom. We're trying to go through and clean those up, but adding things to omitProps means it doesn't get all the defaults. I'd like to be able to add props to omit in addition to the defaults.

I'll have a PR shortly.

I'm seeing a delta between the css package doc

And the reference table in Style System's docs.

I tried using sizes in styled-system, but found it didn't work yet. Are there plans to unify this?

Hello again,

Should the css prop work inside of MDX?

I have attempted to use it in both a normal MDX file and one that I was using MDX-blocks with.

Thanks.

Yo,

How do you feel about adding outline properties?

They could map to the same theme objects as border.

I use outline often when I don't the border to impact the computed height/width of my elements.