Site Settings Desktop: Implement media picker for camera/mic categories.

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

 <link rel="import" href="chrome://resources/html/polymer.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-item/paper-icon-item.html">
 <link rel="import" href="chrome://resources/polymer/v1_0/paper-item/paper-item-body.html">
 <link rel="import" href="chrome://resources/polymer/v1_0/paper-toggle-button/paper-toggle-button.html">
 <link rel="import" href="chrome://resources/html/web_ui_listener_behavior.html">
 <link rel="import" href="/settings_shared_css.html">
 <link rel="import" href="/site_settings/add_site_dialog.html">
 <link rel="import" href="/site_settings/constants.html">
 <link rel="import" href="/site_settings/site_details.html">
@@ skipping 25 matching lines @@
       }
 
       .button-container {
         -webkit-margin-start: 18px;
       }
 
       paper-toggle-button {
         --paper-toggle-button-label-spacing: 0;
       }
     </style>
+    <content select=".media-picker"></content>
+
     <div class="settings-box first two-line">
       <div class="start secondary">
         [[computeCategoryDesc(category, categoryEnabled, showRecommendation)]]
       </div>
       <paper-toggle-button id="toggle" checked="{{categoryEnabled}}"
           on-change="onToggleChange_"></paper-toggle-button>
     </div>
 
     <div id="cookieControls" hidden>
       <div class="settings-box">
@@ skipping 17 matching lines @@
         category-enabled="[[categoryEnabled]]"
         selected-site="{{selectedSite}}">
     </settings-site-list>
     <div class="button-container">
       <paper-button on-tap="onAddSiteTap_" class="primary-button"
           hidden$="[[categoryEnabled]]">$i18n{addSiteLink}</paper-button>
     </div>
   </template>
   <script src="site_settings_category.js"></script>
 </dom-module>