Add device avatar

This commit is contained in:
Hristo Nedelkov 2023-12-19 13:50:51 +02:00
parent eebd109d7c
commit f249ff9ffa
2 changed files with 3 additions and 25 deletions

View File

@ -33,7 +33,7 @@ const CreateAvatar = () => {
return (
<YStack>
<XStack>
<LabelInputField labelText="Device Name" placeholderText="Stake and chips" />
<LabelInputField labelText="Device Name" placeholderText="Stake and chips" width="95%" />
</XStack>
<XStack space={'$3'} justifyContent={'space-between'}>
<YStack>

View File

@ -7,6 +7,7 @@ import Titles from '../../components/General/Titles'
import LabelInputField from '../../components/General/LabelInputField'
import Header from '../../components/General/Header'
import { NodeIcon } from '@status-im/icons'
import CreateAvatar from '../../components/General/CreateAvatar/CreateAvatar'
const ConnectDevicePage = () => {
const [autoConnectChecked, setAutoConnectChecked] = useState(false)
@ -92,30 +93,7 @@ const ConnectDevicePage = () => {
</XStack>
</YStack>
<YStack my={16}>
<YStack>
<Text size={13} weight="regular" color={'#647084'}>
Device Avatar
</Text>
<XStack my={10}>
<Avatar type="user" size={80} name="Device Avatar" />
</XStack>
<XStack space style={{ justifyContent: 'space-between' }}>
<Stack width={'50%'}>
<LabelInputField
labelText="Device Name"
placeholderText="Stake and chips"
width="100%"
/>
</Stack>
<Stack width={'50%'}>
<LabelInputField
labelText="Device Color"
placeholderText="#011892"
width="100%"
/>
</Stack>
</XStack>
</YStack>
<CreateAvatar></CreateAvatar>
</YStack>
<Separator alignSelf="stretch" borderColor={'#F0F2F5'} />
<YStack my={16}>