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

<link rel="import" href="chrome://resources/html/polymer.html">
<link rel="import" href="chrome://resources/cr_elements/icons.html">
<link rel="import" href="chrome://resources/polymer/v1_0/paper-icon-button/paper-icon-button.html">
<link rel="import" href="chrome://resources/html/web_ui_listener_behavior.html">
<link rel="import" href="../i18n_setup.html">
<link rel="import" href="../settings_shared_css.html">
<link rel="import" href="site_settings_behavior.html">
<link rel="import" href="site_settings_prefs_browser_proxy.html">

<dom-module id="zoom-levels">
  <template>
    <style include="settings-shared">
      :host {
        display: block;
      }

      .zoom-label {
        -webkit-margin-end: 16px;
      }

      .empty-message {
        margin-top: 15px;
      }
    </style>
    <div class="list-frame vertical-list" id="listContainer">
      <template is="dom-repeat" items="[[sites_]]" id="list"
          rendered-item-count="{{renderedCount}}">
        <div class="list-item">
          <div class="favicon-image"
              style$="[[computeSiteIcon(item.originForFavicon)]]">
          </div>
          <div class="middle">
            <div>[[item.displayName]]</div>
          </div>
          <div class="zoom-label">[[item.zoom]]</div>
          <div>
            <paper-icon-button icon="cr:clear"
                on-tap="removeZoomLevel_">
          </div>
        </div>
      </template>
      <template is="dom-if" if="{{!renderedCount}}">
        <div class="empty-message" id="empty">
          $i18n{siteSettingsNoZoomedSites}
        </div>
      </template>
    </div>
  </template>
  <script src="zoom_levels.js"></script>
</dom-module>