Multi-pod support for lock screen.

ui/login/account_picker/user_pod_row.css

 /* Copyright 2014 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 user pods row of account picker UI.
  */
 
 podrow {
   /* Temporarily disabled because animation interferes with updating screen's
    size. */
@@ skipping 28 matching lines @@
   width: 180px;
   z-index: 0;
 }
 
 #account_picker.flying-pods .pod {
   transition: all 180ms;
 }
 
 .pod.flying-pin-pod {
   transition: height 180ms ease-in-out,
+              left 180ms ease-in-out,
               top 180ms ease-in-out,
               width 180ms ease-in-out;
 }
 
 .pod.pin-enabled {
   height: 594px;
   top: -200px !important;
   width: 270px;
 }
 
@@ skipping 150 matching lines @@
   visibility: visible;
 }
 
 .auth-container.pin-enabled {
   opacity: 0;
   transition: none;
   visibility: hidden;
 }
 
 .name-container {
-  transition: transform 180ms;
+  transition: transform 180ms,
+              opacity 180ms ease-in-out 180ms,
+              visibility 180ms ease-in-out 180ms;
+  opacity : 1;
+  visibility: visible;
 }
 
-.pod.focused .name-container {
-  display: none;
+.name-container.pin-enabled {
+  opacity : 0;
+  transition: none;
+  visibility: hidden;
 }
 
 .pod.focused.multiprofiles-policy-applied .name-container {
   display: flex;
 }
 
 .name {
   color: #565656;
   /* This should be 15.6px - the equivalent of 14px at 90% scale. */
   flex: auto;
@@ skipping 673 matching lines @@
   -webkit-animation: ellipsis-component2 1.5s infinite;
 }
 
 @-webkit-keyframes ellipsis-component2 {
   0% { opacity: 0; }
   25% { opacity: 0; }
   50% { opacity: 0; }
   75% { opacity: 1; }
   100% { opacity: 0; }
 }