Add October 2020 artwork

templates/art.html.tera

@@ -2,16 +2,18 @@
 {% block title %}mycelial technology | art{% endblock title %}
 {% block content %}
     <h2>Art</h2>
+    <h3>2020</h3>
     <div class="flex-grid">
-      <img class="col" alt="Line drawing of an aloe plant" src="art/aloe.jpg" title="Aloe plant" />
-      <img class="col" alt="Line drawing of an American kestrel" src="art/kestrel.jpg" title="American kestrel" />
-      <img class="col" alt="Line drawing of a black oval surrounded by two rings of glyphs" src="art/obsidian_artifact.jpg" title="Obsidian Artifact" />
+      <img class="col" alt="Line drawing of a Japanese archer with a longbow" src="art/archer.jpg" title="Archer" />
+      <img class="col" alt="Pen and ink drawing of a tiger beetle with mesas and clouds in the background" src="art/beetle.jpg" title="Beetle" />
+      <img class="col" alt="Pen and ink drawing of a man standing with his hands in his pockets. He has a katana slung across his back and there are rocks scattered around and hills in the background" src="art/ninja.jpg" title="Ninja" />
     </div>
     <div class="flex-grid">
-      <img class="col" alt="Line drawing of a mountain with a teardrop-shaped symbol above it, with mountains and clouds in the background" src="art/mystic_mountain.jpg" title="Mystic Mountain" />
-      <img class="col" alt="Line drawing of an ant with a long, antenna-like mushroom growing from its thorax" src="art/cordyceps_ant.jpg" title="Ophiocordyceps unilateralis on ant host" />
-      <img class="col" alt="Line drawing of a meditating figure with haloes of glyphs surrounding them" src="art/halo.svg" title="Halo" />
+      <img class="col" alt="Inked portrait of a beautiful young person" src="art/xiao_wen_ju.jpg" title="Xiao Wen Ju" />
+      <img class="col" alt="Black and white event poster of a spacecraft, astronaut and planet" src="art/extrasolar.jpg" title="Extrasolar" />
+      <img class="col" alt="Line drawing of a woman in a hooded parka" src="art/parka.jpg" title="Parka" />
     </div>
+    <h3>2019</h3>
     <div class="flex-grid">
       <img class="col" alt="Line drawing of a humyn skull with mushrooms growing from it and text beneath reading 'Death is not the End'" src="art/death_is_not_the_end.jpg" title="Death is not the End" />
       <img class="col" alt="Line drawing of a monk ringing a bell" src="art/ring_monk.jpg" title="Ring" />
@@ -27,9 +29,16 @@
       <img class="col" alt="Line drawing of a physalis fruit" src="art/physalis.jpg" title="Frail" />
       <img class="col" alt="Line drawing of a humyn hand reaching out to touch a mycelial network" src="art/hyphal_fusion.svg" title="Hyphal Fusion" />
     </div>
+    <h3>2018</h3>
     <div class="flex-grid">
-      <img class="col" alt="Black and white event poster of a spacecraft, astronaut and planet" src="art/extrasolar.jpg" title="Extrasolar" />
-      <img class="col" alt="Line drawing of a woman in a hooded parka" src="art/parka.jpg" title="Parka" />
+      <img class="col" alt="Line drawing of an aloe plant" src="art/aloe.jpg" title="Aloe plant" />
+      <img class="col" alt="Line drawing of an American kestrel" src="art/kestrel.jpg" title="American kestrel" />
+      <img class="col" alt="Line drawing of a black oval surrounded by two rings of glyphs" src="art/obsidian_artifact.jpg" title="Obsidian Artifact" />
+    </div>
+    <div class="flex-grid">
+      <img class="col" alt="Line drawing of a mountain with a teardrop-shaped symbol above it, with mountains and clouds in the background" src="art/mystic_mountain.jpg" title="Mystic Mountain" />
+      <img class="col" alt="Line drawing of an ant with a long, antenna-like mushroom growing from its thorax" src="art/cordyceps_ant.jpg" title="Ophiocordyceps unilateralis on ant host" />
+      <img class="col" alt="Line drawing of a meditating figure with haloes of glyphs surrounding them" src="art/halo.svg" title="Halo" />
     </div>
     <hr>
 {%- endblock %}

templates/base.html.tera

@@ -58,6 +58,7 @@
       .col {
         flex: 1;
         padding: 1rem;
+        overflow: auto;
       }
       
       @media (max-width: 400px) {