From 639f072deb58b47a6ae79beee3fef0b21fdc4753 Mon Sep 17 00:00:00 2001
From: yan <yan@mit.edu>
Date: Mon, 10 Apr 2017 17:57:03 +0000
Subject: [PATCH] fix 'beta' logo alignment, add it to sync tab

address https://github.com/brave/browser-laptop/issues/8121#issuecomment-293023244 and makes the logo look the same on sync and payments tabs
---
 app/renderer/components/preferences/syncTab.js | 7 +++++--
 less/about/preferences.less                    | 9 ++-------
 2 files changed, 7 insertions(+), 9 deletions(-)

diff --git a/app/renderer/components/preferences/syncTab.js b/app/renderer/components/preferences/syncTab.js
index 4755c73829c..e00e647efba 100644
--- a/app/renderer/components/preferences/syncTab.js
+++ b/app/renderer/components/preferences/syncTab.js
@@ -284,11 +284,14 @@ class SyncTab extends ImmutableComponent {
         ? <ModalOverlay title={'syncReset'} content={this.resetOverlayContent} footer={this.resetOverlayFooter} onHide={this.props.hideOverlay.bind(this, 'syncReset')} />
         : null
       }
-      <div className='sectionTitle' data-l10n-id='syncTitle' />
+      <div className='sectionTitleWrapper'>
+        <span className='sectionTitle' data-l10n-id='syncTitle' />
+        <span className='sectionSubTitle'>beta</span>
+      </div>
       <div className='settingsListContainer'>
         <span className='settingsListTitle syncTitleMessage' data-l10n-id='syncTitleMessage' />
         <a href='https://github.com/brave/sync/wiki/Design' target='_blank'>
-          <span className='fa fa-question-circle fundsFAQ' />
+          <span className='fa fa-question-circle' />
         </a>
         <div className='settingsListTitle syncBetaMessage' data-l10n-id='syncBetaMessage' />
         {
diff --git a/less/about/preferences.less b/less/about/preferences.less
index 0f052c40d9d..e9448fe19aa 100644
--- a/less/about/preferences.less
+++ b/less/about/preferences.less
@@ -31,18 +31,13 @@ body {
     .sectionTitle {
       color: @braveOrange;
       font-size: 28px;
-      margin-bottom: 0;
-      position: absolute;
-      bottom: 0;
-      left: 0;
+      margin-bottom: 8px;
     }
 
     .sectionSubTitle {
       color: #999;
       font-size: 15px;
-      position: absolute;
-      bottom: 25px;
-      right: 19px;
+      vertical-align: top;
     }
   }