1 files changed, 12 insertions, 11 deletions
diff --git a/ui/app/components/sender-to-recipient/sender-to-recipient.component.js b/ui/app/components/sender-to-recipient/sender-to-recipient.component.js
index e71bd7406..89a1a9c08 100644
--- a/ui/app/components/sender-to-recipient/sender-to-recipient.component.js
+++ b/ui/app/components/sender-to-recipient/sender-to-recipient.component.js
@@ -4,12 +4,13 @@ import classnames from 'classnames'
 import Identicon from '../identicon'
 import Tooltip from '../tooltip-v2'
 import copyToClipboard from 'copy-to-clipboard'
-import { DEFAULT_VARIANT, CARDS_VARIANT } from './sender-to-recipient.constants'
+import { DEFAULT_VARIANT, CARDS_VARIANT, FLAT_VARIANT } from './sender-to-recipient.constants'
 import { checksumAddress } from '../../util'
 
 const variantHash = {
   [DEFAULT_VARIANT]: 'sender-to-recipient--default',
   [CARDS_VARIANT]: 'sender-to-recipient--cards',
+  [FLAT_VARIANT]: 'sender-to-recipient--flat',
 }
 
 export default class SenderToRecipient extends PureComponent {
@@ -19,7 +20,7 @@ export default class SenderToRecipient extends PureComponent {
     recipientName: PropTypes.string,
     recipientAddress: PropTypes.string,
     t: PropTypes.func,
-    variant: PropTypes.oneOf([DEFAULT_VARIANT, CARDS_VARIANT]),
+    variant: PropTypes.oneOf([DEFAULT_VARIANT, CARDS_VARIANT, FLAT_VARIANT]),
     addressOnly: PropTypes.bool,
     assetImage: PropTypes.string,
   }
@@ -128,16 +129,9 @@ export default class SenderToRecipient extends PureComponent {
   }
 
   renderArrow () {
-    return this.props.variant === CARDS_VARIANT
+    return this.props.variant === DEFAULT_VARIANT
       ? (
         <div className="sender-to-recipient__arrow-container">
-          <img
-            height={20}
-            src="./images/caret-right.svg"
-          />
-        </div>
-      ) : (
-        <div className="sender-to-recipient__arrow-container">
           <div className="sender-to-recipient__arrow-circle">
             <img
               height={15}
@@ -146,6 +140,13 @@ export default class SenderToRecipient extends PureComponent {
             />
           </div>
         </div>
+      ) : (
+        <div className="sender-to-recipient__arrow-container">
+          <img
+            height={20}
+            src="./images/caret-right.svg"
+          />
+        </div>
       )
   }
 
@@ -154,7 +155,7 @@ export default class SenderToRecipient extends PureComponent {
     const checksummedSenderAddress = checksumAddress(senderAddress)
 
     return (
-      <div className={classnames(variantHash[variant])}>
+      <div className={classnames('sender-to-recipient', variantHash[variant])}>
         <div
           className={classnames('sender-to-recipient__party sender-to-recipient__party--sender')}
           onClick={() => {