Merge branch 'ui-fixes-2025-06-w2'

src/views/AccountViewView.vue

@@ -44,12 +44,12 @@
       <div v-if="givenName">
         <h2 class="text-xl font-semibold mb-2">
           <span class="whitespace-nowrap">
-            <router-link
-              :to="{ name: 'contact-qr' }"
-              class="bg-slate-500 text-white px-1.5 py-1 rounded-md"
+            <button
+              class="bg-gradient-to-b from-slate-400 to-slate-700 shadow-[inset_0_-1px_0_0_rgba(0,0,0,0.5)] text-white px-1.5 py-1 mr-1 rounded-md"
+              @click="handleQRCodeClick"
             >
-              <font-awesome icon="qrcode" class="fa-fw text-xl"></font-awesome>
-            </router-link>
+              <font-awesome icon="qrcode" class="fa-fw text-xl" />
+            </button>
           </span>
           {{ givenName }}
           <router-link :to="{ name: 'new-edit-account' }">
@@ -206,12 +206,12 @@
         Before you can publicly announce a new project or time commitment, a
         friend needs to register you.
       </p>
-      <router-link
-        :to="{ name: 'contact-qr' }"
+      <button
         class="inline-block text-md bg-gradient-to-b from-blue-400 to-blue-700 shadow-[inset_0_-1px_0_0_rgba(0,0,0,0.5)] text-white px-4 py-2 rounded-md"
+        @click="handleQRCodeClick"
       >
         Share Your Info
-      </router-link>
+    </button>
     </div>
 
     <section
@@ -991,6 +991,7 @@ import { Component, Vue } from "vue-facing-decorator";
 import { RouteLocationNormalizedLoaded, Router } from "vue-router";
 import { useClipboard } from "@vueuse/core";
 import { LMap, LMarker, LTileLayer } from "@vue-leaflet/vue-leaflet";
+import { Capacitor } from "@capacitor/core";
 
 import EntityIcon from "../components/EntityIcon.vue";
 import ImageMethodDialog from "../components/ImageMethodDialog.vue";
@@ -2224,5 +2225,13 @@ export default class AccountViewView extends Vue {
       this.savingProfile = false;
     }
   }
+
+  private handleQRCodeClick() {
+    if (Capacitor.isNativePlatform()) {
+      this.$router.push({ name: "contact-qr-scan-full" });
+    } else {
+      this.$router.push({ name: "contact-qr" });
+    }
+  }
 }
 </script>