[MD settings] fix layout in startup urls and search engines iron-lists

chrome/browser/resources/settings/search_engines_page/search_engines_list.html

Index: chrome/browser/resources/settings/search_engines_page/search_engines_list.html
diff --git a/chrome/browser/resources/settings/search_engines_page/search_engines_list.html b/chrome/browser/resources/settings/search_engines_page/search_engines_list.html
index 99da789e320ede98d40643d7f8ecd7342c17c59e..27fc37c39d869a28d16283356ea6fb0c04169f74 100644
--- a/chrome/browser/resources/settings/search_engines_page/search_engines_list.html
+++ b/chrome/browser/resources/settings/search_engines_page/search_engines_list.html
@@ -9,8 +9,10 @@
   <template>
     <style include="settings-shared">
       #headers {
+        @apply(--settings-list-frame-padding);
         display: flex;
-        padding: 10px 0;
+        padding-bottom: 10px;
+        padding-top: 10px;
       }
 
       #headers .name,
@@ -22,15 +24,11 @@
         flex: 4;
       }
 
-      #outer {
+      #container {
         @apply(--settings-list-frame-padding);
       }
 
-      /* TODO(dbeam): this rule results in incorrectly showing a top border for
-       * "Other Search Engines", which hides the headers while still adding a
-       * dividing line (even though there's no content above the other engines
-       * to actually divide). */
-      settings-search-engine-entry {
+      settings-search-engine-entry:not([is-first]) {
         border-top: var(--settings-separator-line);
       }
 
@@ -45,26 +43,24 @@
         width: calc(var(--iron-icon-width) + 2 * 10px);
       }
     </style>
-    <div id="outer">
-      <div id="headers" class="column-header" hidden$="[[hideHeaders]]">
-        <div class="name">$i18n{searchEnginesSearchEngine}</div>
-        <div class="keyword">$i18n{searchEnginesKeyword}</div>
-        <div class="url">$i18n{searchEnginesQueryURL}</div>
-        <div class="icon-placeholder"></div>
-      </div>
-      <div id="container"
-          class$="scroll-container [[getHeightClass(scrollTarget)]]"
-          scrollable$="[[isScrollable(scrollTarget)]]">
-        <iron-list items="[[engines]]" scroll-target="[[scrollTarget]]"
-            scroll-offset="[[scrollOffset]]">
-          <template>
-            <settings-search-engine-entry engine="[[item]]"
-                tabindex$="[[tabIndex]]" iron-list-tab-index="[[tabIndex]]"
-                last-focused="{{lastFocused_}}">
-            </settings-search-engine-entry>
-          </template>
-        </iron-list>
-      </div>
+    <div id="headers" class="column-header" hidden$="[[hideHeaders]]">
+      <div class="name">$i18n{searchEnginesSearchEngine}</div>
+      <div class="keyword">$i18n{searchEnginesKeyword}</div>
+      <div class="url">$i18n{searchEnginesQueryURL}</div>
+      <div class="icon-placeholder"></div>
+    </div>
+    <div id="container"
+        class$="scroll-container [[getHeightClass(scrollTarget)]]"
+        scrollable$="[[isScrollable(scrollTarget)]]">
+      <iron-list items="[[engines]]" scroll-target="[[scrollTarget]]"
+          scroll-offset="[[scrollOffset]]">
+        <template>
+          <settings-search-engine-entry engine="[[item]]"
+              tabindex$="[[tabIndex]]" iron-list-tab-index="[[tabIndex]]"
+              is-first$="[[!index]]" last-focused="{{lastFocused_}}">
+          </settings-search-engine-entry>
+        </template>
+      </iron-list>
     </div>
   </template>
   <script src="search_engines_list.js"></script>