From 2b848557129b400eab942b5fb9396e1059f6fb62 Mon Sep 17 00:00:00 2001
From: Damla Koksal <damlakoksal@outlook.com>
Date: Tue, 27 Oct 2020 18:07:38 +0300
Subject: [PATCH] feat: CustomButton component added

---
 src/components/custom-button/custom-button.component.jsx | 7 +++++++
 src/components/custom-button/custom-button.styles.scss   | 4 ++++
 src/components/layout/header/header.component.jsx        | 3 ++-
 3 files changed, 13 insertions(+), 1 deletion(-)
 create mode 100644 src/components/custom-button/custom-button.component.jsx
 create mode 100644 src/components/custom-button/custom-button.styles.scss

diff --git a/src/components/custom-button/custom-button.component.jsx b/src/components/custom-button/custom-button.component.jsx
new file mode 100644
index 0000000..a1bccab
--- /dev/null
+++ b/src/components/custom-button/custom-button.component.jsx
@@ -0,0 +1,7 @@
+import React from "react";
+
+import "./custom-button.styles.scss";
+
+export default function CustomButton({ children }) {
+  return <button className="custom-button">{children}</button>;
+}
diff --git a/src/components/custom-button/custom-button.styles.scss b/src/components/custom-button/custom-button.styles.scss
new file mode 100644
index 0000000..c5ca549
--- /dev/null
+++ b/src/components/custom-button/custom-button.styles.scss
@@ -0,0 +1,4 @@
+.custom-button {
+  border: 0.2rem solid black;
+  background-color: Transparent;
+}
diff --git a/src/components/layout/header/header.component.jsx b/src/components/layout/header/header.component.jsx
index e627917..47276b5 100644
--- a/src/components/layout/header/header.component.jsx
+++ b/src/components/layout/header/header.component.jsx
@@ -3,6 +3,7 @@ import { Link } from "react-router-dom";
 import Logo from "../../logo/logo.component";
 import Menu from "../../menu/menu.component";
 import BlockQuote from "../../block-quote/block-quote.component";
+import CustomButton from "../../custom-button/custom-button.component";
 
 import "./header.styles.scss";
 
@@ -30,7 +31,7 @@ function Header() {
       </nav>
       <div className="block-quote-container">
         <BlockQuote>test deneme test</BlockQuote>
-        <button>&#8642;</button>
+        <CustomButton>&#8642;</CustomButton>
       </div>
     </div>
   );