ui(resources): use the new banner (#66)

ui(resources): use the new banner

Author: veksen

src/components/ResourcesSidebar/index.tsx

@@ -2,7 +2,7 @@ import React, { useState, PropsWithChildren } from "react"
 import { useStaticQuery, graphql, Link } from "gatsby"
 import useBuildTree from "./useBuildTree"
 import useSidebar from "./../../hooks/useSidebar"
-import banner from "../../images/tph-banner.png"
+import Banner from "../../images/tph-banner.svg"
 import TriangleDown from "../../icons/triangle-down.svg"
 import * as SC from "./styles"
 
@@ -124,7 +124,7 @@ export function ResourcesSidebar() {
   return (
     <SC.ResourcesSidebarWrapper>
       <Link to="/">
-        <SC.Banner src={banner} />
+        <Banner />
       </Link>
       <SC.Inner>
         {tree.map((node, index) => plantTree(node, index, true))}

src/components/ResourcesSidebar/styles.tsx

@@ -8,11 +8,6 @@ export const ResourcesSidebarWrapper = styled.div`
   background: #f9f9f9;
 `
 
-export const Banner = styled.img`
-  display: block;
-  width: 100%;
-`
-
 export const Children = styled.div`
   padding-left: 16px;
   padding-bottom: 8px;