From efe5bcee8a4cc4db487c8b0914f5e0909a580b17 Mon Sep 17 00:00:00 2001
From: Momentry Studio <admin@momentry.local>
Date: Fri, 30 Oct 2026 18:59:19 +0800
Subject: [PATCH] fix: move face detail nav arrows outside modal overlay

- Moved .ms-fs-nav-arrow buttons outside .ms-modal-overlay div
- Updated z-index to dynamic faceDetailZIndex + 100
- Fixes stacking context issue where arrows were unclickable
- Arrows now render as siblings of overlay with proper z-index
---
 src/views/PeopleView.vue | 14 +++++++-------
 1 file changed, 7 insertions(+), 7 deletions(-)

diff --git a/src/views/PeopleView.vue b/src/views/PeopleView.vue
index 8c748c6..a856d88 100644
--- a/src/views/PeopleView.vue
+++ b/src/views/PeopleView.vue
@@ -295,14 +295,14 @@
 
     <!-- Assign modal -->
     <!-- Face detail modal -->
+    <!-- Side navigation arrows - outside overlay for proper z-index stacking -->
+    <button v-if="faceDetailModal.show && canFaceDetailPrev" class="ms-fs-nav-arrow ms-fs-nav-prev" @click="goFaceDetailPrev" title="Previous FS (←)" :style="{ zIndex: faceDetailZIndex + 100 }">
+      <svg width="24" height="24" viewBox="0 0 24 24" fill="none"><polyline points="15 18 9 12 15 6" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/></svg>
+    </button>
+    <button v-if="faceDetailModal.show && canFaceDetailNext" class="ms-fs-nav-arrow ms-fs-nav-next" @click="goFaceDetailNext" title="Next FS (→)" :style="{ zIndex: faceDetailZIndex + 100 }">
+      <svg width="24" height="24" viewBox="0 0 24 24" fill="none"><polyline points="9 18 15 12 9 6" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/></svg>
+    </button>
     <div v-if="faceDetailModal.show" class="ms-modal-overlay show" :style="{ zIndex: faceDetailZIndex }" @click.self="faceDetailModal.show = false">
-      <!-- Side navigation arrows -->
-      <button v-if="canFaceDetailPrev" class="ms-fs-nav-arrow ms-fs-nav-prev" @click="goFaceDetailPrev" title="Previous FS (←)">
-        <svg width="24" height="24" viewBox="0 0 24 24" fill="none"><polyline points="15 18 9 12 15 6" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/></svg>
-      </button>
-      <button v-if="canFaceDetailNext" class="ms-fs-nav-arrow ms-fs-nav-next" @click="goFaceDetailNext" title="Next FS (→)">
-        <svg width="24" height="24" viewBox="0 0 24 24" fill="none"><polyline points="9 18 15 12 9 6" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/></svg>
-      </button>
       <div class="ms-modal ms-modal-face-detail">
         <button class="ms-fm-icon-btn close-btn" @click="faceDetailModal.show = false" title="Close (Esc)">×</button>
         <button class="ms-fm-icon-btn fs-delete-btn" @click="deleteCurrentFace" title="Delete this FS">