research-article.html

<link rel="import" href="../polymer/polymer.html">
<link rel="import" href="../orcid-profile/orcid-profile.html">
<link rel="import" href="../article-metrics/article-metrics.html">
<link rel="import" href="../article-tools/article-share.html">
<link rel="import" href="../article-tools/article-annotate.html">
<link rel="import" href="../article-reference/article-reference.html">
<link rel="import" href="../version-history/version-history.html">
<link rel="import" href="../article-contents/article-contents.html">
<link rel="import" href="../article-entities/article-entities.html">

<!-- styles -->
<link rel="stylesheet" media="screen" href="../bootstrap/dist/css/bootstrap.css" no-shim>

<!-- scripts -->
<script src="../jquery/dist/jquery.min.js"></script>
<script src="../bootstrap/dist/js/bootstrap.min.js"></script>

<!--
A research article.

##### Example

    <article is="research-article">
      <header>…</header>
      <section>…</section>
      <footer>…</footer>
    </article>

@element research-article
@blurb Element providing styles and scripts for a research article
@status alpha
@homepage https://peerj.github.io/research-article
-->
<polymer-element name="research-article" extends="article">
  <template>
    <link rel="stylesheet" href="research-article.css">

    <!-- main column -->
    <div class="column column-main">
      <!-- article metadata -->
      <content select="header"></content>

      <!-- article sections -->
      <content select="section"></content>

      <!-- entity recognition and info popovers -->
      <article-entities hidden-print></article-entities>

      <!-- annotation tools -->
      <article-annotate url="{{ url }}" hidden-print></article-annotate>
    </div>

    <!-- sidebar -->
    <div class="column column-sidebar">
      <!-- table of contents -->
      <div hidden-print>
        <h2 class="heading">Contents <article-share url="{{ url }}" github="{{ github }}"></article-share></h2>
        <div>
          <article-contents></article-contents>
        </div>
      </div>

      <!-- metrics -->
      <article-metrics doi="{{ doi }}" url="{{ url }}" github="{{ github }}" hidden hidden-print></article-metrics>

      <!-- TODO: figures here? -->

      <!-- article footer -->
      <content select="footer"></content>
    </div>
  </template>

  <script src="research-article.js"></script>
</polymer-element>