style: clean up unused code

src/components/DocsLayout/index.tsx

@@ -8,11 +8,8 @@
 import React, { PropsWithChildren } from "react"
 import { useStaticQuery, graphql } from "gatsby"
 
-import Container from "../Container"
 import DocsSidebar from "../DocsSidebar"
 import { Main, MainContent } from "./styles"
-import Scrollbar from "react-perfect-scrollbar"
-import "react-perfect-scrollbar/dist/css/styles.css"
 
 const DocsLayout = ({ children }: PropsWithChildren<{}>) => {
   const data = useStaticQuery(graphql`

src/components/DocsLayout/layout.scss

@@ -1,41 +0,0 @@
-// TODO: refactor this into styled components
-
-html {
-  font-family: -apple-system, BlinkMacSystemFont, Segoe UI, Helvetica, Arial,
-    sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol;
-  -ms-text-size-adjust: 100%;
-  -webkit-text-size-adjust: 100%;
-}
-
-body {
-  margin: 0;
-  -webkit-font-smoothing: antialiased;
-  -moz-osx-font-smoothing: grayscale;
-}
-
-/**
- * If you already use line highlighting
- */
-
-/* Adjust the position of the line numbers */
-.gatsby-highlight pre[class*="language-"].line-numbers {
-  padding-left: 2.8em;
-}
-
-/**
- * If you only want to use line numbering
- */
-
-.gatsby-highlight {
-  background-color: #fdf6e3;
-  border-radius: 0.3em;
-  margin: 0.5em 0;
-  padding: 1em;
-  overflow: auto;
-}
-
-.gatsby-highlight pre[class*="language-"].line-numbers {
-  padding: 0;
-  padding-left: 2.8em;
-  overflow: initial;
-}

src/components/Layout/index.tsx

@@ -9,7 +9,6 @@ import React, { PropsWithChildren } from "react"
 import { useStaticQuery, graphql } from "gatsby"
 
 import Container from "../Container"
-import Navbar from "../Navbar"
 import Sidebar from "../Sidebar"
 import "./layout.scss"
 import { Main, MainContent } from "./styles"

src/components/Navbar/index.tsx

@@ -1,43 +0,0 @@
-import { Link } from "gatsby";
-import * as React from "react";
-import icon from "./icon.png";
-import { HeaderWrapper } from "./styles";
-
-// @todo maybe find alternative type for data
-const Navbar = ({ siteTitle }: any) => (
-  <HeaderWrapper>
-    <div
-      style={{
-        margin: `0 auto`,
-        maxWidth: 960,
-        padding: `1.45rem 1.0875rem`,
-      }}
-    >
-      <div style={{ display: "flex", flexDirection: "row", alignItems: "center" }}>
-        {/* <img src={icon} style={{ width: "70px" }} /> */}
-        <h1 style={{ margin: 0 }}>
-          <Link
-            to="/"
-            style={{
-              color: `white`,
-              textDecoration: `none`,
-            }}
-          >
-            {siteTitle}
-          </Link>
-        </h1>
-      </div>
-    </div>
-
-  </HeaderWrapper>
-)
-
-Navbar.propTypes = {
-  siteTitle: String
-}
-
-Navbar.defaultProps = {
-  siteTitle: ``,
-}
-
-export default Navbar;

src/components/Navbar/styles.tsx

@@ -1,6 +0,0 @@
-import styled from "styled-components";
-
-export const HeaderWrapper = styled.header`
-  background: #ba1a2e;
-  marginBottom: 1.45rem;
-`;