feat: update documentation navbar

tuono-labs · Aug 14, 2024 · 5abff03 · 5abff03
1 parent cc91556
commit 5abff03
Show file tree

Hide file tree

Showing 2 changed files with 18 additions and 16 deletions.
diff --git a/apps/documentation/src/components/navbar/actions.tsx b/apps/documentation/src/components/navbar/actions.tsx
@@ -1,4 +1,4 @@
-import { Flex, Button, ActionIcon } from '@mantine/core'
+import { Flex, Button, ActionIcon, Group } from '@mantine/core'
 import { IconBrandGithub, IconBook } from '@tabler/icons-react'
 import ThemeBtn from '../theme-btn'
 import { Link } from 'tuono'
@@ -15,17 +15,19 @@ export default function Actions(): JSX.Element {
       >
         Get started
       </Button>
-      <ActionIcon
-        variant="default"
-        size="lg"
-        aria-label="Check the project on github"
-        href="https://github.com/Valerioageno/tuono"
-        target="_blank"
-        component="a"
-      >
-        <IconBrandGithub />
-      </ActionIcon>
-      <ThemeBtn />
+      <Group gap={8} visibleFrom="sm">
+        <ActionIcon
+          variant="default"
+          size="lg"
+          aria-label="Check the project on github"
+          href="https://github.com/Valerioageno/tuono"
+          target="_blank"
+          component="a"
+        >
+          <IconBrandGithub />
+        </ActionIcon>
+        <ThemeBtn />
+      </Group>
     </Flex>
   )
 }
diff --git a/apps/documentation/src/components/navbar/navbar.tsx b/apps/documentation/src/components/navbar/navbar.tsx
@@ -12,7 +12,11 @@ export default function Navbar({ opened, toggle }: NavbarProps): JSX.Element {
   return (
     <AppShell.Header p="sm">
       <Flex justify="space-between">
+        <Button component={Link} href="/" variant="transparent" p={0} fz={28}>
+          Tuono
+        </Button>
         <Flex align="center" gap={8}>
+          <Actions />
           {pathname.startsWith('/documentation') && (
             <Burger
               opened={opened}
@@ -21,11 +25,7 @@ export default function Navbar({ opened, toggle }: NavbarProps): JSX.Element {
               size="sm"
             />
           )}
-          <Button component={Link} href="/" variant="transparent" p={0} fz={28}>
-            Tuono
-          </Button>
         </Flex>
-        <Actions />
       </Flex>
     </AppShell.Header>
   )