MD Settings: Bluetooth polish

chrome/browser/resources/settings/bluetooth_page/bluetooth_device_dialog.html

Index: chrome/browser/resources/settings/bluetooth_page/bluetooth_device_dialog.html
diff --git a/chrome/browser/resources/settings/bluetooth_page/bluetooth_device_dialog.html b/chrome/browser/resources/settings/bluetooth_page/bluetooth_device_dialog.html
index 55a355f17c22881626e26e0fa8788ead946f8f45..e7ebe0b4e22d312837cec0e049964c2df4336fd8 100644
--- a/chrome/browser/resources/settings/bluetooth_page/bluetooth_device_dialog.html
+++ b/chrome/browser/resources/settings/bluetooth_page/bluetooth_device_dialog.html
@@ -40,6 +40,11 @@
         margin-bottom: 10px;
       }
 
+      div.contents {

[Dan Beam, 2016/08/12 00:43:28]

nit: unless it's necessary, I'd drop the "div" part of the selector

+        max-height: 250px;
+        min-height: 250px;
+      }
+
       /* .display indicates a displayed pin code or passkey. */
       span.display {
         border: 1px solid #ccc;
@@ -75,60 +80,64 @@
         font-weight: 600;  /* semibold */
         margin: 0 20px;
       }
-    </style>
+      </style>
     <dialog is="cr-dialog" id="dialog" on-cancel="onDialogCanceled_">
       <div class="title">[[getTitle_(dialogId)]]</div>
       <div class="body">
-        <template is="dom-if" if="[[isDialogType_(dialogId, 'addDevice')]]">
-          <div id="dialogDeviceList" class="layout vertical"
-              on-device-event="onDeviceEvent_">
-            <span class="no-devices" hidden$="[[haveDevices_(deviceList)]]">
-              $i18n{bluetoothNoDevices}
-            </span>
-            <iron-selector class="flex">
-              <template is="dom-repeat" items="[[deviceList]]"
-                  filter="deviceNotPaired_" observe="paired">
-                <bluetooth-device-list-item device="[[item]]">
-                </bluetooth-device-list-item>
-              </template>
-            </iron-selector>
-          </div>
-        </template>
-        <template is="dom-if" if="[[isDialogType_(dialogId, 'pairDevice')]]">
-          <div id="pairing" class="settings-box first layout vertical center
-              center-justified">
-            <div class="dialog-message">
-              [[getMessage_(pairingDevice, pairingEvent)]]
-            </div>
-            <div hidden$="[[!showEnterPincode_(pairingEvent)]]">
-              <paper-input id="pincode" minlength="1" maxlength="16"
-                  type="text" auto-validate value="{{pinOrPass}}">
-              </paper-input>
-            </div>
-            <div hidden$="[[!showEnterPasskey_(pairingEvent)]]">
-              <paper-input id="passkey" minlength="6" maxlength="6" type="text"
-                  auto-validate value="{{pinOrPass}}"></paper-input>
+        <div class="contents layout vertical center center-justified">
+          <template is="dom-if" if="[[isDialogType_(dialogId, 'addDevice')]]">
+            <div id="dialogDeviceList"
+                class="layout vertical flex start self-stretch"
+                on-device-event="onDeviceEvent_">
+              <span class="no-devices" hidden$="[[haveDevices_(deviceList)]]">
+                $i18n{bluetoothNoDevices}
+              </span>
+              <iron-selector class="flex">
+                <template is="dom-repeat" items="[[deviceList]]"
+                    filter="deviceNotPaired_" observe="paired">
+                  <bluetooth-device-list-item device="[[item]]">
+                  </bluetooth-device-list-item>
+                </template>
+              </iron-selector>
             </div>
-            <div id="pinDiv" class="layout horizontal center center-justified"
-                hidden="[[!showDisplayPassOrPin_(pairingEvent)]]">
-              <template is="dom-repeat" items="[[digits]]">
-                <span class$="[[getPinClass_(pairingEvent, index)]]">
-                  [[getPinDigit_(pairingEvent, index)]]
+          </template>
+          <template is="dom-if" if="[[isDialogType_(dialogId, 'pairDevice')]]">
+            <div id="pairing" class="settings-box first layout vertical center
+                center-justified">
+              <div class="dialog-message">
+                [[getMessage_(pairingDevice, pairingEvent)]]
+              </div>
+              <div hidden$="[[!showEnterPincode_(pairingEvent)]]">
+                <paper-input id="pincode" minlength="1" maxlength="16"
+                    type="text" auto-validate value="{{pinOrPass}}">
+                </paper-input>
+              </div>
+              <div hidden$="[[!showEnterPasskey_(pairingEvent)]]">
+                <paper-input id="passkey" minlength="6" maxlength="6"
+                    type="text" auto-validate value="{{pinOrPass}}">
+                </paper-input>
+              </div>
+              <div id="pinDiv" class="layout horizontal center center-justified"
+                  hidden="[[!showDisplayPassOrPin_(pairingEvent)]]">
+                <template is="dom-repeat" items="[[digits]]">
+                  <span class$="[[getPinClass_(pairingEvent, index)]]">
+                    [[getPinDigit_(pairingEvent, index)]]
+                  </span>
+                </template>
+                <span class$="[[getPinClass_(pairingEvent, -1)]]"
+                    hidden="[[showAcceptReject_(pairingEvent)]]">
+                  $i18n{bluetoothEnterKey}
                 </span>
-              </template>
-              <span class$="[[getPinClass_(pairingEvent, -1)]]"
-                  hidden="[[showAcceptReject_(pairingEvent)]]">
-                $i18n{bluetoothEnterKey}
-              </span>
+              </div>
             </div>
-          </div>
-        </template>
-        <template is="dom-if" if="[[isDialogType_(dialogId, 'connectError')]]">
-          <div class="settings-box first layout vertical center
-              center-justified">
-            <div class="dialog-message">[[errorMessage]]</div>
-          </div>
-        </template>
+          </template>
+          <template is="dom-if" if="[[isDialogType_(dialogId, 'connectError')]]">
+            <div class="settings-box first layout vertical center
+                center-justified">
+              <div class="dialog-message">[[errorMessage]]</div>
+            </div>
+          </template>
+        </div>
       </div>
       <div class="button-container">
         <template is="dom-if" if="[[isDialogType_(dialogId, 'addDevice')]]">