---
layout: default
type: photos
has_open_heart: true
title: Photos
---

<div class="photos-wrapper" id="photos">
{% assign photos = site.data.photos %}
{% for photo in photos %}
<figure id="P{{ photo.guid }}" class="figure-{{ photo.orientation }}">
  <a href="{{ photo.path }}/public" class="image-link">
    <img 
      src="{{ photo.path }}/public"
      height="{{ photo.height }}"
      style="aspect-ratio: {{ photo.ratio }}"
      alt="{{ photo.alt }}"
      title="{{ photo.alt }}"
      class="{{ photo.orientation }}"
      loading="lazy">
  </a>
  <figcaption>
    <div class="desc photo-metadata">
      <div>{{ photo.createdAt | date: "%Y/%m/%d (%a)" }}</div>
      {% assign split = photo.caption | strip | split: "@ " %}
      {% assign caption = split | first | strip %}
      {% if split.size > 1  %}<div>@ {{ split[1] }}</div>{% endif %}
      <open-heart class="text-open-heart monospace" href="https://likes.muan.dev/?id=photo-P{{ photo.guid }}" emoji="❤️" aria-labelledby="like-prompt">
        <span class="on">Liked ♥︎.</span><span class="off">Like?</span>
      </open-heart>
    </div>
    {% if caption != "-" and caption != "" %}{{ caption | markdownify }}{% endif %}
  </figcaption>
</figure>
{% endfor %}

</div>