First stab at configurable UI scaling

Doesn't affect page size; scaling is for the UI elements

Fixes #1937

js/about/preferences.js

@@ -32,6 +32,7 @@ const settings = require('../constants/settings')
 const {changeSetting} = require('../../app/renderer/lib/settingsUtil')
 const {passwordManagers, extensionIds} = require('../constants/passwordManagers')
 const {startsWithOption, newTabMode, bookmarksToolbarMode, tabCloseAction, fullscreenOption} = require('../../app/common/constants/settingsEnums')
+const {scaleSize} = require('../../app/common/constants/toolbarUserInterfaceScale')
 
 const aboutActions = require('./aboutActions')
 const appActions = require('../actions/appActions')
@@ -230,6 +231,17 @@ class GeneralTab extends ImmutableComponent {
             }
           </SettingDropdown>
         </SettingItem>
+        <SettingItem dataL10nId='toolbarUserInterfaceScale'>
+          <SettingDropdown
+            value={getSetting(settings.TOOLBAR_UI_SCALE, this.props.settings)}
+            onChange={changeSetting.bind(null, this.props.onChangeSetting, settings.TOOLBAR_UI_SCALE)}>
+            data-type='float'>
+            <option value={scaleSize.SMALLER}>Smaller</option>
+            <option value={scaleSize.NORMAL}>Normal</option>
+            <option value={scaleSize.LARGER}>Larger</option>
+            <option value={scaleSize.SUPERSIZE}>Supersize</option>
+          </SettingDropdown>
+        </SettingItem>
         <SettingItem dataL10nId='importBrowserData'>
           <Button l10nId='importNow' className='primaryButton importNowButton'
             onClick={this.importBrowserDataNow} />