From 494303883ae44c3e3a250a8f92ee416ef7f2b2d8 Mon Sep 17 00:00:00 2001
From: Danny Skubak <skubakdj@gmail.com>
Date: Wed, 30 Oct 2019 22:01:38 -0400
Subject: [PATCH] apply margin directly to like & follow (#53)

---
 frontend/client/components/Follow/index.tsx    | 4 +++-
 frontend/client/components/Like/index.tsx      | 5 +++--
 frontend/client/components/Proposal/index.less | 4 ----
 frontend/client/components/Proposal/index.tsx  | 4 ++--
 4 files changed, 8 insertions(+), 9 deletions(-)

diff --git a/frontend/client/components/Follow/index.tsx b/frontend/client/components/Follow/index.tsx
index ed0db2a6..9f8d93cb 100644
--- a/frontend/client/components/Follow/index.tsx
+++ b/frontend/client/components/Follow/index.tsx
@@ -10,6 +10,7 @@ import './index.less';
 
 interface OwnProps {
   proposal: ProposalDetail;
+  style?: React.CSSProperties;
 }
 
 interface StateProps {
@@ -30,10 +31,11 @@ type State = typeof STATE;
 class Follow extends React.Component<Props, State> {
   state: State = { ...STATE };
   render() {
+    const { style } = this.props;
     const { authedFollows, followersCount } = this.props.proposal;
     const { loading } = this.state;
     return (
-      <Input.Group className="Follow" compact>
+      <Input.Group style={style} className="Follow" compact>
         <AuthButton onClick={this.handleFollow}>
           <Icon
             theme={authedFollows ? 'filled' : 'outlined'}
diff --git a/frontend/client/components/Like/index.tsx b/frontend/client/components/Like/index.tsx
index 7e370ac0..f993620e 100644
--- a/frontend/client/components/Like/index.tsx
+++ b/frontend/client/components/Like/index.tsx
@@ -14,6 +14,7 @@ interface OwnProps {
   proposal?: ProposalDetail | null;
   comment?: Comment;
   rfp?: RFP;
+  style?: React.CSSProperties;
 }
 
 interface StateProps {
@@ -38,13 +39,13 @@ class Follow extends React.Component<Props, State> {
 
   render() {
     const { likesCount, authedLiked } = this.deriveInfo();
-    const { proposal, rfp, comment } = this.props;
+    const { proposal, rfp, comment, style } = this.props;
     const { loading } = this.state;
     const zoom = comment ? 0.8 : 1;
     const shouldShowLikeText = !!proposal || !!rfp;
 
     return (
-      <Input.Group className="Like" compact style={{ zoom }}>
+      <Input.Group className="Like" compact style={{ zoom, ...style }}>
         <AuthButton onClick={this.handleLike}>
           <Icon
             theme={authedLiked ? 'filled' : 'outlined'}
diff --git a/frontend/client/components/Proposal/index.less b/frontend/client/components/Proposal/index.less
index 5daffd59..5729dd86 100644
--- a/frontend/client/components/Proposal/index.less
+++ b/frontend/client/components/Proposal/index.less
@@ -103,10 +103,6 @@
           & .ant-input-group {
             width: inherit
           }
-
-          & > * + * {
-            margin-left: 0.5rem;
-          }
         }
       }
 
diff --git a/frontend/client/components/Proposal/index.tsx b/frontend/client/components/Proposal/index.tsx
index 17a146b9..1fbfbd67 100644
--- a/frontend/client/components/Proposal/index.tsx
+++ b/frontend/client/components/Proposal/index.tsx
@@ -206,8 +206,8 @@ export class ProposalDetail extends React.Component<Props, State> {
                       </Button>
                     </Dropdown>
                   )}
-                  <Like proposal={proposal} />
-                  <Follow proposal={proposal} />
+                  <Like proposal={proposal} style={{ marginLeft: '0.5rem' }} />
+                  <Follow proposal={proposal} style={{ marginLeft: '0.5rem' }} />
                 </div>
               )}
             </div>