Add About draft page

source/_data/about.json

@@ -0,0 +1,32 @@
+{
+  "team":
+    [
+      {
+        "nickname": "lostinlight",
+        "fediacc": "mastodon.xyz/@lightone",
+        "avatar": "/img/about/lostinlight.png",
+        "info": "creator and maintainer of this website; likes cats and frontend design",
+        "name": "",
+        "site": "",
+        "gitacc": "codeberg.org/lostinlight"
+      },
+      {
+        "nickname": "minoru",
+        "fediacc": "functional.cafe/@minoru",
+        "avatar": "/img/about/minoru.png",
+        "info": "admin of this website, creator of nodes.fediverse.party; maintainer of Newsboat; writes programs in C++, reads sci-fi",
+        "name": "Alexander Batischev",
+        "site": "blog.debiania.in.ua",
+        "gitacc": "codeberg.org/Minoru"
+      },
+      {
+        "nickname": "humanetech",
+        "fediacc": "mastodon.social/@humanetech",
+        "avatar": "/img/about/humanetech.png",
+        "info": "maintainer of this website's Wiki pages, creator of delightful.club; FOSS and Fediverse advocate, mod at SocialHub, facilitates Humane Tech Community",
+        "name": "Arnold Schrijver",
+        "site": "",
+        "gitacc": "codeberg.org/circlebuilder"
+      }
+    ]
+}

source/en/about/index.md

@@ -0,0 +1,4 @@
+---
+layout: "about"
+title: "About the team"
+---

themes/starter/layout/about.ejs

@@ -0,0 +1,33 @@
+
+---
+layout: layout
+---
+
+<%
+  const team = site.data.about.team;
+%>
+
+<main class="contents about">
+  <h2>Source code</h2>
+  <div class="code">
+    <a href="https://codeberg.org/fediverse/fediparty">repository</a> | <a href="https://codeberg.org/lostinlight/distributopia/src/branch/main/all-logos-in-one-basket">logo hub</a>
+  </div>
+  <h2>About us</h2>
+  <% for (u in team) { %>
+  <ul class="article-list">
+    <li><img src="<%= team[u].avatar %>" alt="avatar"></li>
+    <li><span>nickname: </span> <%= team[u].nickname %></li>
+    <% if (team[u].name) { %>
+      <li><span>name: </span> <%= team[u].name %></li>
+    <% } %>
+    <% if (team[u].site) { %>
+      <li><span>site:</span> <a href="https://<%= team[u].site %>"><%= team[u].site %></a></li>
+    <% } %>
+    <li><span>Fedi account:</span> <a href="https://<%= team[u].fediacc %>"><%= team[u].fediacc %></a></li>
+    <% if (team[u].gitacc) { %>
+      <li><span>code:</span> <a href="https://<%= team[u].gitacc %>"><%= team[u].gitacc %></a></li>
+    <% } %>
+    <li><span>info:</span> <%= team[u].info %></li>
+  </ul>
+  <% } %>
+</main>

themes/starter/source/assets/scss/main.scss

@@ -17,3 +17,4 @@
 @import "modules/chronicles";
 @import "modules/misc";
 @import "modules/crystalball";
+@import "modules/about";

themes/starter/source/assets/scss/modules/_about.scss

@@ -0,0 +1,37 @@
+
+.about {
+  margin-top: 4em;
+}
+
+.about h2 {
+  text-align: center;
+  font-weight: bold;
+  line-height: 1;
+  margin-top: 1em;
+}
+
+.about .code {
+  text-align: center;
+}
+
+.about .article-list {
+  margin: 1em 0 .5em;
+}
+
+.about li {
+  padding: 0;
+}
+
+.about li > span {
+  font-family: $font-secondary;
+  font-weight: bold;
+}
+
+.about .article-list li:first-child:before,
+.about .article-list li:first-child:before {
+  display: none;
+}
+
+.about li:last-of-type > span {
+    display: inline;
+}