<!DOCTYPE html>
<html lang="en">
<head>
<title>{weblog-title}{separator}{post-title}</title>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link href="https://unpkg.com/prismjs@1.29.0/themes/prism-tomorrow.min.css" rel="stylesheet" />
<link rel="stylesheet" href="/styles.css?v0.0.5">
{feeds}
</head>
<body>

  <div class="header">
    <header>
      <img class="avatar" src="https://cdn.some.pics/deathau/663da4619fdb6.svg" alt="My avatar — A pixelated self-portrait in the style of the 'bitizens' in the mobile game Tiny Tower" />
      <h1 class="weblog-title"><a href="{base-path}">{weblog-title}</a></h1>
      {navigation}
      <fedi-social></fedi-social>
    </header>
  </div>

  <main class="weblog">

    <article>
      <aside class="post-info">
        <a href="{location}"><i class="fa-solid fa-clock"></i> <time class="dt-published" datetime="{date}">{date}</time></a>
      </aside>
      <i data-emoji="{emoji}"></i>
      {body}
      <aside class="post-info">
        <a class="status_url" href="{status_url}" target="_blank"><i class="omg-icon omg-prami"></i> via status.lol</a>
        <a class="external_url" href="{external_url}" target="_blank"><i class="omg-icon omg-fediverse"></i> Interact on the Fediverse</a>
      </aside>
      <aside class="post-tags">
        {tags}
      </aside>
      <section id="fedi-social-replies" class="replies">
        
      </section>
    </article>

    <template id="fedi-social-reply">
      <article class="fedi-social-reply">
        <div class="reply-header">
          <aside class="author">
            <img class="avatar" src="https://cdn.some.pics/deathau/663da4619fdb6.svg">
            <a class="name" href="https://monrepos.casa/profile/death.au">Gordon Pedersen</a>
          </aside>
          <aside class="post-info">
            <a class="permalink" href="https://monrepos.casa/display/0e03068e-1866-3f18-738d-497554542391">
              <i class="fa-solid fa-clock"></i> 
              <time class="dt-published" datetime="2024-05-11T07:04:19.000Z">11 days ago</time>
            </a>
          </aside>
        </div>
        <p class="reply-content">
          Also, at some point, I want to replace the emoji font (currently <a href="https://fonts.google.com/noto/specimen/Noto+Color+Emoji" target="_blank" rel="noopener noreferrer">Noto Color Emoji</a>) with the same 3D Fluent ones that status.lol uses.<br>Any tips, <a class="u-url mention status-link" href="https://social.lol/users/adam" rel="noopener noreferrer" target="_blank" title="adam">@<span>adam</span></a> ?
        </p>
        <aside class="post-info">
          <a class="source" href="https://monrepos.casa/display/0e03068e-1866-3f18-738d-497554542391" target="_blank">
            <i class="omg-icon omg-fediverse"></i> via <span class="application">friendica</span>
          </a>
          <span class="fedi-social">
            <a href="https://monrepos.casa/display/0e03068e-1866-3f18-738d-497554542391" target="_blank"><i class="fa fa-comment"></i> <span class="replies-count">3</span></a>
            <a href="https://monrepos.casa/display/0e03068e-1866-3f18-738d-497554542391" target="_blank"><i class="fa fa-star"></i> <span class="favourites-count">0</span></a>
            <a href="https://monrepos.casa/display/0e03068e-1866-3f18-738d-497554542391" target="_blank"><i class="fa fa-retweet"></i> <span class="reblogs-count">0</span></a>
          </span>
        </aside>
      </article>
    </template>
    <hr>

    <h2>Recent posts</h2>
    {recent-posts}

  </main>

  <footer>
    <p>Made with <a href="https://weblog.lol">weblog.lol</a>.</p>
    <p><img class="prami-logo" src="https://cdn.cache.lol/img/prami_hybrid.svg"> <a href="https://home.omg.lol/referred-by/deathau">Powered by omg.lol</a></p>
  </footer>

  <script src="/js/luxon.min.js" crossorigin="anonymous"></script>
  <script src="/js/fediverse.js"></script>
  <script>
    document.querySelectorAll('time:not(.dt-start):not(.dt-end)').forEach(time => {
      const datetime = luxon.DateTime.fromISO(time.getAttribute('datetime'))
      time.innerText = datetime.toRelative()
    });
    fediverse()
  </script>
  <script src="https://unpkg.com/prismjs@1.29.0/components/prism-core.min.js"></script>
  <script src="https://unpkg.com/prismjs@1.29.0/plugins/autoloader/prism-autoloader.min.js"></script>
</body>
</html>