hiCity-nft/src/components/Empty/index.tsx

32 lines
788 B
TypeScript

import React from 'react'
import styled, { keyframes } from 'styled-components'
import { useTranslation } from 'contexts/Localization'
import { Flex, Text, Image } from '@pancakeswap/uikit'
interface EmptyProps {
title?: string
marginTop?: string
}
const EmptyFlex = styled(Flex)`
justify-content: center;
align-items: center;
flex-direction: column;
`
const EmptyText = styled(Text)`
font-size: 16px;
color: #505f79;
margin-top: 12px;
`
const Empty: React.FC<EmptyProps> = ({ title, marginTop = '20px' }) => {
const { t } = useTranslation()
return (
<EmptyFlex style={{ marginTop }}>
<Image src="/images/empty.svg" width={228} height={200} />
<EmptyText>{title ? t(title) : t('No data yet')}</EmptyText>
</EmptyFlex>
)
}
export default Empty