ct_pixel_diff/frontend/res/imp/pixel-diff-scaffold-sk.html

<!--
  The <pixel-diff-scaffold-sk> custom element declaration.

  Contains the title bar and drawer-panel for all the CT Pixel Diff pages. Every
  CT Pixel Diff page should be a child of this element.

  Attributes:
    None.

  Events:
    None.

  Methods:
    None.
-->

<link rel=import href="/res/imp/bower_components/paper-header-panel/paper-header-panel.html">
<link rel=import href="/res/imp/bower_components/paper-icon-button/paper-icon-button.html">
<link rel=import href="/res/imp/bower_components/paper-menu-button/paper-menu-button.html">
<link rel=import href="/res/imp/bower_components/paper-menu/paper-menu.html">
<link rel=import href="/res/imp/bower_components/paper-toolbar/paper-toolbar.html">
<link rel=import href="/res/imp/bower_components/iron-icons/iron-icons.html">
<link rel=import href="/res/imp/bower_components/iron-icons/av-icons.html">
<link rel=import href="/res/imp/bower_components/iron-icon/iron-icon.html">
<link rel=import href="/res/common/imp/login.html">
<link rel=import href="/res/common/imp/error-toast-sk.html">

<dom-module id="pixel-diff-scaffold-sk">
  <style>
    * {
      font-family:Roboto,Helvetica,Arial,'Bitstream Vera Sans',sans-serif;
    }

    #nav a[href] {
      color: black;
      text-decoration: none;
    }

    #nav a[href]:hover {
      text-decoration: underline;
    }

    #nav a span {
      vertical-align: middle;
    }

    #nav div {
      margin: 1em;
    }

    #nav iron-icon {
      margin-right: 0.3em;
    }

    :root {
      --paper-toolbar-background: #285bba;
      --login-sk-color: white;
    }

    login-sk {
      margin-left: auto;
      display: block;
      color: white;
    }

    .main {
      padding: 2em;
    }

    .name {
      font-size: 20px;
    }
  </style>
  <template>
    <div>
      <paper-toolbar>
        <paper-menu-button no_overlap>
          <paper-icon-button icon="menu" class="dropdown-trigger"></paper-icon-button>
          <paper-menu id=nav class="dropdown-content">
            <paper-item><a href="/"><iron-icon icon="icons:view-list"></iron-icon><span>View Runs</span></a></paper-item>
            <paper-item><a target="_blank" href="https://ct.skia.org/pixel_diff/"><iron-icon icon="av:library-add"></iron-icon><span>New Run</span></a></paper-item>
            <paper-item><a target="_blank" href="https://github.com/google/skia-buildbot/tree/master/ct_pixel_diff"><iron-icon icon="folder"></iron-icon><span>Code</span></a></paper-item>
          </paper-menu>
        </paper-menu-button>
        <div class=name>Cluster Telemetry Pixel Diff</div>
        <login-sk></login-sk>
      </paper-toolbar>

      <div class=main>
        <content></content>
      </div>

    </div>
    <error-toast-sk></error-toast-sk>
  </template>
</dom-module>

<script>
  Polymer({
    is: "pixel-diff-scaffold-sk",

    ready: function() {
    },
  });
</script>