add button component

@@ -3,6 +3,7 @@ import { Link } from "react-router-dom";
 import styled from "styled-components";
 import styled from "styled-components";
 import Header from "../../Components/Header";
 import Header from "../../Components/Header";
 import Footer from "../../Components/Footer";
 import Footer from "../../Components/Footer";
+import Button from "../../Components/Button";
 
 
 const ContentWrapper = styled.div`
 const ContentWrapper = styled.div`
   display: flex;
   display: flex;
@@ -30,9 +31,23 @@ const ContentMain = styled.main`
 `;
 `;
 
 
 const MainTabBox = styled.div`
 const MainTabBox = styled.div`
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
   margin: 20px 0px;
   margin: 20px 0px;
   width: 100%;
   width: 100%;
-  font-size: 1.5rem;
+  span {
+    font-size: 1.5rem;
+    color: black;
+  }
+  button {
+    width: 70px;
+    height: 30px;
+    border-radius: 4px;
+    border: 1px solid black;
+    background-color: white;
+    cursor: pointer;
+  }
 `;
 `;
 
 
 const MainSection = styled.section``;
 const MainSection = styled.section``;
@@ -111,7 +126,10 @@ export default () => {
           <HeaderSpan>Forums</HeaderSpan>
           <HeaderSpan>Forums</HeaderSpan>
         </ContentHeader>
         </ContentHeader>
         <ContentMain>
         <ContentMain>
-          <MainTabBox>Viewing 20 topics</MainTabBox>
+          <MainTabBox>
+            <HeaderSpan>Viewing 20 topics</HeaderSpan>
+            <Button text="Post" />
+          </MainTabBox>
           <MainSection>
           <MainSection>
             <PostList>
             <PostList>
               <PostItem className="post-header">
               <PostItem className="post-header">