From 0697b144110e8849365a8467e549a6809e78cd3a Mon Sep 17 00:00:00 2001
From: Trent Larson <trent@trentlarson.com>
Date: Thu, 18 Dec 2025 08:30:07 -0700
Subject: [PATCH] refactor: change word on first button to "Thank", and center
 on button when it drops down

---
 src/views/HomeView.vue        | 41 +++++++++++++++++++++++++++++++++--
 src/views/UserProfileView.vue |  3 ++-
 2 files changed, 41 insertions(+), 3 deletions(-)

diff --git a/src/views/HomeView.vue b/src/views/HomeView.vue
index fad66ed2..033956ea 100644
--- a/src/views/HomeView.vue
+++ b/src/views/HomeView.vue
@@ -111,21 +111,24 @@ Raymer * @version 1.0.0 */
           <!-- Record Quick-Action -->
           <div class="mb-6">
             <div class="flex gap-2 items-center mb-2">
+              <!-- eslint-disable prettier/prettier max-len -->
               <button
                 type="button"
                 :class="[
                   'text-center text-base uppercase bg-gradient-to-b from-green-400 to-green-700 shadow-[inset_0_-1px_0_0_rgba(0,0,0,0.5)] text-white flex items-center justify-center gap-2 transition-all duration-300 rounded-full',
                   isScrolled
-                    ? 'fixed bottom-10 left-6 p-4 w-14 h-14 z-50'
+                    ? 'fixed bottom-10 p-4 w-14 h-14 z-50'
                     : 'px-4 py-3',
                 ]"
+                :style="isScrolled ? getButtonPosition() : {}"
                 @click="openPersonDialog()"
               >
                 <font-awesome icon="plus" />
                 <span v-if="!isScrolled" class="transition-opacity duration-300"
-                  >Thanks!</span
+                  >Thank</span
                 >
               </button>
+              <!-- eslint-enable prettier/prettier -->
               <button
                 class="block ms-auto text-sm text-center text-white bg-gradient-to-b from-slate-400 to-slate-700 shadow-[inset_0_-1px_0_0_rgba(0,0,0,0.5)] p-1.5 rounded-full"
                 @click="openGiftedPrompts()"
@@ -1962,5 +1965,39 @@ export default class HomeView extends Vue {
   get isUserRegistered() {
     return this.isRegistered;
   }
+
+  /**
+   * Calculates the horizontal position for the button to align with house button center
+   */
+  getButtonPosition() {
+    const quickNav = document.getElementById("QuickNav");
+    if (!quickNav) {
+      return { left: "1.5rem" }; // Fallback to left-6
+    }
+
+    const navList = quickNav.querySelector("ul");
+    if (!navList) {
+      return { left: "1.5rem" };
+    }
+
+    // Get the first nav item (house button)
+    const firstItem = navList.querySelector("li:first-child");
+    if (!firstItem) {
+      return { left: "1.5rem" };
+    }
+
+    const itemRect = firstItem.getBoundingClientRect();
+    const buttonWidth = 56; // w-14 = 3.5rem = 56px
+
+    // Calculate center of house button
+    const houseButtonCenter = itemRect.left + itemRect.width / 2;
+
+    // Position button so its center aligns with house button center
+    const buttonLeft = houseButtonCenter - buttonWidth / 2;
+
+    return {
+      left: `${buttonLeft}px`,
+    };
+  }
 }
 </script>
diff --git a/src/views/UserProfileView.vue b/src/views/UserProfileView.vue
index 86775c49..5e0cde46 100644
--- a/src/views/UserProfileView.vue
+++ b/src/views/UserProfileView.vue
@@ -58,7 +58,8 @@
       <div
         v-if="
           profile.issuerDid !== activeDid && // only show neighbors if they're not current user
-          profile.issuerDid !== neighbors?.[0]?.did // and they're not directly connected (since there's no in-between)
+          profile.issuerDid !== neighbors?.[0]?.did // and they're not directly connected
+          // (which we know because there is no neighbor in-between them)
         "
         class="mt-6"
       >