[cros] Fix error screen layout in new OOBE design.

BUG=129799
TEST=Disconnect network at GAIA sign in screen with new OOBE.

Review URL: https://chromiumcodereview.appspot.com/10477017

git-svn-id: svn://svn.chromium.org/chrome/trunk/src@140529 0039d316-1c4b-4281-b951-d872f2087c98

4 files changed, 56 insertions, 32 deletions

diff --git a/chrome/browser/resources/chromeos/login/oobe.css b/chrome/browser/resources/chromeos/login/oobe.css
index 5763cdf..13d0df4 100644
--- a/chrome/browser/resources/chromeos/login/oobe.css
+++ b/chrome/browser/resources/chromeos/login/oobe.css
@@ -371,31 +371,31 @@ html[oobe=old] #connect {
 /* TODO(nkostylev): Extract common style for OOBE steps. */
 html[oobe=new] #connect {
   min-height: 304px;
-  padding: 70px 17px 21px 17px;
+  padding: 70px 17px 21px;
   width: 688px;
 }
 
 html[oobe=new] #eula {
   min-height: 304px;
-  padding: 70px 17px 21px 17px;
+  padding: 70px 17px 21px;
   width: 688px;
 }
 
 html[oobe=new] #update {
   min-height: 284px;
-  padding: 70px 17px 69px 17px;    /* Screen has no controls. */
+  padding: 70px 17px 69px;    /* Screen has no controls. */
   width: 688px;
 }
 
 html[oobe=new] #gaia-signin {
   height: 470px;
-  padding: 70px 17px 69px 17px;    /* Screen has no controls. */
+  padding: 70px 17px 69px;    /* Screen has no controls. */
   width: 688px;
 }
 
 html[oobe=new] #user-image {
   min-height: 352px;
-  padding: 70px 17px 21px 17px;
+  padding: 70px 17px 21px;
   width: 688px;
 }
 
diff --git a/chrome/browser/resources/chromeos/login/screen_error_message.css b/chrome/browser/resources/chromeos/login/screen_error_message.css
index 8ce7a7b..7c7ddc7 100644
--- a/chrome/browser/resources/chromeos/login/screen_error_message.css
+++ b/chrome/browser/resources/chromeos/login/screen_error_message.css
@@ -3,6 +3,13 @@
  * found in the LICENSE file.
  */
 
+html[oobe=new] #error-message {
+  min-height: 184px;
+  /* Screen has no controls but has padding at the last text message */
+  padding: 70px 17px 50px;
+  width: 688px;
+}
+
 #error-message-screen-title {
   -webkit-margin-end: 60px;
   -webkit-margin-start: 60px;
diff --git a/chrome/browser/resources/chromeos/login/screen_error_message.html b/chrome/browser/resources/chromeos/login/screen_error_message.html
index 228f1f3..b980633 100644
--- a/chrome/browser/resources/chromeos/login/screen_error_message.html
+++ b/chrome/browser/resources/chromeos/login/screen_error_message.html
@@ -1,33 +1,38 @@
 <div id="error-message" class="step faded hidden show-offline-message">
-  <div id="error-message-screen-title">
-    <span id="error-message-title" i18n-content="offlineMessageTitle"
-        class="show-with-offline-message"></span>
-    <span id="captive-portal-title" i18n-content="captivePortalTitle"
-        class="show-with-captive-portal show-with-proxy-error"></span>
+  <div class="step-logo">
+    <img src="chrome://theme/IDR_PRODUCT_LOGO">
   </div>
-  <div id="error-message-body">
-    <span id="offline-message-text" i18n-content="offlineMessageBody"
-        class="show-with-offline-message"></span>
-    <div id="captive-portal-message-text"
-        class="show-with-captive-portal"></div>
-    <div id="captive-portal-proxy-message-text"
-        class="show-with-captive-portal"></div>
-    <div id="proxy-message-text"
-        class="show-with-proxy-error"></div>
-  </div>
-  <div id="offline-network-control" class="control-with-label">
-    <label for="offline-networks-list-dropdown" i18n-content="selectNetwork"
-        class="flexible-label dont-show-with-captive-portal"></label>
-    <label for="offline-networks-list-dropdown"
-        i18n-content="selectAnotherNetwork"
-        class="flexible-label show-with-captive-portal"></label>
-    <div class="menu-area">
-      <div id="offline-networks-list" class="menu-control">
+  <div class="step-contents">
+    <div id="error-message-screen-title">
+      <span id="error-message-title" i18n-content="offlineMessageTitle"
+          class="show-with-offline-message"></span>
+      <span id="captive-portal-title" i18n-content="captivePortalTitle"
+          class="show-with-captive-portal show-with-proxy-error"></span>
+    </div>
+    <div id="error-message-body">
+      <span id="offline-message-text" i18n-content="offlineMessageBody"
+          class="show-with-offline-message"></span>
+      <div id="captive-portal-message-text"
+          class="show-with-captive-portal"></div>
+      <div id="captive-portal-proxy-message-text"
+          class="show-with-captive-portal"></div>
+      <div id="proxy-message-text"
+          class="show-with-proxy-error"></div>
+    </div>
+    <div id="offline-network-control" class="control-with-label">
+      <label for="offline-networks-list-dropdown" i18n-content="selectNetwork"
+          class="flexible-label dont-show-with-captive-portal"></label>
+      <label for="offline-networks-list-dropdown"
+          i18n-content="selectAnotherNetwork"
+          class="flexible-label show-with-captive-portal"></label>
+      <div class="menu-area">
+        <div id="offline-networks-list" class="menu-control">
+        </div>
       </div>
     </div>
+    <div id="error-guest-signin"
+        class="show-with-offline-message show-with-captive-portal"></div>
+    <div id="error-offline-login"
+        class="show-with-offline-message show-with-captive-portal"></div>
   </div>
-  <div id="error-guest-signin"
-      class="show-with-offline-message show-with-captive-portal"></div>
-  <div id="error-offline-login"
-      class="show-with-offline-message show-with-captive-portal"></div>
 </div>
diff --git a/chrome/browser/resources/chromeos/login/screen_error_message.js b/chrome/browser/resources/chromeos/login/screen_error_message.js
index 0761de8..4f6940a 100644
--- a/chrome/browser/resources/chromeos/login/screen_error_message.js
+++ b/chrome/browser/resources/chromeos/login/screen_error_message.js
@@ -233,6 +233,12 @@ cr.define('login', function() {
         offlineMessage.classList.remove('hidden');
         offlineMessage.classList.remove('faded');
 
+        if (Oobe.getInstance().isNewOobe()) {
+          $('inner-container').style.height =
+              offlineMessage.offsetHeight + 'px';
+          $('inner-container').style.width = offlineMessage.offsetWidth + 'px';
+        }
+
         if (!currentScreen.classList.contains('faded')) {
           currentScreen.classList.add('faded');
           currentScreen.addEventListener('webkitTransitionEnd',
@@ -267,6 +273,12 @@ cr.define('login', function() {
           currentScreen.classList.remove('hidden');
           currentScreen.classList.remove('faded');
 
+          if (Oobe.getInstance().isNewOobe()) {
+            $('inner-container').style.height =
+                currentScreen.offsetHeight + 'px';
+            $('inner-container').style.width = currentScreen.offsetWidth + 'px';
+          }
+
           // Forces a reload for Gaia screen on hiding error message.
           if (currentScreen.id == 'gaia-signin')
             currentScreen.doReload();