layout small fixes

components/Nav/Nav.tsx

@@ -6,12 +6,11 @@ const Nav = () => {
   return (
     <Flex
       w="250px"
-      paddingRight="24px"
       flexDirection="column"
       color="blue.600"
     >
-      <NextLink href="/"><Link padding="8px 0px">Home</Link></NextLink>
-      <NextLink href="/watchlist"><Link padding="8px 0px" >Watchlist</Link></NextLink>
+      <NextLink href="/" passHref><Link padding="8px 0px">Home</Link></NextLink>
+      <NextLink href="/watchlist" passHref><Link padding="8px 0px" >Watchlist</Link></NextLink>
     </Flex>
   )
 }

components/Page/Page.tsx

 import React from 'react';
-import { Box, Flex } from '@chakra-ui/react';
+import { Box, HStack } from '@chakra-ui/react';
 
 import Nav from '../Nav/Nav';
 
@@ -9,15 +9,17 @@ interface Props {
 
 const Page = ({ children }: Props) => {
   return (
-    <Flex
+    <HStack
       w="100%"
       minH="100vh"
       padding="140px 48px 48px 48px"
       bgColor="gray.200"
+      spacing="12"
+      alignItems="stretch"
     >
       <Nav/>
       <Box borderRadius="10px" w="100%" overflow="hidden">{ children }</Box>
-    </Flex>
+    </HStack>
   );
 };