<?php snippet('html-head', [
    'pageTitle' => $page->title()->value() . ' — ' . $site->title()->value(),
]) ?>

<body data-screen-label="Codex">

<?php snippet('effects') ?>
<?php snippet('header') ?>

<section class="codex-section">
  <div class="codex-header">
    <h1 class="reveal"><?= $page->title()->html() ?></h1>
    <div class="reveal text"><?= $page->description() ?></div>
  </div>

  <div class="codex-content">
    <?php if ($characters = $page->find('characters')): ?>
    <div class="codex-category">
      <h2>Characters</h2>
      <ul class="codex-list">
        <?php foreach ($characters->children() as $character): ?>
        <li>
          <a href="<?= $character->url() ?>"><?= $character->title()->html() ?></a>
        </li>
        <?php endforeach ?>
      </ul>
    </div>
    <?php endif ?>

    <?php if ($locations = $page->find('locations')): ?>
    <div class="codex-category">
      <h2>Locations</h2>
      <ul class="codex-list">
        <?php foreach ($locations->children() as $location): ?>
        <li>
          <a href="<?= $location->url() ?>"><?= $location->title()->html() ?></a>
        </li>
        <?php endforeach ?>
      </ul>
    </div>
    <?php endif ?>
  </div>
</section>

<?php snippet('menu', ['currentPage' => $page]) ?>
<?php snippet('scripts') ?>

</body>
</html>