status-im/nimbus-gui
2
0
Fork 0
mirror of https://github.com/status-im/nimbus-gui.git synced 2025-01-31 21:56:06 +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 { XStack } from 'tamagui'
@ -11,14 +12,17 @@ const BreadcrumbBar = ({ breadcrumbList }: BreadcrumbBarProps) => {
return (
<nav className="breadcrumb-bar-nav">
<ul className="breadcrumb-bar-ul">
{breadcrumbList.map((item, index) => (
<XStack space={'$2'} alignItems="center" key={index}>
<li className="breadcrumb-bar-li">{item}</li>
{index !== breadcrumbList.length - 1 && (
<ChevronRightIcon size={20} color="#647084" />
)}
</XStack>
))}
{breadcrumbList.map((item, index) => {
const isNotLast = index !== breadcrumbList.length - 1
return (
<XStack space={'$2'} alignItems="center" key={index}>
<Text size={15} color={isNotLast ? '#647084' : ''}>
{item}
</Text>
{isNotLast && <ChevronRightIcon size={20} color="#647084" />}
</XStack>
)
})}
</ul>
</nav>
)