MD Settings: change most checkboxes to toggles (leave dialogs alone)

chrome/browser/resources/settings/internet_page/network_siminfo.html

 <link rel="import" href="chrome://resources/cr_elements/cr_dialog/cr_dialog.html">
 <link rel="import" href="chrome://resources/cr_elements/network/cr_onc_types.html">
 <link rel="import" href="chrome://resources/html/polymer.html">
 <link rel="import" href="chrome://resources/polymer/v1_0/iron-icon/iron-icon.html">
 <link rel="import" href="chrome://resources/polymer/v1_0/paper-button/paper-button.html">
-<link rel="import" href="chrome://resources/polymer/v1_0/paper-checkbox/paper-checkbox.html">
 <link rel="import" href="chrome://resources/polymer/v1_0/paper-input/paper-input.html">
+<link rel="import" href="chrome://resources/polymer/v1_0/paper-toggle-button/paper-toggle-button.html">
 <link rel="import" href="/icons.html">
 <link rel="import" href="internet_shared_css.html">
 
 <dom-module id="network-siminfo">
   <template>
-    <style include="internet-shared">
+    <style include="settings-shared internet-shared">
       iron-icon {
        -webkit-margin-end: 10px;
       }
 
       .dialog-error {
         color: red;
         font-size: 125%;
         font-weight: 500;
         margin-top: 10px;
       }
@@ skipping 12 matching lines @@
       }
 
       /* Siminfo is embedded; remove the padding. */
       .settings-box {
         padding: 0;
       }
 
       .settings-box:first-of-type {
         border-top: none;
       }
+
+      paper-toggle-button {
+        -webkit-margin-start: var(--checkbox-spacing);
+      }
     </style>
 
     <!-- SIM missing UI -->
     <div class="settings-box two-line"
         hidden$="[[networkProperties.Cellular.SIMPresent]]">
       <div class="start layout horizontal center">
         <iron-icon icon="settings:sim-card-alert"></iron-icon>
         <div class="error">$i18n{networkSimCardMissing}</div>
       </div>
     </div>
 
     <!-- SIM locked -->
     <div class="settings-box two-line"
         hidden$="[[!showSimLocked_(networkProperties)]]">
       <div class="start layout horizontal center">
         <iron-icon icon="settings:lock"></iron-icon>
         <div class="error">$i18n{networkSimCardLocked}</div>
       </div>
       <div class="secondary-action">
         <paper-button on-tap="onUnlockPinTap_">
           $i18n{networkSimUnlock}
         </paper-button>
       </div>
     </div>
 
     <!-- SIM unlocked -->
     <div class="settings-box two-line"
         hidden$="[[!showSimUnlocked_(networkProperties)]]">
-      <paper-checkbox class="start" on-change="onSimLockEnabledChange_"
-          checked="[[networkProperties.Cellular.SIMLockStatus.LockEnabled]]">
-        $i18n{networkSimLockEnable}
-      </paper-checkbox>
-      <paper-button  on-tap="onChangePinTap_"
+      <div class="start">$i18n{networkSimLockEnable}</div>
+      <paper-button on-tap="onChangePinTap_"
           hidden$="[[!networkProperties.Cellular.SIMLockStatus.LockEnabled]]">
         $i18n{networkSimChangePin}
       </paper-button>
+      <paper-toggle-button on-change="onSimLockEnabledChange_"
+          checked="[[networkProperties.Cellular.SIMLockStatus.LockEnabled]]">
+      </paper-toggle-button>
     </div>
 
     <!-- Enter PIN dialog -->
     <dialog is="cr-dialog" id="enterPinDialog">
       <div class="title">$i18n{networkSimEnterPinTitle}</div>
       <div class="body">
         <paper-input id="enterPin" class="pin" no-label-float
             label="$i18n{networkSimEnterPin}">
         </paper-input>
         <div class="dialog-error">
@@ skipping 74 matching lines @@
       </div>
       <div class="button-container">
         <paper-button on-tap="sendUnlockPuk_">
           $i18n{networkSimUnlock}
         </paper-button>
       </div>
     </dialog>
   </template>
   <script src="network_siminfo.js"></script>
 </dom-module>