chrome/browser/resources/settings/internet_page/network_summary_item.html

<link rel="import" href="chrome://resources/html/polymer.html">

<link rel="import" href="chrome://resources/cr_components/chromeos/network/network_siminfo.html">
<link rel="import" href="chrome://resources/cr_elements/chromeos/network/cr_network_icon.html">
<link rel="import" href="chrome://resources/cr_elements/policy/cr_policy_indicator.html">
<link rel="import" href="chrome://resources/html/i18n_behavior.html">
<link rel="import" href="chrome://resources/polymer/v1_0/iron-collapse/iron-collapse.html">
<link rel="import" href="chrome://resources/polymer/v1_0/paper-icon-button/paper-icon-button-light.html">
<link rel="import" href="chrome://resources/polymer/v1_0/paper-toggle-button/paper-toggle-button.html">
<link rel="import" href="../settings_page/settings_subpage.html">
<link rel="import" href="../settings_shared_css.html">

<dom-module id="network-summary-item">
  <template>
    <style include="internet-shared">
      network-siminfo {
        padding: 0 var(--settings-box-row-padding);
      }

      #details {
        align-items: center;
        display: flex;
        flex: auto;
      }

      #networkName {
        color: #333;
        font-weight: 500;
      }

      #networkState {
        color: var(--paper-grey-600);
        font-size: inherit;
        font-weight: 400;
      }
    </style>
    <div actionable class="settings-box two-line" on-tap="onShowDetailsTap_">
      <div id="details" no-flex$="[[showSimInfo_(deviceState)]]">
        <cr-network-icon network-state="[[activeNetworkState]]"
            device-state="[[deviceState]]">
        </cr-network-icon>
        <div class="flex">
          <div id="networkName">[[getNetworkName_(activeNetworkState)]]</div>
          <div id="networkState">
            [[getNetworkStateText_(activeNetworkState, deviceState)]]
          </div>
        </div>
      </div>

      <template is="dom-if" if="[[showSimInfo_(deviceState)]]" restamp>
        <network-siminfo editable on-tap="doNothing_"
            network-properties="[[getCellularState_(deviceState)]]"
            networking-private="[[networkingPrivate]]">
        </network-siminfo>
      </template>

      <template is="dom-if" if="[[showPolicyIndicator_(activeNetworkState)]]">
        <cr-policy-indicator indicator-type="[[getIndicatorTypeForSource(
            activeNetworkState.Source)]]"
            on-tap="doNothing_">
        </cr-policy-indicator>
      </template>

      <template is="dom-if" if="[[showDetailsIsVisible_(activeNetworkState,
          deviceState, networkStateList)]]">
        <button class="subpage-arrow" is="paper-icon-button-light"
            aria-label$="[[getDetailsA11yString_(activeNetworkState,
                deviceState, networkStateList)]]">
        </button>
      </template>

      <template is="dom-if" if="[[enableToggleIsVisible_(deviceState)]]">
        <div class="separator"></div>
        <paper-toggle-button  id="deviceEnabledButton"
            aria-label$="[[getToggleA11yString_(deviceState)]]"
            checked="[[deviceIsEnabled_(deviceState)]]"
            disabled="[[!enableToggleIsEnabled_(deviceState)]]"
            on-tap="onDeviceEnabledTap_">
        </paper-toggle-button>
      </template>
    </div>
  </template>
  <script src="network_summary_item.js"></script>
</dom-module>