chrome/browser/resources/md_extensions/error_page.html

<link rel="import" href="chrome://resources/html/cr.html">
<link rel="import" href="chrome://resources/html/polymer.html">
<link rel="import" href="chrome://resources/polymer/v1_0/iron-icons/iron-icons.html">
<link rel="import" href="chrome://resources/polymer/v1_0/iron-list/iron-list.html">
<link rel="import" href="chrome://resources/polymer/v1_0/neon-animation/neon-animatable-behavior.html">
<link rel="import" href="chrome://resources/polymer/v1_0/paper-icon-button/paper-icon-button.html">
<link rel="import" href="chrome://resources/polymer/v1_0/paper-styles/color.html">
<link rel="import" href="chrome://extensions/animation_helper.html">
<link rel="import" href="chrome://extensions/code_section.html">

<dom-module id="extensions-error-page">
  <template>
    <style>
      [hidden] {
        display: none !important;
      }

      #main {
        background-color: white;
        height: 800px;
        width: 90%;
      }

      #heading {
        color: var(--paper-grey-600);
        height: 40px;
        margin-bottom: 30px;
        padding: 8px 12px 0;
      }

      #errors-list {
        min-height: 100px;
        padding: 0 10px;
      }

      .error-item {
        align-items: center;
        color: var(--paper-grey-800);
        display: flex;
        margin: 5px 0;
      }

      .error-item.selected {
        background-color: #ccc;
      }

      .error-message {
        -webkit-margin-start: 10px;
        flex-grow: 1;
      }

      .icon-severity-info {
        /* TODO(devlin): 1x/2x versions? */
        content: url(error_severity_info.png);
      }

      .icon-severity-warning {
        content: url(error_severity_warning.png);
      }

      .icon-severity-fatal {
        content: url(error_severity_fatal.png);
      }
    </style>
    <div id="main">
      <div id="heading">
        <paper-icon-button id="close-button" icon="arrow-back"
            on-tap="onCloseButtonTap_"></paper-icon-button>
        <span>$i18n{errorsPageHeading}</span>
      </div>
      <iron-list id="errors-list" items="[[calculateShownItems_(data.*)]]">
        <template>
          <div class$="[[computeErrorClass_(selectedError_, item)]]"
              error="[[item]]"
              tabindex$="[[tabIndex]]"
              on-tap="onErrorItemTap_" on-keydown="onErrorItemKeydown_">
            <img class$="[[computeErrorIconClass_(item)]]">
            <div class="error-message">[[item.message]]</div>
            <paper-icon-button class="delete-button"
                on-tap="onDeleteErrorTap_"
                icon="delete" tabindex$="[[tabIndex]]"></paper-icon-button>
          </div>
        </template>
      </iron-list>
      <div id="content-view">
        <extensions-code-section id="code-section"
            no-code-error="$i18n{noErrorsToShow}">
        </extensions-code-section>
      </div>
      <div id="devtools-controls">
        <!--TODO-->
      </div>
    </div>
  </template>
  <script src="chrome://extensions/error_page.js"></script>
</dom-module>