From e941a57aa1e1d784399ee2679456583f4ba66fee Mon Sep 17 00:00:00 2001
From: Michal Sapka <michal@sapka.me>
Date: Tue, 16 Aug 2022 22:51:39 +0200
Subject: feat: working topnav

---
 components/topnav.tsx | 20 ++++++++++++++++----
 1 file changed, 16 insertions(+), 4 deletions(-)

(limited to 'components/topnav.tsx')

diff --git a/components/topnav.tsx b/components/topnav.tsx
index 7d25c9b..8213b71 100644
--- a/components/topnav.tsx
+++ b/components/topnav.tsx
@@ -14,6 +14,7 @@ import {
   MenuOptionGroup,
   MenuDivider,
   useMediaQuery,
+  Container
 } from '@chakra-ui/react'
 import { GiHamburgerMenu } from "react-icons/gi"
 import { DiGithubBadge } from "react-icons/di"
@@ -58,10 +59,21 @@ function Navigation() {
 
 export default function Navbar() {
   
-  return <HStack>
-    <Heading>Michal </Heading>
-    <Navigation/>
-  </HStack>
+  return <Box
+    as="header"
+    position="fixed"
+    backdropFilter="auto" 
+    backdropBlur="6px"
+    width="100%"
+    pt="5px"
+  >
+    <Container maxW="xl">
+      <HStack>
+        <Heading flex={[1,1,0,0]}>Michal </Heading>
+        <Navigation/>
+      </HStack>
+    </Container>
+  </Box>
 }
 
 
-- 
cgit v1.2.3