website/_src/pages/gallery.html

---
title: "Gallery"
order: 4
icon: "M 30 26 L 27 26 L 21 14 L 16 23 L 11 17 L 5 26 L 2 26 L 2 2 Q 2 2 10 6 A 1 1 0 0 0 10 13 A 1 1 0 0 0 10 6 L 2 2 L
30 2 L 30 26 L 30 30 L 2 30 L 2 26"
---

<section id="artworks">
	<article>
		<h2>Original characters</h2>
		<ul role="list">
			{% assign sortedArtworks = collections.artworks | sortByFirstDate %} {%
			for artwork in sortedArtworks %}
			<li>
				<a href="{{artwork.page.url}}">
					<figure>
						{% if artwork.data.images[0] %}
						<img src="{{artwork.data.images[0].src}}" alt="{{artwork.data.images[0].alt}}" {%if artwork.data.images[0].pixel%} style="image-rendering: pixelated" {%endif%} />
						<figcaption>{{artwork.page.fileSlug}}</figcaption>
						{% if artwork.data.images[0].date %}
						<time datetime="{{artwork.data.images[0].date | ISO}}">{{artwork.data.images[0].date | readable}}</time>
						{%endif%} {%endif%}
					</figure>
				</a>
			</li>
			{% endfor %}
		</ul>
	</article>
	<article>
		<h2>Fan art</h2>
		<ul role="list">
			{% assign sortedFanarts = collections.fanarts | sortByFirstDate %} {% for
			fanart in sortedFanarts %}
			<li>
				<a href="{{fanart.page.url}}">
					<figure>
						{% if fanart.data.images[0] %}
						<img src="{{fanart.data.images[0].src}}" alt="{{fanart.data.images[0].alt}}" />
						<figcaption>{{fanart.page.fileSlug}}</figcaption>
						{% if fanart.data.images[0].date %}
						<time datetime="{{fanart.data.images[0].date | ISO}}">{{fanart.data.images[0].date | readable}}</time>
						{%endif%} {%endif%}
					</figure>
				</a>
			</li>
			{% endfor %}
		</ul>
	</article>
</section>