import { styled } from 'styleh-components'
import { LabelElement } from 'atoms/Text'
const StyledText = LabelElement.as('span')
const Name = styled.withComponent(StyledText) `
flex: 0 0 100%;
margin-right: rem(6);
`
const AddressLine1 = styled.withComponent(StyledText) `
flex: 0 0 100%;
margin-right: rem(6);
`
const AddressLine2 = styled.withComponent(StyledText) `
flex: 0 0 100%;
margin-right: rem(6);
`
const City = styled.withComponent(StyledText) `
margin-right: rem(6);
`
const Country = styled.withComponent(StyledText) `
flex: 0 0 100%;
margin-right: rem(6);
`
const State = styled.withComponent(StyledText) `
margin-right: rem(6);
`
const PostalCode = styled.withComponent(StyledText) `
margin-right: rem(6);
`
const AddressWrapper = styled.div `
display: flex;
flex-direction: row;
flex-wrap: wrap;
`
export {
AddressWrapper,
Name,
AddressLine1,
AddressLine2,
City,
Country,
State,
PostalCode,
StyledText,
}