This repository has no description
1.7 kB
65 lines
1import NavItem from '../navItem/NavItem';
2import {
3 AppShellSection,
4 AppShellNavbar,
5 ScrollArea,
6 Stack,
7 Group,
8 Anchor,
9 Image,
10 Box,
11 Badge,
12 Button,
13 Text,
14} from '@mantine/core';
15import { MdOutlineEmojiNature } from 'react-icons/md';
16import Link from 'next/link';
17import SembleLogo from '@/assets/semble-logo.svg';
18import NavbarToggle from '../NavbarToggle';
19import { BiRightArrowAlt } from 'react-icons/bi';
20
21export default function GuestNavbar() {
22 return (
23 <AppShellNavbar p={'xs'} style={{ zIndex: 3 }}>
24 <Group justify="space-between">
25 <Anchor component={Link} href={'/home'}>
26 <Stack align="center" gap={6}>
27 <Image src={SembleLogo.src} alt="Semble logo" w={20.84} h={28} />
28 <Badge size="xs">Alpha</Badge>
29 </Stack>
30 </Anchor>
31 <Box hiddenFrom="xs">
32 <NavbarToggle />
33 </Box>
34 </Group>
35
36 <AppShellSection grow component={ScrollArea}>
37 <Stack mt={'xl'}>
38 <Stack>
39 <Text fw={600} fz={'xl'}>
40 A social knowledge network for researchers
41 </Text>
42 <Group grow>
43 <Button component={Link} href="/signup">
44 Sign up
45 </Button>
46 <Button
47 component={Link}
48 href="/login"
49 color="dark"
50 rightSection={<BiRightArrowAlt size={22} />}
51 >
52 Log in
53 </Button>
54 </Group>
55 <NavItem
56 href="/explore"
57 label="Explore"
58 icon={<MdOutlineEmojiNature size={25} />}
59 />
60 </Stack>
61 </Stack>
62 </AppShellSection>
63 </AppShellNavbar>
64 );
65}