Add project donation links

README.md

@@ -13,6 +13,11 @@
   Please report findings in <a href="https://github.com/snapetech/slskr">snapetech/slskr</a> or join the
   <a href="https://discord.gg/5PyXBfvS6T">Discord</a>.
 </p>
+<p align="center">
+  Support slskdN development through
+  <a href="https://www.paypal.com/donate/?business=donations%40snape.tech">PayPal</a> or
+  <a href="https://ko-fi.com/snapetech">Ko-fi</a>.
+</p>
 <p align="center">
   <a href="https://github.com/snapetech/slskdn/releases">Releases</a> •
   <a href="https://github.com/snapetech/slskr">Rust Rewrite Preview</a> •

docs/CHANGELOG.md

@@ -22,6 +22,8 @@ For dev or build tags, use the same logical version string embedded in the tag.
 
 ## [Unreleased]
 
+- The web footer and README now offer direct PayPal and Ko-fi links for
+  supporting slskdN development.
 - GitLab CI configuration now keeps the Arch package-smoke sudoers command as
   a string scalar, and performance-test dependencies align with the runtime
   graph so GitLab pipeline creation and GitHub dependency submission succeed.

src/web/src/components/Shared/Footer.css

@@ -66,6 +66,7 @@
     white-space: nowrap;
 }
 
+.slskdn-footer-support,
 .slskdn-footer-sponsor,
 .slskdn-footer-logo,
 .slskdn-footer-build,
@@ -108,7 +109,11 @@
     display: inline-flex;
     align-items: center;
     justify-content: center;
-    gap: 6px;
+    gap: 5px;
+    padding: 4px 7px;
+    border: 1px solid rgba(158, 114, 255, 0.28);
+    border-radius: 999px;
+    background: rgba(158, 114, 255, 0.08);
     line-height: 1;
     color: rgba(238, 233, 227, 0.78);
     text-decoration: none;
@@ -120,6 +125,17 @@
     text-shadow: 0 0 8px rgba(255, 121, 168, 0.42);
 }
 
+.slskdn-footer-support {
+    display: inline-flex;
+    align-items: center;
+    gap: 5px;
+}
+
+.slskdn-footer-sponsor.ko-fi {
+    border-color: rgba(255, 121, 168, 0.3);
+    background: rgba(255, 121, 168, 0.08);
+}
+
 .slskdn-footer-sponsor .icon {
     align-items: center;
     color: #ff79a8;
@@ -441,6 +457,8 @@ html:not(.dark) .slskdn-footer-stat-icon {
 
 html:not(.dark) .slskdn-footer-sponsor {
     color: rgba(39, 35, 32, 0.62);
+    background: rgba(111, 87, 150, 0.07);
+    border-color: rgba(111, 87, 150, 0.22);
 }
 
 html:not(.dark) .slskdn-footer-sponsor:hover,

src/web/src/components/Shared/Footer.jsx

@@ -274,15 +274,26 @@ class Footer extends Component {
                 />
               </a>
 
-              <a
-                className="slskdn-footer-sponsor"
-                href="https://github.com/sponsors/snapetech"
-                rel="noopener noreferrer"
-                target="_blank"
-                title="Support development - because Cursor isn't cheap!"
-              >
-                <Icon name="heart" /> Donate
-              </a>
+              <span className="slskdn-footer-support" aria-label="Support slskdN development">
+                <a
+                  className="slskdn-footer-sponsor"
+                  href="https://www.paypal.com/donate/?business=donations%40snape.tech"
+                  rel="noopener noreferrer"
+                  target="_blank"
+                  title="Support slskdN development with PayPal"
+                >
+                  <Icon name="paypal" /> PayPal
+                </a>
+                <a
+                  className="slskdn-footer-sponsor ko-fi"
+                  href="https://ko-fi.com/snapetech"
+                  rel="noopener noreferrer"
+                  target="_blank"
+                  title="Support slskdN development on Ko-fi"
+                >
+                  <Icon name="coffee" /> Ko-fi
+                </a>
+              </span>
 
               <span className="slskdn-footer-copyright">
                 © {year}{' '}

src/web/src/components/Shared/Footer.test.jsx

@@ -81,6 +81,14 @@ describe('Footer', () => {
     expect(screen.getByText('1 swarm')).toBeInTheDocument();
     expect(screen.getByText('backfill')).toBeInTheDocument();
     expect(screen.getByText('+2')).toBeInTheDocument();
+    expect(screen.getByRole('link', { name: /PayPal/i })).toHaveAttribute(
+      'href',
+      'https://www.paypal.com/donate/?business=donations%40snape.tech',
+    );
+    expect(screen.getByRole('link', { name: /Ko-fi/i })).toHaveAttribute(
+      'href',
+      'https://ko-fi.com/snapetech',
+    );
   });
 
   it('renders build info and checks for updates when logged out', async () => {