Navigation
Navbar
1import { Navbar } from 'ui'
2
3const NavigationExample = () => (
4 <Navbar
5 navigation={[
6 { type: 'link', label: 'Home', href: '#', current: true },
7 { type: 'link', label: 'Blog', href: '#', current: false },
8 { type: 'link', label: 'Ranking', href: '#', current: false },
9 { type: 'link', label: 'Manual', href: '#', current: false },
10 { type: 'link', label: 'Forum', href: '#', current: false },
11 {
12 type: 'dropdown',
13 label: 'John Doe',
14 links: [
15 {
16 label: 'Admin',
17 href: '#',
18 IconComponent: WrenchScrewdriverIcon,
19 },
20 { label: 'Settings', href: '#', IconComponent: Cog8ToothIcon },
21 { label: 'Profile', href: '#', IconComponent: UserIcon },
22 {
23 label: 'Log out',
24 href: '#',
25 IconComponent: ArrowRightOnRectangleIcon,
26 },
27 ],
28 },
29 ]}
30 />
31)
Navbar
1import { Tabbar } from 'ui'
2
3const TabbarExample = () => (
4 <Tabbar
5 links={[
6 {
7 href: '/contests/official',
8 label: 'Official contests',
9 active: false,
10 },
11 {
12 href: '/contests/user-contests',
13 label: 'User contests',
14 active: false,
15 },
16 {
17 href: '/contests/my-contests',
18 label: 'My contests',
19 active: true,
20 },
21 ]}
22 />
23)