status-im/nimbus-gui
2
0
Fork 0
mirror of https://github.com/status-im/nimbus-gui.git synced 2025-02-07 17:13:29 +00:00
Code Issues Packages Projects Releases Wiki Activity

feat(Breadcrumb-bar): use status text instead of li item

Browse Source
This commit is contained in:
RadoslavDimchev 2024-04-25 20:03:38 +03:00 committed by Emil Ivanichkov
parent 1419e35a83
commit 1d487bdfc8
1 changed files with 12 additions and 8 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

20
src/components/General/BreadcrumbBar/BreadcrumbBar.tsx
View File

@ -1,3 +1,4 @@
import { Text } from '@status-im/components'
import { ChevronRightIcon } from '@status-im/icons' import { ChevronRightIcon } from '@status-im/icons'
import { XStack } from 'tamagui' import { XStack } from 'tamagui'
@ -11,14 +12,17 @@ const BreadcrumbBar = ({ breadcrumbList }: BreadcrumbBarProps) => {
return ( return (
<nav className="breadcrumb-bar-nav"> <nav className="breadcrumb-bar-nav">
<ul className="breadcrumb-bar-ul"> <ul className="breadcrumb-bar-ul">
{breadcrumbList.map((item, index) => ( {breadcrumbList.map((item, index) => {
<XStack space={'$2'} alignItems="center" key={index}> const isNotLast = index !== breadcrumbList.length - 1
<li className="breadcrumb-bar-li">{item}</li> return (
{index !== breadcrumbList.length - 1 && ( <XStack space={'$2'} alignItems="center" key={index}>
<ChevronRightIcon size={20} color="#647084" /> <Text size={15} color={isNotLast ? '#647084' : ''}>
)} {item}
</XStack> </Text>
))} {isNotLast && <ChevronRightIcon size={20} color="#647084" />}
</XStack>
)
})}
</ul> </ul>
</nav> </nav>
) )