Add support for custom entries in <cr_network_select/>.

ui/webui/resources/cr_elements/network/cr_network_list_network_item.html

Index: ui/webui/resources/cr_elements/network/cr_network_list_network_item.html
diff --git a/ui/webui/resources/cr_elements/network/cr_network_list_item.html b/ui/webui/resources/cr_elements/network/cr_network_list_network_item.html
similarity index 47%
rename from ui/webui/resources/cr_elements/network/cr_network_list_item.html
rename to ui/webui/resources/cr_elements/network/cr_network_list_network_item.html
index 23fca1359d95e54dc59f6b526036d9360484e201..77861ca37237d8795836f4c36a7830ae81c3f94a 100644
--- a/ui/webui/resources/cr_elements/network/cr_network_list_item.html
+++ b/ui/webui/resources/cr_elements/network/cr_network_list_network_item.html
@@ -4,108 +4,29 @@
 <link rel="import" href="chrome://resources/polymer/v1_0/paper-icon-button/paper-icon-button.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/network/cr_network_list_item_css.html">
 
-<dom-module id="cr-network-list-item">
+<dom-module id="cr-network-list-network-item">
   <template>
-    <style>
-      :host {
-        display: inline-block;
-      }
-
-      span {
-        cursor: pointer;
-      }
-
-      #divOuter {
-        border-style: none;
-        display: flex;
-        flex-direction: row;
-        margin: 0;
-        padding: 4px;
-      }
-
-      #divOuter[is-list-item]:hover {
-        background-color: lightgrey;
-      }
-
-      #divIcon {
-        display: flex;
-        flex: 0 0 auto;
-        flex-direction: column;
-        justify-content: center;
-      }
-
-      #icon {
-        height: 32px;
-        width: 32px;
-
-        @apply(--cr-network-icon-mixin);
-      }
-
-      #divDetail {
-        display: flex;
-        flex: 1 0 auto;
-        flex-direction: row;
-      }
-
-      #divText {
-        display: flex;
-        flex: 1 0 auto;
-        flex-direction: column;
-        justify-content: center;
-      }
-
-      #networkName {
-        -webkit-margin-start: 8px;
-        font-size: 16px;
-
-        @apply(--cr-network-name-mixin);
-      }
-
-      #networkStateText {
-        -webkit-margin-start: 8px;
-        color: grey;
-        font-size: 14px;
-
-        @apply(--cr-network-state-mixin);
-      }
-
-      .buttons {
-        align-items: center;
-        display: flex;
-        flex-direction: row;
-      }
-
-      .buttons paper-icon-button {
-        text-align: center;
-      }
-
-      .known paper-icon-button {
-        width: 60px;
-      }
-
-      .connected {
-        font-weight: bold;
-      }
-    </style>
-    <div id="divOuter" is-list-item$="[[isListItem_(listItemType)]]">
+    <style include="cr-network-list-item-css"></style>
+    <div id="divOuter" hoverable$="[[isListItem_(listItemType)]]">
       <div id="divIcon">
         <cr-network-icon id="icon" is-list-item="[[isListItem_(listItemType)]]"
             network-state="[[networkState]]">
         </cr-network-icon>
       </div>
       <div id="divText" class="layout horizontal flex">
-        <span id="networkName"></span>
+        <span id="itemName"></span>
         <span id="networkStateText" hidden$="[[isListItem_(listItemType)]]">
         </span>
       </div>
       <div class="buttons"
-          hidden$="[[!isListItemType_(listItemType, 'visible')]]">
+          hidden$="[[!isSettingsButtonVisible_(showButtons,listItemType)]]">
         <paper-icon-button icon="cr:settings" on-tap="fireShowDetails_">
         </paper-icon-button>
       </div>
       <div class="known buttons"
-          hidden$="[[!isListItemType_(listItemType, 'known')]]">
+          hidden$="[[!areKnownButtonsVisible_(showButtons,listItemType)]]">
         <paper-icon-button icon="[[sharedIcon_(networkState)]]" disabled>
         </paper-icon-button>
         <paper-icon-button icon="[[preferredIcon_(networkState)]]"
@@ -119,5 +40,5 @@
       </div>
     </div>
   </template>
-  <script src="cr_network_list_item.js"></script>
+  <script src="cr_network_list_network_item.js"></script>
 </dom-module>