Jelajahi Sumber

update docs

Yuki Takei 3 bulan lalu
induk
melakukan
bef581e025

+ 20 - 7
.serena/memories/apps-app-page-path-nav-and-sub-navigation-layering.md

@@ -47,9 +47,9 @@ PageControls と切り離して独立した z-index 層として扱えるよう
 これにより、GroundGlassBar → PagePathNav → PageControls という
 理想的なレイヤー構造を実現できた。
 
-## 未解決の問題(要調査
+## CopyDropdown が z-2 で動作しない理由(解決済み
 
-### CopyDropdown が z-2 で動作しない問題
+### 問題
 
 `PagePathNavSticky.tsx` の sticky 時の z-index について:
 
@@ -61,12 +61,25 @@ innerActiveClass="active z-2 mt-1"
 innerActiveClass="active z-3 mt-1"
 ```
 
-**原因は不明。** 将来的に調査が必要。
+### 原因
+
+1. `GrowiContextualSubNavigation` の sticky-inner-wrapper は `z-3` かつ横幅いっぱい(Flex アイテム)
+2. この要素が PagePathNavSticky(`z-2`)の上に重なる
+3. CopyDropdown は `.grw-page-path-nav-layout:hover` で `visibility: visible` になる仕組み
+   (参照: `PagePathNavLayout.module.scss`)
+4. **z-3 の要素が上に被さっているため、hover イベントが PagePathNavSticky に届かない**
+5. 結果、CopyDropdown のアイコンが表示されない
+
+### なぜ z-3 で動作するか
+
+- 同じ z-index: 3 になるため、DOM 順序で前後が決まる
+- PagePathNavSticky は GrowiContextualSubNavigation より後にレンダリングされるため前面に来る
+- hover イベントが正常に届き、CopyDropdown が表示される
+
+### 結論
 
-考えられる可能性:
-- CopyDropdown のドロップダウンメニュー自体の z-index との関係
-- 他の要素が z-2 で被さっている可能性
-- GrowiContextualSubNavigation の nav 要素(z-3)との干渉
+PagePathNavSticky の sticky 時の z-index は `z-3` である必要がある。
+これは GrowiContextualSubNavigation と同じ層に置くことで、DOM 順序による前後関係を利用するため。
 
 ## 関連ファイル
 

+ 1 - 1
apps/app/src/client/components/Navbar/GrowiContextualSubNavigation.tsx

@@ -396,7 +396,7 @@ const GrowiContextualSubNavigation = (props: GrowiContextualSubNavigationProps):
         className="z-3"
         enabled={!isPrinting}
         onStateChange={status => setStickyActive(status.status === Sticky.STATUS_FIXED)}
-        innerActiveClass="w-100 end-0"
+        innerActiveClass="end-0"
       >
         <nav
           className={`${moduleClass} ${minHeightSubNavigation}