adjust version check errors language; add different image for offline…

… error

lib/components/VersionCheckError.js

@@ -15,6 +15,7 @@
 * == BSD2 LICENSE ==
 */
 
+import cx from 'classnames';
 import React, { Component, PropTypes } from 'react';
 
 import * as errorUtils from '../redux/utils/errors';
@@ -29,9 +30,9 @@ export default class VersionCheckError extends Component {
     errorText: {
       CONNECT: 'Please check your connection and relaunch.',
       ERROR_DETAILS: 'Details for Tidepool\'s developers:',
-      OFFLINE: 'You don\'t appear to be connected to the Internet.',
+      OFFLINE: 'You\'re not connected to the Internet.',
       SERVERS_DOWN: 'Tidepool\'s servers are down.',
-      TRY_AGAIN: 'Please try again in a few minutes.'
+      TRY_AGAIN: 'Please relaunch & try again in a few minutes.'
     }
   };
 
@@ -50,8 +51,13 @@ export default class VersionCheckError extends Component {
     );
     const firstLine = offline ? errorText.OFFLINE : errorText.SERVERS_DOWN;
     const secondLine = offline ? errorText.CONNECT : errorText.TRY_AGAIN;
+    const versionCheckClass = cx({
+      VersionCheck: true,
+      'VersionCheck--failed': !offline,
+      'VersionCheck--offline': offline
+    });
     return (
-      <div className="VersionCheck VersionCheck--failed">
+      <div className={versionCheckClass}>
         <div className="VersionCheck-text">
           <p>{firstLine}</p>
           <p>{secondLine}</p>

styles/components/VersionCheck.less

@@ -11,6 +11,13 @@
     background: url(/images/unhappy_meter.png) center center / 69px 166px no-repeat;
     .mostly-opaque-background();
   }
+  &.VersionCheck--offline {
+    background: url(/images/unhappy_device.png);
+    background-position: 50% 60%;
+    background-size: 105px 237px;
+    background-repeat: no-repeat;
+    .mostly-opaque-background();
+  }
   &.VersionCheck--outdated {
     background: url(/images/happy_device.png);
     background-position: 50% 60%;