rework profiles elsewhere

4 files changed, 34 insertions, 7 deletions

diff --git a/_includes/default.html b/_includes/default.html
index 710635f..61f43bf 100644
--- a/_includes/default.html
+++ b/_includes/default.html
@@ -36,6 +36,6 @@
     <h1>{{ title }}{% if showDate %} <small>({{ page.date | date: "%d %b %Y", 'Etc/UTC' }})</small>{% endif %}</h1>
     {{ content }}
 </main>
-<script src="/assets/fuck-hn.js"></script>
+<script src="/assets/site.js"></script>
 </body>
 </html>
diff --git a/assets/site.css b/assets/site.css
index 3edc9aa..d57334c 100644
--- a/assets/site.css
+++ b/assets/site.css
@@ -41,6 +41,18 @@ table th, table td {
     padding: 0 0.2em;
 }
 
+.profile-everywhere-list {
+    display: flex;
+    flex-flow: row wrap;
+    list-style: none;
+    row-gap: 1em;
+    column-gap: clamp(0.75em, 3vw, 1.5em);
+    margin: 0 auto;
+    max-width: 80%;
+    padding: 0;
+    justify-content: center;
+}
+
 /* https://github.com/PrismJS/prism/blob/master/themes/prism.css */
 code[class*="language-"],
 pre[class*="language-"] {
diff --git a/assets/fuck-hn.js b/assets/site.js
index c75e0a6..2614c4c 100644
--- a/assets/fuck-hn.js
+++ b/assets/site.js
@@ -7,3 +7,13 @@
 if (document.referrer.startsWith("https://news.ycombinator.com")) {
     document.location = "https://upload.wikimedia.org/wikipedia/commons/d/d4/Human_fart.wav"
 }
+
+const replaceWithEmailLink = document.getElementById("index/replace-with-email-link");
+if (replaceWithEmailLink !== null) {
+    const newNode = document.createElement('a');
+    newNode.innerText = 'email';
+    newNode.href = 'mailto:' +
+        replaceWithEmailLink.querySelector('code')
+            .innerText.replace('<this domain>', location.hostname);
+    replaceWithEmailLink.replaceWith(newNode);
+}
diff --git a/index.md b/index.md
index f6dbea3..20e02b1 100644
--- a/index.md
+++ b/index.md
@@ -12,12 +12,17 @@ i’ve been programming for over a decade, and in that time i’ve worked on [a
 my pronouns are [ze/hir or it/its, or, if you absolutely must for some reason, she/her](https://pronoun.is/ze/hir?or=it&or=she).
 
 i exist in a lot of places:
-- see me retweet nonsense you don't care about on <a rel="me" href="https://twitter.com/boring_cactus">twitter</a> or very occasionally <a rel="me" href="https://tacobelllabs.net/@cactus">mastodon</a>
-- see me share longer nonsense you don't care about on <a rel="me" href="https://cohost.org/cactus">cohost</a>
-- watch me occasionally stream things on <a rel="me" href="https://www.twitch.tv/boringcactus">twitch</a>
-- watch various kinds of permanent video content on [youtube](https://www.youtube.com/channel/UCw0N-UmLylMSnCtHZ7vagBw)
-- give me money on [ko-fi](https://ko-fi.com/boringcactus)
-- if you must, email me at `melody@<this domain>`
+<ul class="profile-everywhere-list">
+<li><a rel="me" href="https://cohost.org/cactus">cohost</a> (RIP)</li>
+<li><a rel="me" href="https://twitter.com/boring_cactus">twitter</a>, alas</li>
+<li><a rel="me" href="https://github.com/boringcactus">github</a></li>
+<li><a rel="me" href="https://ko-fi.com/boringcactus">ko-fi</a></li>
+<li><a rel="me" href="https://www.youtube.com/@boringcactus">youtube</a></li>
+<li><a rel="me" href="https://www.twitch.tv/boringcactus">twitch.tv</a></li>
+<li><a rel="me" href="https://tacobelllabs.net/@cactus">mastodon</a></li>
+<li><a rel="me" href="https://bsky.app/profile/boringcactus.com">bluesky</a></li>
+<li><span id="index/replace-with-email-link">email: <code>melody@&lt;this domain&gt;</code></span></li>
+</ul>
 
 currently, by day i’m a software engineer at the [Massachusetts Bay Transportation Authority's Customer Technology Department](https://ctd.mbta.com/).
 by night i am the proprietrix of [Somnolent Succulent Studio LLC](https://somnolentsucculent.studio), but most of the time i just play final fantasy xiv.