{{#> main}}
<!-- Header -->
<header class="container">
  {{> navbar}}
</header>
<!-- ./ Header -->

<!-- Main -->
<main class="container">

  <section>
    <h1>
      {{#each vod.vtubers}}
      {{this.displayName}}{{#unless @last}}, {{/unless}}
      {{/each}}
      – {{formatDate vod.stream.date}}
    </h1>

    <h2>Details</h2>

    {{!-- - vtuber
    - datetime (formatted)
    - datetime iso 8601
    - announcementUrl
    - platforms
     --}}
    <h2>Vods</h2>


    <div class="overflow-auto">
      <table class="striped">
        <thead>
          <tr>
            <th>VOD ID</th>
            <th>VTuber</th>
            <th>Stream Date</th>
            <th>Uploader</th>
            <th></th>
          </tr>
        </thead>
        <tbody>
          {{#each vods}}
          <tr>
            <td><a href="/vods/{{this.id}}">{{this.id}}</a></td>
            <td>
              {{#each this.vtubers}}
              {{this.displayName}}
              {{/each}}
            </td>
            <td>{{formatDate this.stream.date}}</td>
            <td>{{{identicon this.upload.user.id 24}}}</td>
          </tr>
          {{/each}}
        </tbody>
      </table>
    </div>
  </section>


  {{>footer}}
</main>

{{/main}}