fix 'beta' logo alignment, add it to sync tab

address #8121 (comment) and makes the logo look the same on sync and payments tabs
brave · Apr 10, 2017 · 9bd3941 · 9bd3941
1 parent 73762de
commit 9bd3941
Show file tree

Hide file tree

Showing 2 changed files with 7 additions and 9 deletions.
diff --git 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
@@ -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;
     }
   }