---
permalink: /reading/books/index.php
type: dynamic
schema: book
---
<a class="back-link" href="/reading" title="Go back to the reading index page">{% tablericon "arrow-left" %} Back to reading</a>
<article class="book-focus">
  <div class="book-display">
    <img
      class="media-image"
      srcset="
        <?= htmlspecialchars($book["image"]) ?>?class=verticalsm&type=webp 200w,
        <?= htmlspecialchars($book["image"]) ?>?class=verticalmd&type=webp 400w,
        <?= htmlspecialchars($book["image"]) ?>?class=verticalbase&type=webp 800w
      "
      sizes="(max-width: 450px) 203px,
        (max-width: 850px) 406px,
        (max-width: 1000px) 812px,
        812px"
      src="<?= htmlspecialchars($book["image"]) ?>?class=verticalsm&type=webp"
      alt="<?= htmlspecialchars($book["title"]) ?> by <?= htmlspecialchars($book["author"]) ?>"
      decoding="async"
      width="200"
      height="307"
    />
    <div class="media-meta">
      <h2 class="page-title"><?= htmlspecialchars($book["title"]) ?></h2>
      <?php if (!empty($book["tags"])): ?>
        <?php renderTags($book["tags"] ?? []); ?>
      <?php endif; ?>
      <?php if (!empty($book["rating"])): ?>
        <span><?= htmlspecialchars($book["rating"]) ?></span>
      <?php endif; ?>
      <?php if (!empty($book["author"])): ?>
        <span class="sub-meta">By <?= htmlspecialchars($book["author"]) ?></span>
      <?php endif; ?>
      <?php if ($book["favorite"]): ?>
        <span class="sub-meta favorite">{% tablericon "heart" %} This is one of my favorite books!</span>
      <?php endif; ?>
      <?php if ($book["tattoo"]): ?>
        <span class="sub-meta tattoo">{% tablericon "needle" %} I have a tattoo inspired by this book!</span>
      <?php endif; ?>
      <?php if ($book["status"] == 'finished'): ?>
        <span class="sub-meta">Finished on:&puncsp;<mark><?= date('F j, Y', strtotime($book["date_finished"])) ?></mark></span>
      <?php elseif ($book["status"] == 'started'): ?>
        <progress value="<?= htmlspecialchars($book["progress"]) ?>" max="100"><?php $book["progress"] . '%'; ?></progress>
      <?php endif; ?>
    </div>
  </div>
  <?php if (!empty($book["review"])): ?>
    {% render "blocks/banners/warning.liquid", text: "There are probably spoilers after this banner — this is a warning about them." %}
    <h2>My thoughts</h2>
    <?= parseMarkdown($book["review"]) ?>
  <?php endif; ?>
  <?php
    renderAssociatedMedia(
      $book["artists"] ?? [],
      $book["related_books"] ?? [],
      $book["genres"] ?? [],
      $book["movies"] ?? [],
      $book["posts"] ?? [],
      $book["shows"] ?? []
    );
  ?>
  <?php if (!empty($book["description"])): ?>
    <h2>Overview</h2>
    <?= parseMarkdown($book["description"]) ?>
  <?php endif; ?>
</article>
<?php
  $html = ob_get_clean();
  $htmlMin = new HtmlMin();
  $htmlMin->doOptimizeAttributes(true);
  $htmlMin->doRemoveComments(true);
  $htmlMin->doSumUpWhitespace(true);
  $htmlMin->doRemoveWhitespaceAroundTags(true);
  $htmlMin->doOptimizeViaHtmlDomParser(false);
  echo $htmlMin->minify($html);
?>