Merge pull request #5783 from luixxiul/flashIconAlignment

Aligned Flash info icons
brave · Nov 29, 2016 · 3ee77ac · 3ee77ac
2 parents 57cecb9 + 9817f5a
commit 3ee77ac
Show file tree

Hide file tree

Showing 2 changed files with 25 additions and 14 deletions.
diff --git a/js/about/preferences.js b/js/about/preferences.js
@@ -1603,24 +1603,29 @@ class SecurityTab extends ImmutableComponent {
       <div className='sectionTitle' data-l10n-id='pluginSettings' />
       <SettingsList>
         <SettingCheckbox checked={this.props.flashInstalled ? this.props.braveryDefaults.get('flash') : false} dataL10nId='enableFlash' onChange={this.onToggleFlash} disabled={!this.props.flashInstalled} />
-        <span className='subtext'>
-          <span className='fa fa-info-circle' id='flashInfoIcon' />
+        <div className='subtext flashText'>
           {
             isDarwin || isWindows
-              ? <span><span data-l10n-id='enableFlashSubtext' />&nbsp;
+              ? <div>
+                <span className='fa fa-info-circle' id='flashInfoIcon' />
+                <span data-l10n-id='enableFlashSubtext' />&nbsp;
                 <span className='linkText' onClick={aboutActions.newFrame.bind(null, {
                   location: appConfig.flash.installUrl
-                }, true)}>{'Adobe'}</span>.</span>
-              : <span data-l10n-id='enableFlashSubtextLinux' />
+                }, true)}>{'Adobe'}</span>.
+                </div>
+              : <div>
+                <span className='fa fa-info-circle' id='flashInfoIcon' />
+                <span data-l10n-id='enableFlashSubtextLinux' />
+              </div>
           }
           <div>
             <span className='fa fa-info-circle' id='flashInfoIcon' />
-            <span><span data-l10n-id='flashTroubleshooting' />&nbsp;
-              <span className='linkText' onClick={aboutActions.newFrame.bind(null, {
-                location: 'https://github.com/brave/browser-laptop/wiki/Flash-Support-Deprecation-Proposal#troubleshooting-flash-issues'
-              }, true)}>{'wiki'}</span>.</span>
+            <span data-l10n-id='flashTroubleshooting' />&nbsp;
+            <span className='linkText' onClick={aboutActions.newFrame.bind(null, {
+              location: 'https://github.com/brave/browser-laptop/wiki/Flash-Support-Deprecation-Proposal#troubleshooting-flash-issues'
+            }, true)}>{'wiki'}</span>.
           </div>
-        </span>
+        </div>
       </SettingsList>
       { !isLinux
       ? <div>

diff --git a/less/about/preferences.less b/less/about/preferences.less
@@ -333,6 +333,16 @@ a {
   margin: 1.2em 2px 7px;
 }
 
+.settingsList .subtext {
+  &.flashText {
+    margin-top: 0;
+
+    #flashInfoIcon {
+      padding: 5px 5px 5px 0;
+    }
+  }
+}
+
 .settingsListCopy {
   color: @braveOrange;
   cursor: pointer;
@@ -1016,10 +1026,6 @@ div.nextPaymentSubmission {
   }
 }
 
-#flashInfoIcon {
-  padding: 5px 5px 5px 0;
-}
-
 .widevineInfoIcon {
   padding: 5px;
 }