Merge pull request #3 from openairmx/donationHEADmain

Update donation methods

5 files changed, 121 insertions, 3 deletions

diff --git a/_sass/main.scss b/_sass/main.scss
index ac8d238..d87ab71 100644
--- a/_sass/main.scss
+++ b/_sass/main.scss
@@ -104,6 +104,11 @@ body {
   padding-inline: 1.5rem;
 }
 
+.site-main h2 {
+  font-size: 1.125rem;
+  margin-block-end: 1rem;
+}
+
 .site-main p {
   margin-block-end: 1.5rem;
 }
@@ -142,6 +147,24 @@ body {
   color: var(--color-neutral-50);
 }
 
+.site-main hr {
+  margin-block: 2rem;
+  background-color: var(--color-neutral-900);
+  border: 0;
+  height: 1px;
+}
+
+.site-main blockquote {
+  margin-block-start: 0.75rem;
+  padding-block: 0.75rem;
+  padding-inline: 1rem;
+  font-size: 0.875rem;
+  color: var(--color-neutral-300);
+  background-color: var(--color-neutral-900);
+  border-radius: 0.375rem;
+  overflow: hidden;
+}
+
 .site-footer {
   grid-area: footer;
   padding-inline: 1.5rem;
@@ -183,3 +206,50 @@ body {
     align-items: center;
   }
 }
+
+.donation {
+  margin-block-end: 2rem;
+
+  @media (min-width: 48rem) {
+    width: 40%;
+    margin-inline-start: 2rem;
+    float: right;
+  }
+}
+
+.donation-details {
+  margin-top: 1rem;
+  background-color: var(--color-neutral-900);
+  border: 1px solid var(--color-neutral-800);
+  border-radius: 0.5rem;
+}
+
+.donation-summary {
+  display: flex;
+  align-items: center;
+  padding-block: 1rem;
+  padding-inline: 1rem;
+  gap: 0.5rem;
+  font-weight: 500;
+  font-size: 0.875rem;
+  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='none' viewBox='0 0 16 16'%3E%3Cpath fill='%23737373' fill-rule='evenodd' d='M4.22 6.222a.75.75 0 0 1 1.06 0L8 8.942l2.72-2.72a.75.75 0 1 1 1.06 1.06l-3.25 3.25a.75.75 0 0 1-1.06 0l-3.25-3.25a.75.75 0 0 1 0-1.06' clip-rule='evenodd'/%3E%3C/svg%3E");
+  background-position: right 1rem top 50%;
+  background-repeat: no-repeat;
+  list-style: none;
+  cursor: pointer;
+}
+
+.donation-summary + p {
+  padding: 1rem;
+}
+
+.donation-details[open] .donation-summary {
+  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='none' viewBox='0 0 16 16'%3E%3Cpath fill='%23737373' fill-rule='evenodd' d='M11.78 9.783a.75.75 0 0 1-1.06 0L8 7.063l-2.72 2.72a.75.75 0 1 1-1.06-1.06l3.25-3.25a.75.75 0 0 1 1.06 0l3.25 3.25a.75.75 0 0 1 0 1.06' clip-rule='evenodd'/%3E%3C/svg%3E");
+  border-bottom: 1px solid var(--color-neutral-800);
+}
+
+.donation-note {
+  margin-block-start: 1rem;
+  font-size: 0.875rem;
+  color: var(--color-neutral-600);
+}
diff --git a/assets/images/donation-qrcode-alipay.jpg b/assets/images/donation-qrcode-alipay.jpg
new file mode 100644
index 0000000..7c3a30c
--- /dev/null
+++ b/assets/images/donation-qrcode-alipay.jpg
diff --git a/assets/images/donation-qrcode-wechat.jpg b/assets/images/donation-qrcode-wechat.jpg
new file mode 100644
index 0000000..2a3e689
--- /dev/null
+++ b/assets/images/donation-qrcode-wechat.jpg
diff --git a/index.markdown b/index.markdown
index 1988a40..bf820cc 100644
--- a/index.markdown
+++ b/index.markdown
@@ -29,9 +29,9 @@ provide dedicated repositories for:
 
 The project scope has expanded significantly beyond our initial expectations.
 We are open-source enthusiasts and do not have any affiliation with
-AIRMX—The company. The project is managed by a software engineer and a
-UI designer. If you appreciate our work, we would be grateful for your support
-through GitHub Sponsors or PayPal. Your generosity means a lot to us.
+AIRMX—The company. The project is managed by a software engineer—Zhineng and a
+UI designer—Shiyun. If you appreciate our work, we would be grateful for your
+support through [WeChat or Alipay][support]. Your generosity means a lot to us.
 
 If you have any questions or just want to say hello, please feel free to
 send us a message at [[email protected]][contact-email].
@@ -40,4 +40,5 @@ send us a message at [[email protected]][contact-email].
 [setup-page]: https://github.com/openairmx/setup
 [airmx]: https://github.com/openairmx/airmx
 [homebridge-airmx]: https://github.com/openairmx/homebridge-airmx
+[support]: /wall-of-love
 [contact-email]: mailto:[email protected]
diff --git a/wall-of-love.markdown b/wall-of-love.markdown
index 86ca867..85292a4 100644
--- a/wall-of-love.markdown
+++ b/wall-of-love.markdown
@@ -5,5 +5,52 @@ layout: default
 Big thanks to everyone keeping this project alive and breathing. You’re the
 real reason the fans are still spinning.
 
+<section class="donation">
+    <h2>
+        Love our work? Buy us a coffee!
+    </h2>
+    <details class="donation-details" name="qrcodes" open>
+        <summary class="donation-summary">
+            <svg xmlns="http://www.w3.org/2000/svg" width="14" height="14" fill="none" viewBox="0 0 14 14" class="donation-icon">
+                <path fill="#1aad19" d="M5.091 8.703a.45.45 0 0 1-.21.052.46.46 0 0 1-.407-.248l-.03-.07-1.275-2.904a.3.3 0 0 1-.022-.102c0-.134.105-.242.234-.242q.079.002.14.048l1.503 1.112a.68.68 0 0 0 .622.074l7.072-3.27C11.45 1.604 9.362.589 7 .589 3.134.588 0 3.3 0 6.647c0 1.825.943 3.468 2.419 4.579a.49.49 0 0 1 .17.549l-.314 1.222c-.015.057-.038.117-.038.177 0 .134.104.243.233.243.051 0 .092-.02.135-.046l1.533-.918a.7.7 0 0 1 .371-.112.7.7 0 0 1 .206.032A8 8 0 0 0 7 12.705c3.866 0 7-2.712 7-6.058 0-1.014-.29-1.968-.797-2.808l-8.06 4.833z"/>
+            </svg>
+            WeChat
+        </summary>
+        <p>
+            <img
+                src="{{ '/assets/images/donation-qrcode-wechat.jpg' | relative_url }}"
+                alt="Donate via WeChat"
+                width="128"
+                height="128"
+            />
+        </p>
+    </details>
+    <details class="donation-details" name="qrcodes">
+        <summary class="donation-summary">
+            <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="none" viewBox="0 0 16 16">
+                <path fill="#1677ff" d="M12.758 1.502H3.243A2.243 2.243 0 0 0 1 3.745v9.515a2.243 2.243 0 0 0 2.243 2.242h9.515A2.24 2.24 0 0 0 15 13.26V3.745a2.24 2.24 0 0 0-2.242-2.243"/>
+                <path fill="#fff" d="M12.527 10.294c-.56-.188-1.312-.475-2.15-.778.503-.875.905-1.87 1.17-2.952h-2.76V5.57h3.38v-.555h-3.38V3.358h-1.38c-.242 0-.242.238-.242.238v1.418H3.747v.555h3.418v.994H4.342v.554h5.475c-.2.69-.47 1.34-.788 1.928-1.776-.586-3.673-1.06-4.863-.768-.762.187-1.252.522-1.54.873-1.323 1.61-.375 4.053 2.418 4.053 1.652 0 3.243-.92 4.476-2.437 1.84.883 5.48 2.402 5.48 2.402v-2.164s-.456-.036-2.473-.71m-7.743 1.974c-2.178 0-2.823-1.715-1.746-2.654.36-.317 1.016-.472 1.365-.506 1.293-.127 2.491.366 3.905 1.056-.993 1.295-2.259 2.104-3.524 2.104"/>
+            </svg>
+            Alipay
+        </summary>
+        <p>
+            <img
+                src="{{ '/assets/images/donation-qrcode-alipay.jpg' | relative_url }}"
+                alt="Donate via Alipay"
+                width="128"
+                height="128"
+            />
+        </p>
+    </details>
+    <p class="donation-note">
+        The thank-you list is tracked manually, and we will process your
+        donation within 3 days. Thank you for your support and patience.
+    </p>
+</section>
+
+---
+
+## Recent Supporters
+
 - **王同学。** — ¥66.00 via _Alipay_ on _October 5th, 2025_
 - **吴**** — Donated a front panel on _December 15th, 2024_