refact: clean up unused scrollbar in base layout (#71)

refact: clean up unused scrollbar in base layout

src/components/Layout/index.tsx

@@ -8,8 +8,6 @@
 import { graphql, useStaticQuery } from "gatsby"
 import React, { PropsWithChildren } from "react"
 
-import Scrollbar from "react-perfect-scrollbar"
-import "react-perfect-scrollbar/dist/css/styles.css"
 import { GlobalStyles } from "../../globalStyles"
 import { Container } from "../Container"
 import { Footer } from "../Footer"
@@ -28,9 +26,8 @@ export function Layout({ children }: PropsWithChildren<{}>) {
   `)
 
   return (
-    <Scrollbar>
+    <SC.LayoutWrapper>
       <GlobalStyles />
-      <SC.Main>
       <Header />
       <SC.MainContent>
         <Container>
@@ -39,7 +36,6 @@ export function Layout({ children }: PropsWithChildren<{}>) {
         </Container>
       </SC.MainContent>
       <Footer />
-      </SC.Main>
+    </SC.LayoutWrapper>
-    </Scrollbar>
   )
 }

src/components/Layout/styles.tsx

@@ -1,6 +1,6 @@
 import styled from "styled-components"
 
-export const Main = styled.div`
+export const LayoutWrapper = styled.div`
   display: flex;
   flex-direction: column;
   align-items: center;