Material UI: upgrade modals

Also clean up the Create Torrent page, delete some redundant CSS, prevent click-and-drag inside a TextField from moving the whole window, and make all label and input fonts  a consistent 14px size.

src/renderer/components/unsupported-media-modal.js

@@ -2,6 +2,7 @@ const React = require('react')
 const electron = require('electron')
 const path = require('path')
 
+const ModalOKCancel = require('./modal-ok-cancel')
 const {dispatcher} = require('../lib/dispatcher')
 
 module.exports = class UnsupportedMediaModal extends React.Component {
@@ -15,22 +16,25 @@ module.exports = class UnsupportedMediaModal extends React.Component {
     const playerName = playerPath
       ? path.basename(playerPath).split('.')[0]
       : 'VLC'
-    const onPlay = dispatcher('openExternalPlayer')
-    const actionButton = state.modal.externalPlayerInstalled
-      ? (<button className='button-raised' onClick={onPlay}>Play in {playerName}</button>)
-      : (<button className='button-raised' onClick={() => this.onInstall()}>Install VLC</button>)
-    const playerMessage = state.modal.externalPlayerNotFound
+    const onAction = state.modal.externalPlayerInstalled
+      ? dispatcher('openExternalPlayer')
+      : () => this.onInstall()
+    const actionText = state.modal.externalPlayerInstalled
+      ? 'PLAY IN ' + playerName.toUpperCase()
+      : 'INSTALL VLC'
+    const errorMessage = state.modal.externalPlayerNotFound
       ? 'Couldn\'t run external player. Please make sure it\'s installed.'
       : ''
     return (
       <div>
         <p><strong>Sorry, we can't play that file.</strong></p>
         <p>{message}</p>
-        <p className='float-right'>
-          <button className='button-flat' onClick={dispatcher('backToList')}>Cancel</button>
-          {actionButton}
-        </p>
-        <p className='error-text'>{playerMessage}</p>
+        <ModalOKCancel
+          cancelText='CANCEL'
+          onCancel={dispatcher('backToList')}
+          okText={actionText}
+          onOK={onAction} />
+        <p className='error-text'>{errorMessage}</p>
       </div>
     )
   }