34 lines
830 B
JavaScript
34 lines
830 B
JavaScript
import React from 'react';
|
|
import {FlexRow, Svg} from '../../utils/containers';
|
|
import theme from '../../utils/theme';
|
|
import {Medium} from '../../utils/fonts';
|
|
import PropsTypes from 'prop-types';
|
|
|
|
const InfoItem = (props) => {
|
|
return (
|
|
<FlexRow as='li' gap={props.gap}>
|
|
<Svg src={props.icon} width={props.size} height={props.size}
|
|
backgroundColor={theme.colors.dark} size='contain'/>
|
|
<Medium as='p'>
|
|
{props.children ? props.children : 'xxx'}
|
|
</Medium>
|
|
</FlexRow>
|
|
);
|
|
};
|
|
|
|
InfoItem.propTypes = {
|
|
gap: PropsTypes.string,
|
|
icon: PropsTypes.object,
|
|
size: PropsTypes.string,
|
|
children: PropsTypes.node,
|
|
};
|
|
|
|
InfoItem.defaultProps = {
|
|
gap: '0',
|
|
icon: null,
|
|
size: '24px',
|
|
children: '',
|
|
};
|
|
|
|
export default InfoItem;
|