From 1f864d1b67a0b5049031f85b3df62a7d213885bb Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Se=CC=81rgio=20Ramos?= <mail@sergioramos.me>
Date: Tue, 3 Jan 2017 10:45:17 +0000
Subject: [PATCH] wrap Avatar to add styles

---
 frontend/src/components/article/index.js |  5 ----
 frontend/src/components/header/index.js  | 33 +++++++++++-------------
 2 files changed, 15 insertions(+), 23 deletions(-)

diff --git a/frontend/src/components/article/index.js b/frontend/src/components/article/index.js
index 09210628..123833b2 100644
--- a/frontend/src/components/article/index.js
+++ b/frontend/src/components/article/index.js
@@ -1,14 +1,9 @@
 const Styled = require('styled-components');
-// const fns = require('@ui/shared/functions');
 
 const {
   default: styled
 } = Styled;
 
-// const {
-//   remcalc
-// } = fns;
-
 // Main Contonent Wrapper Styles
 module.exports = styled.article`
 `;
diff --git a/frontend/src/components/header/index.js b/frontend/src/components/header/index.js
index dd1de46d..ebdc33d4 100644
--- a/frontend/src/components/header/index.js
+++ b/frontend/src/components/header/index.js
@@ -65,16 +65,20 @@ const StyledName = styled.span`
   top: -12px;
 `;
 
+const EmptyButton = styled.button`
+  background: none;
+  border: none;
+`;
+
+const StyledAvatar = styled(Avatar)`
+  marginLeft: 12px;
+`;
+
 const arrowPosition = {
   bottom: '100%',
   right: '10%'
 };
 
-const EmptyButton = styled.button`
-  background: none
-  border: none
-`;
-
 const Header = ({
   account = {},
   tooltip = false,
@@ -107,27 +111,20 @@ const Header = ({
         <Row>
           <Column xs={2}>
             <Link to='/'>
-              <StyledLogo
-                alt='Joyent'
-                src={logo}
-              />
+              <StyledLogo alt='Joyent' src={logo} />
             </Link>
           </Column>
-          <Column
-            smOffset={8.5}
-            xs={1.5}
-          >
+          <Column smOffset={8.5} xs={1.5}>
             <StyledProfileWrapper>
               <StyledAvatarWrapper toggled={tooltip}>
                 <EmptyButton onClick={handleToggleClick}>
-                  <StyledName>{account.name}</StyledName>
-                  <Avatar
+                  <StyledName>
+                    {account.name}
+                  </StyledName>
+                  <StyledAvatar
                     alt={account.name}
                     name={account.name}
                     src={account.avatar}
-                    style={{
-                      marginLeft: '12px'
-                    }}
                   />
                 </EmptyButton>
               </StyledAvatarWrapper>