MD Settings: Fix styles in several places.

- Some buttons were missing the "secondary-button"/"cancel-button" class.
- removing rule-lines
- remove unnecessary controls

BUG=684152
CQ_INCLUDE_TRYBOTS=master.tryserver.chromium.linux:closure_compilation

Review-Url: https://codereview.chromium.org/2668163002
Cr-Commit-Position: refs/heads/master@{#447923}

chrome/browser/resources/settings/controls/settings_toggle_button.html

@@ -41,7 +41,6 @@
           actionable$="[[!controlDisabled_(disabled, pref)]]">
         <div class="label">
           [[label]]
-          <content select=".label-controls"></content>
         </div>
         <div class="secondary label">[[subLabel]]</div>
       </div>

chrome/browser/resources/settings/languages_page/edit_dictionary_page.html

@@ -42,11 +42,11 @@
         <paper-input id="newWord" no-label-float
             label="$i18n{addDictionaryWordLabel}"></paper-input>
       </div>
-      <paper-button on-tap="onAddWordTap_">
+      <paper-button class="secondary-button" on-tap="onAddWordTap_">
         $i18n{addDictionaryWordButton}
       </paper-button>
     </div>
-    <div class="settings-box block">
+    <div class="settings-box continuation block">
       <h2>$i18n{customDictionaryWords}</h2>
       <div class="list-frame">
         <iron-list id="list" items="{{words_}}">

chrome/browser/resources/settings/on_startup_page/startup_urls_page.html

@@ -28,7 +28,7 @@
         cursor: default;
       }
     </style>
-    <div id="outer" class="layout vertical flex">
+    <div id="outer" class="layout vertical flex vertical-list">
       <div id="container" class="scroll-container flex" scrollable>
         <iron-list items="[[startupPages_]]" scroll-target="container">
           <template>

chrome/browser/resources/settings/passwords_and_forms_page/address_edit_dialog.html

@@ -109,7 +109,8 @@
         </div>
       </div>
       <div class="button-container">
-        <paper-button id="cancelButton" on-tap="onCancelTap_">
+        <paper-button id="cancelButton" class="cancel-button"
+            on-tap="onCancelTap_">
           $i18n{cancel}
         </paper-button>
         <paper-button id="saveButton" class="action-button"

chrome/browser/resources/settings/passwords_and_forms_page/password_edit_dialog.html

@@ -19,7 +19,7 @@
       }
 
       paper-icon-button {
-        --iron-icon-fill-color: var(--paper-grey-800);
+        --iron-icon-fill-color: var(--paper-grey-600);
       }
     </style>
     <dialog is="cr-dialog" id="dialog">
@@ -43,7 +43,7 @@
         </div>
       </div>
       <div class="button-container">
-        <paper-button id="cancelButton"
+        <paper-button id="cancelButton" class="cancel-button"
             on-tap="onCancelButtonTap_">$i18n{passwordsDone}</paper-button>
       </div>
     </dialog>

chrome/browser/resources/settings/passwords_and_forms_page/passwords_section.html

@@ -126,23 +126,21 @@
     <div class="settings-box block first">
       <h2>$i18n{passwordExceptionsHeading}</h2>
     </div>
-    <div class="list-frame vertical-list">
-      <span id="passwordExceptionsList">
-        <template is="dom-repeat" items="[[passwordExceptions]]"
-            filter="[[passwordExceptionFilter_(filter)]]">
-          <div class="list-item two-line">
-            <div class="start">
-              <a id="exception" href="[[item.linkUrl]]" target="_blank"
-                  class="selectable">[[item.exceptionUrl]]</a>
-            </div>
-            <paper-icon-button id="removeExceptionButton"
-                icon="cr:close" on-tap="onRemoveExceptionButtonTap_"
-                tabindex$="[[tabIndex]]"
-                alt="$i18n{deletePasswordException}">
-            </paper-icon-button>
+    <div class="list-frame vertical-list" id="passwordExceptionsList">
+      <template is="dom-repeat" items="[[passwordExceptions]]"
+          filter="[[passwordExceptionFilter_(filter)]]">
+        <div class="list-item">
+          <div class="start">
+            <a id="exception" href="[[item.linkUrl]]" target="_blank"
+                class="selectable">[[item.exceptionUrl]]</a>
           </div>
-        </template>
-      </span>
+          <paper-icon-button id="removeExceptionButton"
+              icon="cr:close" on-tap="onRemoveExceptionButtonTap_"
+              tabindex$="[[tabIndex]]"
+              alt="$i18n{deletePasswordException}">
+          </paper-icon-button>
+        </div>
+      </template>
       <div id="noExceptionsLabel" class="list-item"
           hidden$="[[hasSome_(passwordExceptions)]]">
         $i18n{noExceptionsFound}

chrome/browser/resources/settings/search_page/search_page.html

@@ -83,10 +83,6 @@
                 sub-label="[[getHotwordSearchEnableSubLabel_(
                            hotwordInfo_.alwaysOn)]]"
                 on-change="onHotwordSearchEnableChange_">
-              <a href="$i18nRaw{hotwordLearnMoreUrl}" target="_blank"
-                  class="label-controls" on-tap="doNothing_">
-                $i18n{searchOkGoogleLearnMore}
-              </a>
             </settings-toggle-button>
             <div class="secondary-action"
                 hidden$="[[!getShowHotwordSearchRetrain_(hotwordInfo_.*)]]">

chrome/browser/resources/settings/site_settings/media_picker.html

@@ -10,7 +10,7 @@
         display: block;
       }
     </style>
-    <div class="settings-box" id="picker" hidden>
+    <div class="settings-box first" id="picker" hidden>
       <div class="md-select-wrapper">
         <select id="mediaPicker" class="md-select" on-change="onChange_">
           <template is="dom-repeat" items="[[devices]]">

chrome/test/data/webui/settings/settings_passwords_section_browsertest.js

@@ -92,10 +92,8 @@ SettingsPasswordSectionBrowserTest.prototype = {
    * @private
    */
   getDomRepeatChildren_: function(element) {
-    var template = element.children[element.children.length - 1];
-    assertEquals('TEMPLATE', template.tagName);
-    // The template is at the end of the list of children and should be skipped.
-    return Array.prototype.slice.call(element.children, 0, -1);
+    var nodes = element.querySelectorAll('.list-item:not([id])');
+    return nodes;
   },
 
   /**