Pin keyboard moved to under the user profile.

chrome/browser/resources/chromeos/quick_unlock/pin_keyboard.html

 <!-- TODO(crbug.com/603217): Use i18n instead of string literals. Figure out
                              what i18n to use for keypad, ie, does 1 ABC make
                              sense in every scenario? -->
 
 <link rel="import" href="chrome://resources/polymer/v1_0/paper-button/paper-button.html">
 <link rel="import" href="chrome://resources/polymer/v1_0/paper-icon-button/paper-icon-button.html">
 <link rel="import" href="chrome://resources/polymer/v1_0/paper-styles/paper-styles.html">
 <link rel="import" href="chrome://resources/polymer/v1_0/iron-icons/iron-icons.html">
 
 <dom-module id="pin-keyboard">
   <template>
     <style>
       #root {
         display: flex;
       }
 
       /* TODO(jdufault): Remove this CSS once we inline the PIN element with the
        * user-pod. */
       #container-constrained-width {
         -webkit-tap-highlight-color: transparent;
         background: white;
         border-radius: 2px;
         box-shadow: 0 4px 23px 5px rgba(0, 0, 0, 0.2),
                     0 2px 6px rgba(0, 0, 0, 0.15),
                     0 3px 0 rgba(0, 0, 0, 0.08);
         cursor: pointer;
         flex-direction: column;
         outline: none;
+        width: 256px;

[jdufault, 2016/06/15 22:20:39]

Is this needed?

[sammiequon, 2016/06/17 01:00:43]

Done.

       }
 
       .row {
         display: flex;
+        width: 256px;

[jdufault, 2016/06/15 22:20:39]

Is this needed / can it be driven by #container-constrained-width?

[sammiequon, 2016/06/17 01:00:43]

Done.

       }
 
       .row.horizontal-center {
+        height: 46px;

[jdufault, 2016/06/15 22:20:39]

ditto

[sammiequon, 2016/06/17 01:00:43]

Done.

         justify-content: center;
       }
 
+      .row.keyboard {
+        height: 72px;
+      }
+
       .digit-button {
         align-items: center;
         background: none;
         border-radius: 50px;
         display: flex;
         font-size: 30px;
         justify-content: center;
         margin: 5px;
-        min-width: 94px;
-        width: 94px;
+      }
+
+      .row.keyboard paper-button {

[jdufault, 2016/06/15 22:20:39]

Why is this change needed?

[sammiequon, 2016/06/17 01:00:43]

Done.

+        display: block;
+        min-height: 20px;
+        min-width: 20px;
+        position: relative;
+        width: 85px;
       }
 
       .digit-button inner-text {
         display: flex;
         flex-direction: column;
-        height: 52px;
+        font-size: 34px;
+        text-align: center;
       }
 
       .digit-button inner-text subhead {
         color: var(--paper-grey-500);
         font-size: 16px;
       }
 
       .digit-button .submit-button {
         background: var(--paper-blue-a400);
         color: white;
         font-size: 20px;
-        height: 60px;
         min-width: 0;
-        width: 60px;
       }
 
       #pin-input {
         -webkit-text-security: disc;
         border-bottom-color: lightgray;
         border-left: none;
         border-right: none;
         border-top: none;
         font-size: 20px;
         height: 30px;
@@ skipping 64 matching lines @@
             <paper-icon-button class="digit-button submit-button"
                                icon="icons:check" on-tap="onPinSubmit_">
             </paper-icon-button>
           </div>
         </div>
       </div>
     </div>
   </template>
   <script src="pin_keyboard.js"></script>
 </dom-module>