import styled from 'styled-components';

import { color } from '../../constants/style';

export const Title = styled('p')<{ light?: boolean; align?: string }>`
  font-size: 16px;
  color: ${props => (props.light ? color.black38 : '#000000')};
  margin: 5px;
  white-space: nowrap;
  text-align: ${props => (props.align ? props.align : 'center')};
`;

export const Subtitle = styled('p')<{ light?: boolean; align?: string }>`
  font-size: 14px;
  color: ${props => (props.light ? color.black38 : '#000000')};
  margin: 5px;
  white-space: nowrap;
  text-align: ${props => (props.align ? props.align : 'center')};
`;

export const Body = styled('p')<{ light?: boolean; align?: string }>`
  font-size: 14px;
  color: ${props => (props.light ? color.black38 : '#000000')};
  margin: 5px;
  text-align: ${props => (props.align ? props.align : 'center')};
`;