Create documentation website (#19)

* feat: scaffold documentation app

* feat: init documentation website with mantine

* feat: add theme button

* feat: setup mdx link component

* feat: setup basic documentation folder

* feat: add routing folder

* feat: scaffold homepage

* feat: refined navbar and hero

* feat: create pre mdx component

* feat: create mdx blockquote component

* feat: create code mdx component

* fix: remove HTMLProps type

* feat: create base hero page

* ci: add lint/formatting/type checking to documentation

* ci: add documentation pipeline

* fix: static build documentation

* fix: remove documentation test check

* fix: install deps outside workspace

* fix: filter prettier checks

* fix: eslint plugins

* fix: clone eslintrc

* feat: update dark theme colors

* doc: add installation page

* feat: add deploy documenation CD pipeline

* fix: update documentation bucket region

* feat: update documentation head tags

* fix: deploy website on main branch push

apps/documentation/src/components/navbar/actions.tsx

@@ -0,0 +1,31 @@
+import { Flex, Button, ActionIcon } from '@mantine/core'
+import { IconBrandGithub, IconBook } from '@tabler/icons-react'
+import ThemeBtn from '../theme-btn'
+import { Link } from 'tuono'
+
+export default function Actions(): JSX.Element {
+  return (
+    <Flex gap={8}>
+      <Button
+        href="/documentation/installation"
+        component={Link}
+        size="compact-lg"
+        rightSection={<IconBook />}
+        autoContrast
+      >
+        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 />
+    </Flex>
+  )
+}

apps/documentation/src/components/navbar/index.ts

@@ -0,0 +1,3 @@
+import Navbar from './navbar'
+
+export default Navbar

apps/documentation/src/components/navbar/navbar.tsx

@@ -0,0 +1,32 @@
+import { AppShell, Burger, Button, Flex } from '@mantine/core'
+import { Link, useRouter } from 'tuono'
+import Actions from './actions'
+
+interface NavbarProps {
+  opened: boolean
+  toggle: () => void
+}
+
+export default function Navbar({ opened, toggle }: NavbarProps): JSX.Element {
+  const { pathname } = useRouter()
+  return (
+    <AppShell.Header p="sm">
+      <Flex justify="space-between">
+        <Flex align="center" gap={8}>
+          {pathname.startsWith('/documentation') && (
+            <Burger
+              opened={opened}
+              onClick={toggle}
+              hiddenFrom="sm"
+              size="sm"
+            />
+          )}
+          <Button component={Link} href="/" variant="transparent" p={0} fz={28}>
+            Tuono
+          </Button>
+        </Flex>
+        <Actions />
+      </Flex>
+    </AppShell.Header>
+  )
+}