Medium #1 - Grid Example 3.jsx

...

const span = (cols) => `
  // calculate the width 
  width: ${cols / 12 * 100 }%;
`

const offset = (cols) => `
  // calculate the offset
  margin: ${cols / 12 * 100 }%;
`

const order = (order) => `
  order: ${order};
`

const hidden = (hidden = false) => `
  display: ${hidden ? 'none' : 'flex'};
`

export const withResponsiveProps(
  // Wrapped styled component
  Column,
  // Mixins
  {
    span: span,
    offset: offset,
    order: order,
    hidden: hidden
  }
)