From 5e0824022c1d432cda0fcb449074e45f3a0ee2ad Mon Sep 17 00:00:00 2001
From: wukko <me@wukko.me>
Date: Fri, 9 Aug 2024 21:04:56 +0600
Subject: [PATCH] web/DonateShareCard: add alt text for qr code

---
 web/i18n/en/a11y/donate.json                     | 4 ++++
 web/src/components/donate/DonateShareCard.svelte | 6 +++++-
 2 files changed, 9 insertions(+), 1 deletion(-)
 create mode 100644 web/i18n/en/a11y/donate.json

diff --git a/web/i18n/en/a11y/donate.json b/web/i18n/en/a11y/donate.json
new file mode 100644
index 00000000..625eee91
--- /dev/null
+++ b/web/i18n/en/a11y/donate.json
@@ -0,0 +1,4 @@
+{
+    "share.qr.expand": "qr code. press to expand.",
+    "share.qr.collapse": "expanded qr code. press to collapse."
+}
diff --git a/web/src/components/donate/DonateShareCard.svelte b/web/src/components/donate/DonateShareCard.svelte
index 99be5eee..5bece3ce 100644
--- a/web/src/components/donate/DonateShareCard.svelte
+++ b/web/src/components/donate/DonateShareCard.svelte
@@ -40,6 +40,9 @@
             on:click={() => {
                 expanded = !expanded;
             }}
+            aria-label={$t(
+                `a11y.donate.share.qr.${expanded ? "collapse" : "expand"}`
+            )}
         >
             <CobaltQr />
         </button>
@@ -228,7 +231,8 @@
         :global(#share-box.expanded) {
             margin-bottom: unset;
             z-index: unset;
-            box-shadow: 0 0 0 2px rgba(255, 255, 255, var(--donate-border-opacity)) inset;
+            box-shadow: 0 0 0 2px
+                rgba(255, 255, 255, var(--donate-border-opacity)) inset;
             transition: none;
         }
     }