{{ template "header.html" . }}
<div class="container" id="app">
  <div class="page-header" v-if="series">
    <h1>
      <span class="glyphicon glyphicon-list"></span>
      {{ .Series.Name }}
    </h1>
  </div>
  <div class="alert alert-danger" role="alert" v-else>Aucune série sélectionnée</div>
  <template v-if="series">
  <h2>
    <span class="glyphicon glyphicon-book"></span> Livre(s)
  </h2>
  <ul>
    <li v-for="book in series.books" class="list-unstyled">{{ .Book.Series.Idx }}. 
    <a :href="'book.html?id='+book.id">{{ .Book.Title }}</a>
    </li>
  </ul>
  <h2>
    <span class="glyphicon glyphicon-user"></span> Auteur(s)
  </h2>
  <ul>
    <li v-for="author in series.authors" class="list-unstyled">
      <span class="glyphicon glyphicon-user"></span>
      <a :href="'author.html?id='+author.id">{{ .Author.Name }}</a>
    </li>
  </ul>
  </template>
</div>
{{ template "footer.html" . }}