Merge branch 'hn.validator-onboarding' of https://github.com/nimbus-gui/nimbus-gui into hn.validator-onboarding

This commit is contained in:
Hristo Nedelkov 2023-08-24 16:15:20 +03:00
commit 99214f3389
3 changed files with 13 additions and 4 deletions

View File

@ -40,7 +40,7 @@
/* LAYOUT RIGHT ELEMENT WITH IMAGE TAKING UP THE WHOLE HIGHT OF THE VIEWPORT */ /* LAYOUT RIGHT ELEMENT WITH IMAGE TAKING UP THE WHOLE HIGHT OF THE VIEWPORT */
.layout-right { .layout-right {
flex: 0 0 45%; flex: 0 0 44.6%;
max-width: 45%; max-width: 45%;
z-index: 0; z-index: 0;
} }

View File

@ -1,4 +1,5 @@
import type { Meta, StoryObj } from '@storybook/react' import type { Meta, StoryObj } from '@storybook/react'
import { withRouter } from 'storybook-addon-react-router-v6'
import Advicsories from './Advicsories' import Advicsories from './Advicsories'
@ -10,6 +11,7 @@ const meta = {
}, },
tags: ['autodocs'], tags: ['autodocs'],
argTypes: {}, argTypes: {},
decorators: [withRouter],
} satisfies Meta<typeof Advicsories> } satisfies Meta<typeof Advicsories>
export default meta export default meta

View File

@ -2,6 +2,7 @@ import { Stack, Text as TextTam, XStack, YStack } from 'tamagui'
import { Button, Shadow, Text } from '@status-im/components' import { Button, Shadow, Text } from '@status-im/components'
import { Link } from 'react-router-dom' import { Link } from 'react-router-dom'
import OverviewCard from './OverviewCard' import OverviewCard from './OverviewCard'
import { ArrowRightIcon } from '@status-im/icons'
const Overview = () => { const Overview = () => {
return ( return (
@ -13,6 +14,7 @@ const Overview = () => {
border: 'none', border: 'none',
flexDirection: 'row', flexDirection: 'row',
backgroundColor: '#fff', backgroundColor: '#fff',
zIndex: 999,
}} }}
> >
<YStack className="layout-left" space={'$5'} style={{ padding: '16px 32px' }}> <YStack className="layout-left" space={'$5'} style={{ padding: '16px 32px' }}>
@ -32,9 +34,14 @@ const Overview = () => {
secured by proof-of-stake validators. By running a validator, you'll be helping to secured by proof-of-stake validators. By running a validator, you'll be helping to
secure the Ethereum network. secure the Ethereum network.
</Text> </Text>
<Stack style={{ margin: '2% 0 4%' }}> <Stack style={{ margin: '2% 0 4%', maxWidth: 'fit-content' }}>
<Text size={15}> <Text size={15}>
<Link to={'https://www.youtube.com/watch?v=dQw4w9WgXcQ'}> Learn more</Link> <XStack space={'$1'} style={{ alignItems: 'center' }}>
<Link style={{ color: '#2A4CF4' }} to={'/'}>
Learn more
</Link>
<ArrowRightIcon size={16} color="#2A4CF4" />
</XStack>
</Text> </Text>
</Stack> </Stack>
<XStack space={'$5'}> <XStack space={'$5'}>
@ -54,7 +61,7 @@ const Overview = () => {
</div> </div>
</section> </section>
</Shadow> </Shadow>
<Stack style={{ alignItems: 'end', width: '100%', marginTop: '16px' }}> <Stack style={{ alignItems: 'end', width: '100%', marginTop: '16px', zIndex: 999 }}>
<Button>Continue</Button> <Button>Continue</Button>
</Stack> </Stack>
</> </>