From b1ee86e1c0786a0e91bfc2b6c880e361c54111d6 Mon Sep 17 00:00:00 2001
From: Kamran Ahmed <kamranahmed.se@gmail.com>
Date: Fri, 1 Nov 2019 21:02:55 +0400
Subject: [PATCH] Add update guide button

---
 components/guide-header/index.js | 16 +++++++++++++++-
 components/guide-header/style.js | 12 +++++++++++-
 2 files changed, 26 insertions(+), 2 deletions(-)

diff --git a/components/guide-header/index.js b/components/guide-header/index.js
index 13c1df3c6..41d5a2ce7 100644
--- a/components/guide-header/index.js
+++ b/components/guide-header/index.js
@@ -1,4 +1,14 @@
-import { AuthorImage, GuideAuthor, GuideDate, GuideMeta, GuideSubtitle, GuideTitle, HeaderWrap } from './style';
+import {
+  ActionItems,
+  AuthorImage,
+  EditGuide,
+  GuideAuthor,
+  GuideDate,
+  GuideMeta,
+  GuideSubtitle,
+  GuideTitle,
+  HeaderWrap,
+} from './style';
 
 const GuideHeader = (props) => (
   <HeaderWrap className="border-bottom">
@@ -9,9 +19,13 @@ const GuideHeader = (props) => (
       </GuideAuthor>
       &middot;
       <GuideDate>Wednesday, October 9th 2019</GuideDate>
+      &middot;
+      <EditGuide href="#">Edit this Guide</EditGuide>
     </GuideMeta>
     <GuideTitle>Design Patterns for Humans</GuideTitle>
     <GuideSubtitle>An ultra-simplified explanation to design patterns</GuideSubtitle>
+    <ActionItems>
+    </ActionItems>
   </HeaderWrap>
 );
 
diff --git a/components/guide-header/style.js b/components/guide-header/style.js
index 9042744e8..b2ad42691 100644
--- a/components/guide-header/style.js
+++ b/components/guide-header/style.js
@@ -3,6 +3,7 @@ import styled from 'styled-components';
 export const HeaderWrap = styled.div`
   padding: 80px 15px 45px;
   text-align: center;
+  margin-bottom: 50px;
 `;
 
 export const GuideTitle = styled.h1`
@@ -26,7 +27,9 @@ export const GuideMeta = styled.p`
 
 export const GuideDate = styled.span`
   margin-left: 7px;
+  margin-right: 7px;
 `;
+
 export const GuideAuthor = styled.a`
   margin-right: 7px;
   font-weight: 500;
@@ -36,9 +39,16 @@ export const GuideAuthor = styled.a`
     color: #101010;
   }
 `;
+
 export const AuthorImage = styled.img`
   width: 22px;
   height: 22px;
   border-radius: 100%;
   margin-right: 10px;
-`;
\ No newline at end of file
+`;
+
+export const EditGuide = styled.a`
+  margin-left: 7px;
+`;
+
+export const ActionItems = styled.div``;
\ No newline at end of file