Implemented new UI for error messages on OOBE/Login.

chrome/browser/resources/chromeos/login/oobe.css

 /* Copyright (c) 2012 The Chromium Authors. All rights reserved.
  * Use of this source code is governed by a BSD-style license that can be
  * found in the LICENSE file.
  *
  * This is the stylesheet used by the Out of the box experience (OOBE) flow,
  * sign in and lock screens.
  */
 
 html,
 body {
@@ skipping 51 matching lines @@
 #reset-button,
 #password-changed-back-button,
 #tos-back-button {
   -webkit-margin-end: 8px;
 }
 
 #outer-container {
   -webkit-box-align: center;
   -webkit-box-pack: center;
   -webkit-perspective: 600px;
-  bottom: 41px;  /* Leave space for the header bar */
+  bottom: 48px;  /* Leave space for the header bar */
   display: -webkit-box;
   left: 0;
   position: absolute;
   right: 0;
   top: 0;
 }
 
-#oobe {
-  margin-top: 40px;  /* Compensate bottom header to center content. */
-}
-
 #inner-container {
   border-radius: 2px;
   padding: 0;
   position: relative;
 }
 
 #inner-container.animation {
   overflow: hidden;
 }
 
 /* Screens that have a border and background. */
 #oobe.connect #inner-container,
 #oobe.enrollment #inner-container,
 #oobe.eula #inner-container,
 #oobe.gaia-signin #inner-container,
-#oobe.error-message #inner-container,
 #oobe.oauth-enrollment #inner-container,
 #oobe.reset #inner-container,
 #oobe.update #inner-container,
 #oobe.user-image #inner-container,
 #oobe.managed-user-creation-dialog #inner-container,
 #oobe.managed-user-creation-flow #inner-container,
-#oobe.tpm-error-message #inner-container,
 #oobe.password-changed #inner-container,
 #oobe.terms-of-service #inner-container,
 #oobe.wrong-hwid #inner-container {
   background: -webkit-linear-gradient(rgba(255,255,255,0.99),
                                       rgba(255,255,255,0.95));
   box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.3),
               0 4px 23px 5px rgba(0, 0, 0, 0.2),
               0 2px 6px rgba(0, 0, 0, 0.15);
 }
 
+#oobe.error-message #inner-container,
+#oobe.tpm-error-message #inner-container {
+  box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.3),
+              0 4px 23px 5px rgba(0, 0, 0, 0.2),
+              0 2px 6px rgba(0, 0, 0, 0.15);
+

[Nikita (slow), 2013/03/26 08:31:15]

nit: Drop empty line.

+}
+
 /* Only play this animation when 'down' class is removed. */
 #inner-container:not(.down) {
   -webkit-transition: -webkit-transform 200ms ease-in-out;
 }
 
 #inner-container.down {
   -webkit-transform: translateY(50px) rotateX(-2.5deg);
 }
 
 #eula #stats-help-link {
@@ skipping 925 matching lines @@
   -webkit-transition: 250ms opacity;
 }
 
 body.login-display #inner-container {
   height: 262px;
   padding: 0;
   width: 1100px;
 }
 
 body.login-display #progress-dots {
-  visibility: hidden;
+  display: none;
 }
 
 span.bold {
   font-weight: bold;
 }
 
 #version-labels {
   -webkit-transition: all 500ms linear;
   color: #fff;
   font-size: 11px;
   margin: 10px;
   text-align: end;
   text-shadow:
       0 0 4px rgba(0,0,0,.6),
       0 1px 2px rgba(0,0,0,.8),
       0 -1px 2px rgba(0,0,0,1);
 }
 
-#offline-network-control {
-  margin-left: 60px;
-}
-
 #notification-area {
   color: #666;
   position: absolute;
   text-align: center;
   top: 40px;
   width: 100%;
 }
 
 #notification-area a {
   color: rgb(37, 79, 155);
@@ skipping 15 matching lines @@
 }
 
 .background-initial {
   opacity: 0;
 }
 
 .background-final {
   opacity: 1;
 }