{{#> main}}
<!-- Header -->
<header class="container">
  <hgroup>
    <h1>{{ site.title }}</h1>
    <p>{{ site.description }}</p>
  </hgroup>
  {{> navbar}}
</header>
<!-- ./ Header -->

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

  <!-- Latest Vods -->
  <section id="tables">
    <h2>Latest VODs</h2>
    <div class="overflow-auto">
      <table class="striped">
        <thead>
          <tr>
            <th scope="col">ID</th>
            <th scope="col">Vtubers</th>
            <th scope="col">Uploader</th>
            <th scope="col">Status</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>{{{identicon this.upload.user.id 24}}}</td>
            <td>{{this.status}}</td>
          </tr>
          {{/each}}
        </tbody>
      </table>
    </div>
  </section>
  <!-- ./ Latest Vods -->


  <!-- Latest VTubers -->
  <section id="tables">
    <h2>Latest VTubers</h2>
    <div class="overflow-auto">
      <table class="striped">
        <thead>
          <tr>
            <th scope="col">ID</th>
            <th scope="col">Name</th>
            <th scope="col">Image</th>

          </tr>
        </thead>
        <tbody>
          {{#each vtubers}}
          <tr>
            <td><a href="/vtubers/{{this.id}}">{{this.id}}</a></td>
            <td>
              {{this.displayName}}
            </td>
            <td><img class="avatar" src="{{getCdnUrl this.image}}"></td>
          </tr>
          {{/each}}
        </tbody>
      </table>
    </div>
  </section>
  <!-- ./ Latest Streams -->



  <!-- Latest Streams -->
  <section id="tables">
    <h2>Latest Streams</h2>
    <div class="overflow-auto">
      <table class="striped">
        <thead>
          <tr>
            <th scope="col">🚧 ID</th>
            <th scope="col">🚧 VTuber</th>
            <th scope="col">🚧 Date</th>
            <th scope="col">🚧 Platform</th>
            <th scope="col">🚧 Status</th>

          </tr>
        </thead>
        <tbody>
          <tr>
            <th scope="row">🚧 1</th>

            <td>🚧 Cell</td>
            <td>🚧 Cell</td>
            <td>🚧 Cell</td>
            <td>🚧 Cell</td>
          </tr>
          <tr>
            <th scope="row">🚧 2</th>

            <td>🚧 Cell</td>
            <td>🚧 Cell</td>
            <td>🚧 Cell</td>
            <td>🚧 Cell</td>
          </tr>
          <tr>
            <th scope="row">🚧 3</th>

            <td>🚧 Cell</td>
            <td>🚧 Cell</td>
            <td>🚧 Cell</td>
            <td>🚧 Cell</td>
          </tr>
        </tbody>
      </table>
    </div>

  </section>
  <!-- ./ Latest Streams -->

  <!-- Latest Tags -->
  <section id="tables">
    <h2>Latest Tags</h2>
    <div class="overflow-auto">
      <table class="striped">
        <thead>
          <tr>
            <th scope="col">🚧 ID</th>
            <th scope="col">🚧 Name</th>
            <th scope="col">🚧 idk</th>
            <th scope="col">🚧 idk</th>
            <th scope="col">🚧 idk</th>

          </tr>
        </thead>
        <tbody>
          <tr>
            <th scope="row">🚧 1</th>

            <td>🚧 Cell</td>
            <td>🚧 Cell</td>
            <td>🚧 Cell</td>
            <td>🚧 Cell</td>
          </tr>
          <tr>
            <th scope="row">🚧 2</th>

            <td>🚧 Cell</td>
            <td>🚧 Cell</td>
            <td>🚧 Cell</td>
            <td>🚧 Cell</td>
          </tr>
          <tr>
            <th scope="row">🚧 3</th>

            <td>🚧 Cell</td>
            <td>🚧 Cell</td>
            <td>🚧 Cell</td>
            <td>🚧 Cell</td>
          </tr>
        </tbody>
      </table>
    </div>
  </section>
  <!-- ./ Latest Tags -->

  {{>footer}}
</main>

{{/main}}