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

fix: change spacing and structure pair device

This commit is contained in:
RadoslavDimchev 2023-11-29 21:03:56 +02:00
parent ec6b4a0f71
commit 744f39f4fa
1 changed files with 14 additions and 17 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

31
src/pages/PairDevice/PairDevice.tsx
View File

@ -1,5 +1,5 @@
import { NodeIcon } from '@status-im/icons' import { NodeIcon } from '@status-im/icons'
import { Separator, XStack, YStack } from 'tamagui' import { Separator, Stack, XStack, YStack } from 'tamagui'
import { useState } from 'react' import { useState } from 'react'
import { Button, Text } from '@status-im/components' import { Button, Text } from '@status-im/components'
@ -23,12 +23,7 @@ const PairDevice = () => {
return ( return (
<PageWrapperShadow rightImageSrc="./background-images/day-night-bg.png" rightImageLogo={true}> <PageWrapperShadow rightImageSrc="./background-images/day-night-bg.png" rightImageLogo={true}>
<YStack <YStack space={'$3'}>
space={'$3'}
style={{
maxWidth: '100%',
}}
>
<Header selectedTag="pair" /> <Header selectedTag="pair" />
<Titles <Titles
title="Connect to existing Nimbus Instance" title="Connect to existing Nimbus Instance"
@ -43,21 +38,23 @@ const PairDevice = () => {
/> />
)} )}
<Separator borderColor={'#e3e3e3'} /> <Separator borderColor={'#e3e3e3'} />
<Text size={19} weight={'semibold'} color="#09101C"> <YStack space={'$1'}>
Advanced Settings <Text size={19} weight={'semibold'} color="#09101C">
</Text> Advanced Settings
<XStack space={'$4'}> </Text>
<Button icon={<Icon src="/icons/connection-blue.svg" width={20} />} variant="outline"> <XStack>
Connect via IP <Button icon={<Icon src="/icons/connection-blue.svg" width={20} />} variant="outline">
</Button> Connect via IP
</XStack> </Button>
</XStack>
</YStack>
{isPaired && <CreateAvatar />} {isPaired && <CreateAvatar />}
<Separator borderColor={'#e3e3e3'} /> <Separator borderColor={'#e3e3e3'} />
<XStack> <div>
<Button icon={<NodeIcon size={20} />} disabled={!isPaired}> <Button icon={<NodeIcon size={20} />} disabled={!isPaired}>
Continue Continue
</Button> </Button>
</XStack> </div>
</YStack> </YStack>
</PageWrapperShadow> </PageWrapperShadow>
) )