use icons from @status-im
This commit is contained in:
parent
0ee3634392
commit
ad451ec1f1
|
@ -1,5 +1,5 @@
|
|||
import { Divider, IconButton, Paragraph } from '@status-im/components'
|
||||
import { LockedIcon, MembersIcon, OptionsIcon } from '@status-im/icons'
|
||||
import { Locked, Members, Options } from '@status-im/icons/20'
|
||||
import { Stack } from '@tamagui/core'
|
||||
|
||||
type Props = {
|
||||
|
@ -24,7 +24,7 @@ export const Topbar = (props: Props) => {
|
|||
<Paragraph weight="semibold" marginRight={4}>
|
||||
# random
|
||||
</Paragraph>
|
||||
<LockedIcon color="rgba(27, 39, 61, 0.4)" size={16} />
|
||||
<Locked color="rgba(27, 39, 61, 0.4)" size={16} />
|
||||
<Divider height={16} />
|
||||
<Paragraph weight="medium" color="$neutral-80-opa-50" variant="smaller">
|
||||
Share random funny stuff with the community. Play nice.
|
||||
|
@ -33,11 +33,11 @@ export const Topbar = (props: Props) => {
|
|||
|
||||
<Stack space={12} flexDirection="row">
|
||||
<IconButton
|
||||
icon={<MembersIcon />}
|
||||
icon={<Members />}
|
||||
selected={membersVisisble}
|
||||
onPress={onMembersPress}
|
||||
/>
|
||||
<IconButton icon={<OptionsIcon />} />
|
||||
<IconButton icon={<Options />} />
|
||||
</Stack>
|
||||
</Stack>
|
||||
)
|
||||
|
|
|
@ -1,3 +1,4 @@
|
|||
import { Contact, Untrustworthy, Verified } from '@status-im/icons/12'
|
||||
import { XStack } from 'tamagui'
|
||||
|
||||
import { Paragraph } from '../typography'
|
||||
|
@ -20,59 +21,9 @@ const Author = (props: Props) => {
|
|||
<Paragraph weight="semibold" variant="smaller" color="$neutral-100">
|
||||
{name}
|
||||
</Paragraph>
|
||||
{status === 'contact' && (
|
||||
<svg
|
||||
width="12"
|
||||
height="12"
|
||||
viewBox="0 0 12 12"
|
||||
fill="none"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
>
|
||||
<circle cx="6" cy="6" r="5" fill="#4360DF" />
|
||||
<path
|
||||
d="M9 9.5V9.5C8.37526 8.56288 7.3235 8 6.19722 8H5.80278C4.6765 8 3.62474 8.56288 3 9.5V9.5"
|
||||
stroke="white"
|
||||
strokeLinejoin="round"
|
||||
/>
|
||||
<circle cx="6" cy="6" r="4.25" stroke="#4360DF" strokeWidth="1.5" />
|
||||
<circle
|
||||
cx="6"
|
||||
cy="4.5"
|
||||
r="1.5"
|
||||
stroke="white"
|
||||
strokeLinejoin="round"
|
||||
/>
|
||||
</svg>
|
||||
)}
|
||||
{status === 'verified' && (
|
||||
<svg
|
||||
width="12"
|
||||
height="12"
|
||||
viewBox="0 0 12 12"
|
||||
fill="none"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
>
|
||||
<circle cx="6" cy="6" r="5" fill="#26A69A" />
|
||||
<path
|
||||
d="M4 6.3L5.33333 7.5L8 4.5"
|
||||
stroke="white"
|
||||
strokeWidth="1.1"
|
||||
/>
|
||||
</svg>
|
||||
)}
|
||||
{status === 'untrustworthy' && (
|
||||
<svg
|
||||
width="12"
|
||||
height="12"
|
||||
viewBox="0 0 12 12"
|
||||
fill="none"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
>
|
||||
<circle cx="6" cy="6" r="5" fill="#E65F5C" />
|
||||
<path d="M6 7L6 3" stroke="white" strokeWidth="1.1" />
|
||||
<path d="M6 9L6 8" stroke="white" strokeWidth="1.1" />
|
||||
</svg>
|
||||
)}
|
||||
{status === 'contact' && <Contact />}
|
||||
{status === 'verified' && <Verified />}
|
||||
{status === 'untrustworthy' && <Untrustworthy />}
|
||||
</XStack>
|
||||
|
||||
{address && (
|
||||
|
|
|
@ -1,6 +1,6 @@
|
|||
import { useState } from 'react'
|
||||
|
||||
import { GroupIcon } from '@status-im/icons'
|
||||
import { Group } from '@status-im/icons/16'
|
||||
import { Stack } from '@tamagui/core'
|
||||
|
||||
import { Accordion } from '../accordion/accordion'
|
||||
|
@ -87,7 +87,7 @@ const Sidebar = (props: Props) => {
|
|||
<Heading marginBottom={16}>{name}</Heading>
|
||||
<Paragraph marginBottom={12}>{description}</Paragraph>
|
||||
<Stack flexDirection="row" alignItems="center" mb={12}>
|
||||
<GroupIcon color="$neutral-100" size={16} />
|
||||
<Group color="$neutral-100" />
|
||||
<Paragraph ml={8}>{membersCount}</Paragraph>
|
||||
</Stack>
|
||||
|
||||
|
@ -123,7 +123,6 @@ const Sidebar = (props: Props) => {
|
|||
</Accordion>
|
||||
))}
|
||||
<Stack borderBottomColor="$neutral-10" borderBottomWidth={1} />
|
||||
{/* <Button mt={20}>Request to join community</Button> */}
|
||||
</Stack>
|
||||
</Stack>
|
||||
)
|
||||
|
|
Loading…
Reference in New Issue