From 8ed2a2af6cf185936c8add978647c85771bc1e2b Mon Sep 17 00:00:00 2001
From: mannes <info@mbtech.nl>
Date: Thu, 24 Sep 2026 10:14:57 +0200
Subject: [PATCH] Add a Ko-fi link to the footer
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

A rotating joke per page load (9V battery · 10A fuse · new test leads · electrical tape), with a plain
'Support libreble on Ko-fi' title and aria-label so the destination is clear.

Co-Authored-By: Claude Opus 5.5 (1M context) <noreply@anthropic.com>
---
 apps/web/src/components/AppFooter.tsx | 42 ++++++++++++++++++++++++++-
 1 file changed, 41 insertions(+), 1 deletion(-)

diff --git a/apps/web/src/components/AppFooter.tsx b/apps/web/src/components/AppFooter.tsx
index 30a7e16..eb32777 100644
--- a/apps/web/src/components/AppFooter.tsx
+++ b/apps/web/src/components/AppFooter.tsx
@@ -1,4 +1,4 @@
-// One centered line: libreble · GitHub · Report an issue · build version. Colours come from the
+// One centered line: libreble · GitHub · Report an issue · Ko-fi · build version. Colours come from the
 // zinc ramp, which index.css mirrors per theme; the libreble accent opts in via `dark:`.
 
 const REPO = 'https://github.com/libreble/multimeter';
@@ -7,6 +7,16 @@ const RELEASE = /^v\d+\.\d+\.\d+$/.test(__APP_VERSION__)
   ? `${REPO}/releases/tag/${__APP_VERSION__}`
   : null;
 
+/** The Ko-fi link wears a different joke each page load; its title/aria-label says what it is. */
+const KOFI_JOKES = [
+  'Buy me a 9V battery',
+  'Buy me a 10A fuse',
+  'Buy me new test leads',
+  'Buy me some electrical tape',
+];
+const KOFI_JOKE = KOFI_JOKES[Math.floor(Math.random() * KOFI_JOKES.length)];
+const KOFI_TITLE = 'Support libreble on Ko-fi';
+
 const LINK = 'inline-flex items-center gap-1.5 hover:text-zinc-300';
 
 export function AppFooter() {
@@ -34,6 +44,17 @@ export function AppFooter() {
         >
           Report an issue
         </a>
+        <a
+          href="https://ko-fi.com/mannes"
+          target="_blank"
+          rel="noopener noreferrer"
+          title={KOFI_TITLE}
+          aria-label={`${KOFI_JOKE} — ${KOFI_TITLE}`}
+          className={LINK}
+        >
+          <CupMark />
+          {KOFI_JOKE}
+        </a>
         {RELEASE ? (
           <a
             href={RELEASE}
@@ -70,6 +91,25 @@ function LibrebleMark() {
   );
 }
 
+function CupMark() {
+  return (
+    <svg
+      viewBox="0 0 16 16"
+      fill="none"
+      stroke="currentColor"
+      strokeWidth="1.5"
+      strokeLinecap="round"
+      strokeLinejoin="round"
+      className="h-4 w-4"
+      aria-hidden
+    >
+      <path d="M2.5 6h9v4a3.5 3.5 0 0 1-3.5 3.5H6A3.5 3.5 0 0 1 2.5 10V6Z" />
+      <path d="M11.5 7h1a1.75 1.75 0 0 1 0 3.5h-1.2" />
+      <path d="M5.5 2.5v1.5M8.5 2.5v1.5" />
+    </svg>
+  );
+}
+
 function GitHubMark() {
   return (
     <svg viewBox="0 0 16 16" aria-hidden="true" className="h-4 w-4 fill-current">