fix: open the card menu from the three-dot button

Anchor the activity and deal menus to the button so they show beside the card.

Co-authored-by: Cursor <cursoragent@cursor.com>

apps/web/src/components/pipeline/DealCard.vue

@@ -152,23 +152,27 @@ const cardStyle = computed(() => ({
           </a-typography-text>
         </div>
 
-        <a-button
-          v-if="showTrash"
-          type="text"
-          danger
-          aria-label="حذف انتخاب‌شده‌ها"
-          @click.stop="emit('bulkDelete')"
-        >
-          <template #icon><DeleteOutlined /></template>
-        </a-button>
-        <a-button
-          v-else
-          type="text"
-          :aria-label="copy.itemMenuAria"
-          @click.stop="emit('menu', deal.id)"
-        >
-          <template #icon><MoreOutlined /></template>
-        </a-button>
+        <span :data-card-id="deal.id">
+          <a-button
+            v-if="showTrash"
+            class="menu"
+            type="text"
+            danger
+            aria-label="حذف انتخاب‌شده‌ها"
+            @click.stop="emit('bulkDelete')"
+          >
+            <template #icon><DeleteOutlined /></template>
+          </a-button>
+          <a-button
+            v-else
+            class="menu"
+            type="text"
+            :aria-label="copy.itemMenuAria"
+            @click.stop="emit('menu', deal.id)"
+          >
+            <template #icon><MoreOutlined /></template>
+          </a-button>
+        </span>
       </a-flex>
 
       <a-flex

apps/web/src/components/pipeline/PipelineList.vue

@@ -219,23 +219,27 @@ onUnmounted(() => {
             </a-space>
           </template>
           <template v-else-if="column.key === 'actions'">
-            <a-button
-              v-if="selectMode && selectedIds.has(record.deal.id)"
-              type="text"
-              danger
-              aria-label="حذف انتخاب‌شده‌ها"
-              @click.stop="emit('bulkDelete')"
-            >
-              <template #icon><DeleteOutlined /></template>
-            </a-button>
-            <a-button
-              v-else
-              type="text"
-              :aria-label="copy.itemMenuAria"
-              @click.stop="emit('menuDeal', record.deal.id)"
-            >
-              <template #icon><MoreOutlined /></template>
-            </a-button>
+            <span :data-card-id="record.deal.id">
+              <a-button
+                v-if="selectMode && selectedIds.has(record.deal.id)"
+                class="menu"
+                type="text"
+                danger
+                aria-label="حذف انتخاب‌شده‌ها"
+                @click.stop="emit('bulkDelete')"
+              >
+                <template #icon><DeleteOutlined /></template>
+              </a-button>
+              <a-button
+                v-else
+                class="menu"
+                type="text"
+                :aria-label="copy.itemMenuAria"
+                @click.stop="emit('menuDeal', record.deal.id)"
+              >
+                <template #icon><MoreOutlined /></template>
+              </a-button>
+            </span>
           </template>
         </template>
       </a-table>
@@ -299,17 +303,25 @@ onUnmounted(() => {
                 {{ row.deal.description }}
               </a-typography-text>
             </div>
-            <a-button
-              v-if="selectMode && selectedIds.has(row.deal.id)"
-              type="text"
-              danger
-              @click.stop="emit('bulkDelete')"
-            >
-              <template #icon><DeleteOutlined /></template>
-            </a-button>
-            <a-button v-else type="text" @click.stop="emit('menuDeal', row.deal.id)">
-              <template #icon><MoreOutlined /></template>
-            </a-button>
+            <span :data-card-id="row.deal.id">
+              <a-button
+                v-if="selectMode && selectedIds.has(row.deal.id)"
+                class="menu"
+                type="text"
+                danger
+                @click.stop="emit('bulkDelete')"
+              >
+                <template #icon><DeleteOutlined /></template>
+              </a-button>
+              <a-button
+                v-else
+                class="menu"
+                type="text"
+                @click.stop="emit('menuDeal', row.deal.id)"
+              >
+                <template #icon><MoreOutlined /></template>
+              </a-button>
+            </span>
           </a-flex>
           <a-tag
             :bordered="false"

apps/web/src/views/ActivitiesView.vue

@@ -2214,7 +2214,7 @@ time.note {
 
 .menu-pop {
   position: fixed;
-  z-index: 80;
+  z-index: 1200;
   background: #fff;
   border: 1px solid var(--line, #e2e8f0);
   border-radius: var(--radius);

apps/web/src/views/PipelineBoardView.vue

@@ -821,6 +821,7 @@ defineExpose({ updateDealStage: applyUpdateDealStage });
     <Teleport to="body">
       <div
         v-if="menuOpenId"
+        class="menu-pop"
         :style="{
           position: 'fixed',
           zIndex: 1080,