all repos — site @ 477626e0df170904096d8e3b67b9a949439d844b

source for my site, found at icyphox.sh 

photos: init
Anirudh Oppiliappan x@icyphox.sh
Thu, 18 Jan 2024 17:16:42 +0200
commit

477626e0df170904096d8e3b67b9a949439d844b

parent

4f2d68635fca2a8167fce90f137374b68d0f61fd

4 files changed, 225 insertions(+), 0 deletions(-)

jump to
A bin/photos.sh 
@@ -0,0 +1,12 @@
+#!/usr/bin/env bash
+#
+# usage: printf "<bunch of photos>" | ./bin/photos.sh | pages/photos.md
+
+prefix="$1"
+printf '<div class="image-grid">\n'
+while IFS=$'\n' read -r line; do
+    printf '  <a href="https://cdn.icyphox.sh/film/%s">\n' "$prefix/$line"
+    printf '    <img src="https://cdn.icyphox.sh/fit?file=%s&width=1000&height=1000" />\n' "$prefix/$line"
+    printf '  </a>\n'
+done < /dev/stdin
+printf '</div>'
A pages/photos.md 
@@ -0,0 +1,156 @@
+---
+template: photos.html
+title: photography
+subtitle: 35mm film photography.
+---
+
+I picked up 35mm film photography in 2023 and I absolutely love it. I
+currently use a [Canon EOS
+55](https://h.icyphox.sh/u/icy/h/4Vh6Y75w1rWC17JRg3) and an Olympus
+OM-10. This page documents some of my favourite shots. Click to view
+full-size.
+
+Jump to:
+
+- [Côte d'Azur, France  --  Summer
+  2023](#côte-d-azur-france-summer-2023)
+- [Riga, Latvia & Vilnius/Kaunas, Lithuania  --  Summer
+  2023](#riga-latvia-vilnius-kaunas-lithuania-summer-2023)
+- [Helsinki, Finland  --  Summer 2023](#helsinki-finland-summer-2023)
+- [Helsinki, Finland  --  Autumn 2023](#helsinki-finland-autumn-2023)
+
+
+## Côte d'Azur, France  --  Summer 2023
+### Olympus OM-10, 50mm f/1.8, Fujicolor 200
+
+<div class="image-grid">
+  <a href="https://cdn.icyphox.sh/film/2023/summer/cote-d-azur/001789350002.jpg">
+    <img src="https://cdn.icyphox.sh/fit?file=2023/summer/cote-d-azur/001789350002.jpg&width=1000&height=1000" />
+  </a>
+  <a href="https://cdn.icyphox.sh/film/2023/summer/cote-d-azur/001789350006.jpg">
+    <img src="https://cdn.icyphox.sh/fit?file=2023/summer/cote-d-azur/001789350006.jpg&width=1000&height=1000" />
+  </a>
+  <a href="https://cdn.icyphox.sh/film/2023/summer/cote-d-azur/001789350013.jpg">
+    <img src="https://cdn.icyphox.sh/fit?file=2023/summer/cote-d-azur/001789350013.jpg&width=1000&height=1000" />
+  </a>
+  <a href="https://cdn.icyphox.sh/film/2023/summer/cote-d-azur/001789350015.jpg">
+    <img src="https://cdn.icyphox.sh/fit?file=2023/summer/cote-d-azur/001789350015.jpg&width=1000&height=1000" />
+  </a>
+  <a href="https://cdn.icyphox.sh/film/2023/summer/cote-d-azur/001789350017.jpg">
+    <img src="https://cdn.icyphox.sh/fit?file=2023/summer/cote-d-azur/001789350017.jpg&width=1000&height=1000" />
+  </a>
+  <a href="https://cdn.icyphox.sh/film/2023/summer/cote-d-azur/001789350018.jpg">
+    <img src="https://cdn.icyphox.sh/fit?file=2023/summer/cote-d-azur/001789350018.jpg&width=1000&height=1000" />
+  </a>
+  <a href="https://cdn.icyphox.sh/film/2023/summer/cote-d-azur/001789350019.jpg">
+    <img src="https://cdn.icyphox.sh/fit?file=2023/summer/cote-d-azur/001789350019.jpg&width=1000&height=1000" />
+  </a>
+  <a href="https://cdn.icyphox.sh/film/2023/summer/cote-d-azur/001789350020.jpg">
+    <img src="https://cdn.icyphox.sh/fit?file=2023/summer/cote-d-azur/001789350020.jpg&width=1000&height=1000" />
+  </a>
+  <a href="https://cdn.icyphox.sh/film/2023/summer/cote-d-azur/001789350021.jpg">
+    <img src="https://cdn.icyphox.sh/fit?file=2023/summer/cote-d-azur/001789350021.jpg&width=1000&height=1000" />
+  </a>
+  <a href="https://cdn.icyphox.sh/film/2023/summer/cote-d-azur/001789350024.jpg">
+    <img src="https://cdn.icyphox.sh/fit?file=2023/summer/cote-d-azur/001789350024.jpg&width=1000&height=1000" />
+  </a>
+  <a href="https://cdn.icyphox.sh/film/2023/summer/cote-d-azur/001789350027.jpg">
+    <img src="https://cdn.icyphox.sh/fit?file=2023/summer/cote-d-azur/001789350027.jpg&width=1000&height=1000" />
+  </a>
+  <a href="https://cdn.icyphox.sh/film/2023/summer/cote-d-azur/001789350029.jpg">
+    <img src="https://cdn.icyphox.sh/fit?file=2023/summer/cote-d-azur/001789350029.jpg&width=1000&height=1000" />
+  </a>
+  <a href="https://cdn.icyphox.sh/film/2023/summer/cote-d-azur/001789350030.jpg">
+    <img src="https://cdn.icyphox.sh/fit?file=2023/summer/cote-d-azur/001789350030.jpg&width=1000&height=1000" />
+  </a>
+</div>
+
+## Riga, Latvia & Vilnius/Kaunas, Lithuania  --  Summer 2023
+### Olympus OM-10, 50mm f/1.8, Kodak Gold 200
+
+<div class="image-grid">
+  <a href="https://cdn.icyphox.sh/film/2023/summer/ltlv/001863450004.jpg">
+    <img src="https://cdn.icyphox.sh/fit?file=2023/summer/ltlv/001863450004.jpg&width=1000&height=1000" />
+  </a>
+  <a href="https://cdn.icyphox.sh/film/2023/summer/ltlv/001863450005.jpg">
+    <img src="https://cdn.icyphox.sh/fit?file=2023/summer/ltlv/001863450005.jpg&width=1000&height=1000" />
+  </a>
+  <a href="https://cdn.icyphox.sh/film/2023/summer/ltlv/001863450007.jpg">
+    <img src="https://cdn.icyphox.sh/fit?file=2023/summer/ltlv/001863450007.jpg&width=1000&height=1000" />
+  </a>
+  <a href="https://cdn.icyphox.sh/film/2023/summer/ltlv/001863450008.jpg">
+    <img src="https://cdn.icyphox.sh/fit?file=2023/summer/ltlv/001863450008.jpg&width=1000&height=1000" />
+  </a>
+  <a href="https://cdn.icyphox.sh/film/2023/summer/ltlv/001863450009.jpg">
+    <img src="https://cdn.icyphox.sh/fit?file=2023/summer/ltlv/001863450009.jpg&width=1000&height=1000" />
+  </a>
+  <a href="https://cdn.icyphox.sh/film/2023/summer/ltlv/001863450011.jpg">
+    <img src="https://cdn.icyphox.sh/fit?file=2023/summer/ltlv/001863450011.jpg&width=1000&height=1000" />
+  </a>
+  <a href="https://cdn.icyphox.sh/film/2023/summer/ltlv/001863450014.jpg">
+    <img src="https://cdn.icyphox.sh/fit?file=2023/summer/ltlv/001863450014.jpg&width=1000&height=1000" />
+  </a>
+  <a href="https://cdn.icyphox.sh/film/2023/summer/ltlv/001863450015.jpg">
+    <img src="https://cdn.icyphox.sh/fit?file=2023/summer/ltlv/001863450015.jpg&width=1000&height=1000" />
+  </a>
+  <a href="https://cdn.icyphox.sh/film/2023/summer/ltlv/001863450016.jpg">
+    <img src="https://cdn.icyphox.sh/fit?file=2023/summer/ltlv/001863450016.jpg&width=1000&height=1000" />
+  </a>
+  <a href="https://cdn.icyphox.sh/film/2023/summer/ltlv/001863450034.jpg">
+    <img src="https://cdn.icyphox.sh/fit?file=2023/summer/ltlv/001863450034.jpg&width=1000&height=1000" />
+  </a>
+</div>
+
+## Helsinki, Finland  --  Summer 2023
+### Olympus OM-10, 50mm f/1.8, Fujicolor 200
+
+<div class="image-grid">
+  <a href="https://cdn.icyphox.sh/film/2023/summer/helsinki/001863460003.jpg">
+    <img src="https://cdn.icyphox.sh/fit?file=2023/summer/helsinki/001863460003.jpg&width=1000&height=1000" />
+  </a>
+  <a href="https://cdn.icyphox.sh/film/2023/summer/helsinki/001863460008.jpg">
+    <img src="https://cdn.icyphox.sh/fit?file=2023/summer/helsinki/001863460008.jpg&width=1000&height=1000" />
+  </a>
+  <a href="https://cdn.icyphox.sh/film/2023/summer/helsinki/001863460012.jpg">
+    <img src="https://cdn.icyphox.sh/fit?file=2023/summer/helsinki/001863460012.jpg&width=1000&height=1000" />
+  </a>
+  <a href="https://cdn.icyphox.sh/film/2023/summer/helsinki/001863460014.jpg">
+    <img src="https://cdn.icyphox.sh/fit?file=2023/summer/helsinki/001863460014.jpg&width=1000&height=1000" />
+  </a>
+  <a href="https://cdn.icyphox.sh/film/2023/summer/helsinki/001863460023.jpg">
+    <img src="https://cdn.icyphox.sh/fit?file=2023/summer/helsinki/001863460023.jpg&width=1000&height=1000" />
+  </a>
+  <a href="https://cdn.icyphox.sh/film/2023/summer/helsinki/001863460029.jpg">
+    <img src="https://cdn.icyphox.sh/fit?file=2023/summer/helsinki/001863460029.jpg&width=1000&height=1000" />
+  </a>
+</div>
+
+## Helsinki, Finland  --  Autumn 2023
+### Canon EOS 55, 50mm f/1.8, Fomapan 100 (pushed to 400)
+
+<div class="image-grid">
+  <a href="https://cdn.icyphox.sh/film/2023/autumn/helsinki/001936000006.jpg">
+    <img src="https://cdn.icyphox.sh/fit?file=2023/autumn/helsinki/001936000006.jpg&width=1000&height=1000" />
+  </a>
+  <a href="https://cdn.icyphox.sh/film/2023/autumn/helsinki/001936000008.jpg">
+    <img src="https://cdn.icyphox.sh/fit?file=2023/autumn/helsinki/001936000008.jpg&width=1000&height=1000" />
+  </a>
+  <a href="https://cdn.icyphox.sh/film/2023/autumn/helsinki/001936000009.jpg">
+    <img src="https://cdn.icyphox.sh/fit?file=2023/autumn/helsinki/001936000009.jpg&width=1000&height=1000" />
+  </a>
+  <a href="https://cdn.icyphox.sh/film/2023/autumn/helsinki/001936000011.jpg">
+    <img src="https://cdn.icyphox.sh/fit?file=2023/autumn/helsinki/001936000011.jpg&width=1000&height=1000" />
+  </a>
+  <a href="https://cdn.icyphox.sh/film/2023/autumn/helsinki/001936000012.jpg">
+    <img src="https://cdn.icyphox.sh/fit?file=2023/autumn/helsinki/001936000012.jpg&width=1000&height=1000" />
+  </a>
+  <a href="https://cdn.icyphox.sh/film/2023/autumn/helsinki/001936000013.jpg">
+    <img src="https://cdn.icyphox.sh/fit?file=2023/autumn/helsinki/001936000013.jpg&width=1000&height=1000" />
+  </a>
+  <a href="https://cdn.icyphox.sh/film/2023/autumn/helsinki/001936000017.jpg">
+    <img src="https://cdn.icyphox.sh/fit?file=2023/autumn/helsinki/001936000017.jpg&width=1000&height=1000" />
+  </a>
+  <a href="https://cdn.icyphox.sh/film/2023/autumn/helsinki/001936000020.jpg">
+    <img src="https://cdn.icyphox.sh/fit?file=2023/autumn/helsinki/001936000020.jpg&width=1000&height=1000" />
+  </a>
+</div>
M static/style.css → static/style.css 
@@ -111,6 +111,7 @@ }
 
 .footer {
   column-count: 2;
+  column-gap: 12px;
 }
 
 body {

@@ -138,6 +139,22 @@ .row {
   display: flex;
   flex-wrap: wrap;
   padding: 0 0.5rem 0.5rem 0;
+}
+
+.image-grid {
+  column-count: 2;
+}
+
+.image-grid img {
+  all: unset;
+  object-fit: cover;
+  position: relative;
+  width: 100%;
+  margin-bottom: 12px;
+}
+
+.image-grid a {
+  border-bottom: unset;
 }
 
 .subtitle {

@@ -318,6 +335,10 @@ }
 
 @media (max-width: 385px) {
   .footer {
+    column-count: 1;
+  }
+
+  .image-grid {
     column-count: 1;
   }
A templates/photos.html 
@@ -0,0 +1,36 @@
+<!doctype html>
+<html lang=en>
+  <head>
+    {{ template "partials/head.html" }}
+    <meta name="description" content="{{ index .Meta "subtitle" }}">
+  <style>
+    h2 {
+      margin-bottom: 1px;
+    }
+    h3 {
+      margin-top: 0px;
+      padding-top: 2px;
+      font-size: 0.9rem;
+      color: var(--gray);
+    }
+  </style>
+  </head>
+  <title>
+    {{ index .Meta "title" }} &mdash; {{ .Cfg.Title }}
+  </title>
+  <body>
+  <main>
+    <div class="sidenav">
+      {{ template "partials/nav.html" }}
+    </div>
+    <article align="left">
+      <h1>{{ index .Meta "title" }}</h1>
+      {{ .Body }}
+    </article>
+  </main>
+  <footer>
+    {{ template "partials/footer.html" }}
+  </footer>
+</body>
+
+</html>