From 887b2572f5cd95a5a2c006b890cad9f6ed2db5bd Mon Sep 17 00:00:00 2001
From: ricky <hello@ricky.codes>
Date: Sat, 31 Aug 2019 12:01:53 -0400
Subject: [PATCH] Add breadcrumb spacing on Contacts page (#7087)

---
 ui/app/pages/settings/index.scss            | 5 +++++
 ui/app/pages/settings/settings.component.js | 8 ++++++--
 2 files changed, 11 insertions(+), 2 deletions(-)

diff --git a/ui/app/pages/settings/index.scss b/ui/app/pages/settings/index.scss
index 4cbe5632e..041d12f72 100644
--- a/ui/app/pages/settings/index.scss
+++ b/ui/app/pages/settings/index.scss
@@ -52,6 +52,11 @@
     color: #037DD6;
   }
 
+  &__subheader--break {
+    margin-right: 4px;
+    padding-right: 4px;
+  }
+
   &__sub-header {
     height: 72px;
     border-bottom: 1px solid #D8D8D8;
diff --git a/ui/app/pages/settings/settings.component.js b/ui/app/pages/settings/settings.component.js
index 781b38eff..975ab4e35 100644
--- a/ui/app/pages/settings/settings.component.js
+++ b/ui/app/pages/settings/settings.component.js
@@ -136,8 +136,12 @@ class SettingsPage extends PureComponent {
           className={c({ 'settings-page__subheader--link': initialBreadCrumbRoute })}
           onClick={() => initialBreadCrumbRoute && history.push(initialBreadCrumbRoute)}
         >{subheaderText}</div>
-        {breadCrumbTextKey && <div><span>{'> '}</span>{t(breadCrumbTextKey)}</div>}
-        {isAddressEntryPage && <div><span>{' > '}</span>{addressName}</div>}
+        {breadCrumbTextKey && <div
+          className="settings-page__subheader--break"
+        ><span>{' > '}</span>{t(breadCrumbTextKey)}</div>}
+        {isAddressEntryPage && <div
+          className="settings-page__subheader--break"
+        ><span>{' > '}</span>{addressName}</div>}
       </div>
     )
   }