2func-responsiveStyles.js

const baseStyles = ({ top, left, right, bottom }) => css`
  margin-top: ${top ? unitizedPx(top) : null};
  margin-right: ${right ? unitizedPx(right) : null};
  margin-bottom: ${bottom ? unitizedPx(bottom) : null};
  margin-left: ${left ? unitizedPx(left) : null};
`;

const responsiveStyles = generateResponsiveStyles(baseStyles);

export const Root = styled.div`
  display: ${props => (props.inline ? 'inline-block' : 'block')};
  ${baseStyles}
  ${responsiveStyles}
}
`;