status-im
/
nimbus-gui
mirror of https://github.com/status-im/nimbus-gui.git
2
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

Update Overview.tsx

This commit is contained in:
Hristo Nedelkov 2024-01-05 09:34:48 +02:00
parent 63c4ba12e0
commit 9853b7b218
1 changed files with 38 additions and 38 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

76
src/pages/ValidatorOnboarding/Overview/Overview.tsx
View File

@ -3,49 +3,49 @@ import { Text } from '@status-im/components'
import OverviewCard from './OverviewCard'
import LinkWithArrow from '../../../components/General/LinkWithArrow'
import OverviewWrapper from './OverviewWrapper'
const Overview = () => {
return (
<>
<YStack
className="layout-left"
space={'$5'}
style={{ padding: '26px 0 32px 32px' }}
minHeight={'65vh'}
justifyContent={'space-between'}
<OverviewWrapper
imgHeight="250%"
rightImageSrc="./background-images/sync-status-background.png"
>
<YStack space={'$5'}>
<Text size={27} weight={'semibold'}>
Overview
</Text>
<Text size={19}>
Becoming a validator is a big responsibility with important preparation steps. Only
start the deposit process when you're ready.
</Text>
<Text size={15} color="#939BA1">
By running a validator, you'll be responsible for securing the network and receive
continuous payouts for actions that help the network reach consensus.
</Text>
<Text size={15} color="#939BA1">
Since the successful transition to proof-of-stake via The Merge, Ethereum is fully
secured by proof-of-stake validators. By running a validator, you'll be helping to
secure the Ethereum network.
</Text>
<LinkWithArrow
text="Learn More"
to={'/'}
arrowRight={true}
style={{ marginBottom: '1%', fontSize: '13px' }}
/>
<YStack>
<YStack space={'$5'}>
<Text size={27} weight={'semibold'}>
Overview
</Text>
<Text size={19}>
Becoming a validator is a big responsibility with important preparation steps. Only
start the deposit process when you're ready.
</Text>
<Text size={15} color="#939BA1">
By running a validator, you'll be responsible for securing the network and receive
continuous payouts for actions that help the network reach consensus.
</Text>
<Text size={15} color="#939BA1">
Since the successful transition to proof-of-stake via The Merge, Ethereum is fully
secured by proof-of-stake validators. By running a validator, you'll be helping to
secure the Ethereum network.
</Text>
<LinkWithArrow
text="Learn More"
to={'/'}
arrowRight={true}
style={{ marginBottom: '1%', fontSize: '13px' }}
/>
</YStack>
<XStack space={'$3'}>
<OverviewCard text={'Current APR'} value={'4.40%'} />
<OverviewCard text={'Total ETH Staked'} value={'9,451,123'} />
<OverviewCard text={'Estimated Activation Time'} value={'32 Days'} />
<OverviewCard text={'Validator Queue'} value={'92603'} />
</XStack>
</YStack>
<XStack space={'$3'}>
<OverviewCard text={'Current APR'} value={'4.40%'} />
<OverviewCard text={'Total ETH Staked'} value={'9,451,123'} />
<OverviewCard text={'Estimated Activation Time'} value={'32 Days'} />
<OverviewCard text={'Validator Queue'} value={'92603'} />
</XStack>
</YStack>
<section className="layout-right">
</OverviewWrapper>
{/* <section className="layout-right">
<div className="image-container">
<img
src="./background-images/sync-status-background.png"
@ -53,7 +53,7 @@ const Overview = () => {
className="background-img"
/>
</div>
</section>
</section> */}
</>
)
}