Update with latest dependencies

js/src/Connection/connection.css

@@ -15,8 +15,6 @@
 /* along with Parity.  If not; see <http://www.gnu.org/licenses/>.
 */
 
-@import '../ParityBar/_colors.css';
-
 .overlay {
   position: fixed;
   top: 0;
@@ -37,8 +35,6 @@
 }
 
 .body {
-  background: $backgroundColor;
-  background: $backgroundGradient;
   box-shadow: rgba(0, 0, 0, 0.25) 0 14px 45px, rgba(0, 0, 0, 0.22) 0 10px 18px;
   color: rgb(208, 208, 208);
   margin: 0 auto;

js/src/Connection/connection.js

@@ -19,6 +19,7 @@ import { FormattedMessage } from 'react-intl';
 import { connect } from 'react-redux';
 import PropTypes from 'prop-types';
 
+import GradientBg from '@parity/ui/GradientBg';
 import Input from '@parity/ui/Form/Input';
 import { CompareIcon, ComputerIcon, DashboardIcon, VpnIcon } from '@parity/ui/Icons';
 
@@ -52,7 +53,7 @@ class Connection extends Component {
       <div>
         <div className={ styles.overlay } />
         <div className={ styles.modal }>
-          <div className={ styles.body }>
+          <GradientBg className={ styles.body }>
             <div className={ styles.icons }>
               <div className={ styles.icon }>
                 <ComputerIcon className={ styles.svg } />
@@ -73,7 +74,7 @@ class Connection extends Component {
                 ? this.renderSigner()
                 : this.renderPing()
             }
-          </div>
+          </GradientBg>
         </div>
       </div>
     );