MD Settings: Fix search highlighting within extension-controlled-indicator.

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

 <link rel="import" href="chrome://resources/html/polymer.html">
 
 <link rel="import" href="chrome://resources/html/i18n_behavior.html">
 <link rel="import" href="chrome://resources/polymer/v1_0/paper-button/paper-button.html">
 <link rel="import" href="../extension_control_browser_proxy.html">
 <link rel="import" href="../i18n_setup.html">
 <link rel="import" href="../settings_shared_css.html">
 
 <dom-module id="extension-controlled-indicator">
   <template>
     <style include="settings-shared">
       :host {
         -webkit-margin-start: 36px;
         align-items: center;
         display: flex;
         min-height: var(--settings-row-min-height);
       }
 
       img {
         @apply(--cr-icon-height-width);
         -webkit-margin-end: 16px;
       }
 
-      span {
+      /* Using ">" operator to ensure that this CSS rule will not accidentally
+         be applied to a search highlight span (which is inserted dynamically if
+         when search "hit" occurs within this element. */

[dschuyler, 2017/06/07 23:33:06]

Nit: It seems common to start comment lines with 
 * 
after the first line. I don't recall it specifically mentioned in the style
guide, so it's up to you.

[dpapad, 2017/06/08 00:03:59]

Done.

+      :host > span {
         -webkit-margin-end: 8px;
         flex: 1;
       }
     </style>
     <img role="presentation" src="chrome://extension-icon/[[extensionId]]/40/1">
     <span inner-h-t-m-l="[[getLabel_(extensionId, extensionName)]]"></span>
     <template is="dom-if" if="[[extensionCanBeDisabled]]" restamp>
       <paper-button class="secondary-button" on-tap="onDisableTap_">
         $i18n{disable}
       </paper-button>
     </template>
   </template>
 </dom-module>
 
 <script src="extension_controlled_indicator.js"></script>