Skip to content

Instantly share code, notes, and snippets.

Embed
What would you like to do?
import React from 'react'
import styled from 'styled-components'
function flex(name, defaultValue) {
return (props) => {
let value = props[name]
if (!value && typeof defaultValue === 'undefined') return ''
if (!value) value = defaultValue
return `flex-${name}: ${value};`
}
}
function Flex(props) {
const { className, children } = props
return <div className={className}>{children}</div>
}
export default styled(Flex)`
display: flex;
${flex('direction')}
${flex('basis')}
> * { ${flex('grow')} }
height: 100%;
width: 100%;
`
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
You can’t perform that action at this time.