Settings: Internet page cleanup

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

 <link rel="import" href="chrome://resources/cr_elements/cr_expand_button/cr_expand_button.html">
 <link rel="import" href="chrome://resources/cr_elements/icons.html">
 <link rel="import" href="chrome://resources/cr_elements/network/cr_network_icon.html">
 <link rel="import" href="chrome://resources/cr_elements/network/cr_onc_types.html">
 <link rel="import" href="chrome://resources/cr_elements/policy/cr_policy_indicator.html">
 <link rel="import" href="chrome://resources/cr_elements/policy/cr_policy_network_behavior.html">
 <link rel="import" href="chrome://resources/cr_elements/policy/cr_policy_network_indicator.html">
 <link rel="import" href="chrome://resources/html/i18n_behavior.html">
 <link rel="import" href="chrome://resources/html/polymer.html">
 <link rel="import" href="chrome://resources/polymer/v1_0/iron-collapse/iron-collapse.html">
@@ skipping 13 matching lines @@
 <link rel="import" href="network_siminfo.html">
 <link rel="import" href="tether_connection_dialog.html">
 
 <dom-module id="settings-internet-detail-page">
   <template>
     <style include="internet-shared iron-flex">
       :host {
         padding-bottom: 40px;
       }
 
-      cr-network-icon {
-        -webkit-padding-end: 8px;
-      }
-
       iron-collapse {
         margin: 10px 0;
       }
 
       iron-icon {
         -webkit-margin-end: 10px;
       }
 
       paper-toggle-button {
         -webkit-margin-start: var(--settings-control-label-spacing);
       }
 
       cr-policy-network-indicator,
       cr-policy-indicator {
         -webkit-margin-start: var(--settings-controlled-by-spacing);
       }
 
       .indented {
         -webkit-margin-start: var(--settings-box-row-padding);
       }
 
       .settings-box.stretch {
         align-items: stretch;
       }
 
       .settings-box:first-of-type {
         border-top: none;
       }
 
-      #buttonDiv paper-button {
-        /* Align text edge with trailing margin (12px button padding) */
-        -webkit-margin-end: -12px;
-        /* 8px spacing between highlight edges. */
-        -webkit-margin-start: calc(12px + 8px);
-        margin-bottom: 10px;
-        margin-top: 10px;
-      }
-
       #networkState {
-        -webkit-padding-start: 8px;
         font-size: 107.69%;  /* 14px / 13px */
         font-weight: 500;
       }
 
       #networkState[connected] {
         color: var(--google-green-500);
       }
     </style>
     <!-- Title section: Icon + name + connection state. -->
     <div class="settings-box first">
       <div class="start layout horizontal center">
         <cr-network-icon network-state="[[networkProperties]]">
         </cr-network-icon>
         <div id="networkState"
             connected$="[[isConnectedState_(networkProperties)]]">
           [[getStateText_(networkProperties)]]
         </div>
         <template is="dom-if"
             if="[[isPolicySource(networkProperties.Source))]]">
           <cr-policy-indicator
               indicator-type="[[getIndicatorTypeForSource(
                   networkProperties.Source)]]">
           </cr-policy-indicator>
         </template>
       </div>
-      <div id="buttonDiv" class="layout horizontal center">
+      <div id="buttonDiv" class="button-container">
         <template is="dom-if" if="[[!isSecondaryUser_]]">
           <paper-button class="secondary-button" on-tap="onForgetTap_"
               hidden$="[[!showForget_(networkProperties)]]">
             $i18n{networkButtonForget}
           </paper-button>
           <paper-button class="secondary-button" on-tap="onViewAccountTap_"
               hidden$="[[!showViewAccount_(networkProperties)]]">
             $i18n{networkButtonViewAccount}
           </paper-button>
           <paper-button class="secondary-button" on-tap="onActivateTap_"
@@ skipping 67 matching lines @@
                 property="[[getManagedAutoConnect_(networkProperties)]]">
             </cr-policy-network-indicator>
             <paper-toggle-button checked="{{autoConnect_}}"
                 disabled="[[!enableAutoConnect_(networkProperties,
                           globalPolicy)]]"
                 aria-labelledby="autoConnectToggleLabel">
             </paper-toggle-button>
           </div>
         </template>
         <!-- Data roaming (Cellular only). -->
-        <template is="dom-if"
-            if="[[isType_(NetworkType_.CELLULAR, networkProperties)]]">
+        <template is="dom-if" if="[[isCellular_(networkProperties)]]">
           <div class="settings-box">
             <settings-toggle-button id="allowDataRoaming" class="start"
                 pref="{{prefs.cros.signed.data_roaming_enabled}}"
                 label="$i18n{networkAllowDataRoaming}">
             </settings-toggle-button>
           </div>
         </template>
         <!-- SIM Info (Cellular only). -->
         <template is="dom-if" if="[[showCellularSim_(networkProperties)]]">
           <div class="settings-box single-column stretch">
@@ skipping 58 matching lines @@
         <div class="settings-box" actionable on-tap="toggleNetworkExpanded_">
           <div class="start">$i18n{networkSectionNetwork}</div>
           <cr-expand-button expanded="{{networkExpanded_}}"
               alt="$i18n{networkSectionNetworkExpandA11yLabel}">
           </cr-expand-button>
         </div>
 
         <iron-collapse opened="[[networkExpanded_]]">
           <div class="layout vertical indented">
             <!-- APN -->
-            <template is="dom-if"
-                if="[[isType_(NetworkType_.CELLULAR, networkProperties)]]">
+            <template is="dom-if" if="[[isCellular_(networkProperties)]]">
               <network-apnlist editable on-apn-change="onNetworkPropertyChange_"
                   network-properties="[[networkProperties]]">
               </network-apnlist>
             </template>
 
             <!-- IP Config, Nameservers -->
             <template is="dom-if"
                 if="[[isRememberedOrConnected_(networkProperties)]]">
               <network-ip-config editable on-ip-change="onIPConfigChange_"
                   network-properties="[[networkProperties]]">
               </network-ip-config>
               <network-nameservers editable
                   on-nameservers-change="onIPConfigChange_"
                   network-properties="[[networkProperties]]">
               </network-nameservers>
             </template>
           </div>
         </iron-collapse>
 
         <!-- Proxy toggle -->
         <div class="settings-box" actionable on-tap="toggleProxyExpanded_">
           <div class="start">$i18n{networkSectionProxy}</div>
           <cr-expand-button expanded="{{proxyExpanded_}}"
               alt="$i18n{networkSectionProxyExpandA11yLabel}">
           </cr-expand-button>
         </div>
 
         <iron-collapse opened="[[proxyExpanded_]]">
-          <network-proxy editable prefs="{{prefs}}"
-              on-proxy-change="onProxyChange_"
-              network-properties="[[networkProperties]]">
-          </network-proxy>
+          <div class="layout vertical indented">
+            <network-proxy editable prefs="{{prefs}}"
+                on-proxy-change="onProxyChange_"
+                network-properties="[[networkProperties]]">
+            </network-proxy>
+          </div>
         </iron-collapse>
       </template>
     </template>
 
     <tether-connection-dialog id="tetherDialog"
         network-properties="[[networkProperties]]"
         on-tether-connect="onTetherConnect_"
         on-close="onTetherDialogClose_">
     </tether-connection-dialog>
   </template>
   <script src="internet_detail_page.js"></script>
 </dom-module>