mirror of
https://github.com/luxfi/explore.git
synced 2026-09-24 00:28:18 +00:00
tom goriunovandGitHub
932add9d96
* basic components and address page refactoring * second part of refactoring * third part of refactoring * NativeCoinValue component * more refactoring * rename TruncatedValue into TruncatedText * minor fixes * refactor block details * fix layout of value and fee in tx table * update screenshots * different units for tooltip and stats widget small value fix * update screenshots * update tx table screenshot * fix copy button vertical alignment
33 lines
767 B
TypeScript
33 lines
767 B
TypeScript
import { Box } from '@chakra-ui/react';
|
|
import React from 'react';
|
|
|
|
import { TruncatedText } from 'toolkit/components/truncation/TruncatedText';
|
|
|
|
interface Props {
|
|
label: string;
|
|
value: string;
|
|
}
|
|
|
|
const BlockCountdownTimerItem = ({ label, value }: Props) => {
|
|
return (
|
|
<Box
|
|
minW={{ base: '70px', lg: '100px' }}
|
|
textAlign="center"
|
|
overflow="hidden"
|
|
flex="1 1 auto"
|
|
>
|
|
<TruncatedText
|
|
text={ value }
|
|
fontFamily="heading"
|
|
fontSize={{ base: '40px', lg: '48px' }}
|
|
lineHeight="48px"
|
|
fontWeight={ 600 }
|
|
w="100%"
|
|
/>
|
|
<Box fontSize="sm" lineHeight="20px" mt={ 1 } color="text.secondary">{ label }</Box>
|
|
</Box>
|
|
);
|
|
};
|
|
|
|
export default React.memo(BlockCountdownTimerItem);
|