fix: small size tweaks for Overview
This commit is contained in:
parent
fee17d0ed6
commit
9ed9696a33
|
@ -1,5 +1,6 @@
|
||||||
import { Text as TextTam, XStack, YStack } from 'tamagui'
|
import { Text as TextTam, XStack, YStack } from 'tamagui'
|
||||||
import { Text } from '@status-im/components'
|
import { Text } from '@status-im/components'
|
||||||
|
|
||||||
import OverviewCard from './OverviewCard'
|
import OverviewCard from './OverviewCard'
|
||||||
import LinkWithArrow from '../../../components/General/LinkWithArrow'
|
import LinkWithArrow from '../../../components/General/LinkWithArrow'
|
||||||
|
|
||||||
|
@ -7,7 +8,7 @@ const Overview = () => {
|
||||||
return (
|
return (
|
||||||
<>
|
<>
|
||||||
<YStack className="layout-left" space={'$5'} style={{ padding: '16px 32px' }}>
|
<YStack className="layout-left" space={'$5'} style={{ padding: '16px 32px' }}>
|
||||||
<TextTam fontSize={27} fontWeight={'600'} style={{ marginBottom: '5px' }}>
|
<TextTam fontSize={27} fontWeight={'600'}>
|
||||||
Overview
|
Overview
|
||||||
</TextTam>
|
</TextTam>
|
||||||
<Text size={27}>
|
<Text size={27}>
|
||||||
|
@ -23,8 +24,13 @@ const Overview = () => {
|
||||||
by proof-of-stake validators. By running a validator, you'll be helping to secure the
|
by proof-of-stake validators. By running a validator, you'll be helping to secure the
|
||||||
Ethereum network.
|
Ethereum network.
|
||||||
</Text>
|
</Text>
|
||||||
<LinkWithArrow text="Learn more" to={'/'} arrowRight={true} style={{ margin: '2% 0 4%' }} />
|
<LinkWithArrow
|
||||||
<XStack space={'$5'}>
|
text="Learn more"
|
||||||
|
to={'/'}
|
||||||
|
arrowRight={true}
|
||||||
|
style={{ marginBottom: '1%' }}
|
||||||
|
/>
|
||||||
|
<XStack space={'$3'}>
|
||||||
<OverviewCard text={'Current APR'} value={'4.40%'} />
|
<OverviewCard text={'Current APR'} value={'4.40%'} />
|
||||||
<OverviewCard text={'Total ETH Staked'} value={'9,451,123'} />
|
<OverviewCard text={'Total ETH Staked'} value={'9,451,123'} />
|
||||||
<OverviewCard text={'Estimated Activation Time'} value={'32 Days'} />
|
<OverviewCard text={'Estimated Activation Time'} value={'32 Days'} />
|
||||||
|
|
|
@ -12,7 +12,7 @@ const OverviewCard = ({ text, value }: OverviewCardProps) => {
|
||||||
style={{
|
style={{
|
||||||
borderRadius: '16px',
|
borderRadius: '16px',
|
||||||
border: '1px solid rgba(0, 0, 0, 0.15)',
|
border: '1px solid rgba(0, 0, 0, 0.15)',
|
||||||
width: '45%',
|
width: '46%',
|
||||||
padding: '12px 16px',
|
padding: '12px 16px',
|
||||||
backgroundColor: '#FFF',
|
backgroundColor: '#FFF',
|
||||||
}}
|
}}
|
||||||
|
|
|
@ -2,7 +2,7 @@
|
||||||
position: absolute;
|
position: absolute;
|
||||||
top: 50%;
|
top: 50%;
|
||||||
left: 75%;
|
left: 75%;
|
||||||
height: 230%;
|
height: 220%;
|
||||||
width: auto;
|
width: auto;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
Loading…
Reference in New Issue