Skip to content

fix(contextmenu): fix submenu hover gap — move bridge pseudo-element to parent li #45

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
a652 wants to merge 1 commit into
base: main
Choose a base branch
from
Open

fix(contextmenu): fix submenu hover gap — move bridge pseudo-element to parent li #45

Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
17 changes: 8 additions & 9 deletions packages/dmworkbase/src/Components/ContextMenus/index.css
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -122,15 +122,14 @@ body[theme-mode=dark] .wk-ctx-submenu {
display: block;
}

/* 隐形桥接：覆盖父项与子菜单之间的 4px 间隙，
防止鼠标对角线移动时短暂离开父 li 触发 :hover 失效、子菜单消失 */
.wk-ctx-submenu::before {
/* Bridge: extend the hover area of the parent li rightward to cover the 4px gap */
.wk-contextmenus li:has(> .wk-ctx-submenu)::after {
content: "";
position: absolute;
top: -4px;
bottom: -4px;
left: -8px;
top: 0;
right: -8px;
width: 8px;
height: 100%;
}

/* 子菜单向左展开（靠近右侧视口边缘时） */
Expand All @@ -139,9 +138,9 @@ body[theme-mode=dark] .wk-ctx-submenu {
right: calc(100% + 4px);
}

.wk-contextmenus-flip-submenu .wk-ctx-submenu::before {
left: auto;
right: -8px;
.wk-contextmenus-flip-submenu li:has(> .wk-ctx-submenu)::after {
right: auto;
left: -8px;
}

.wk-ctx-submenu li {
Expand Down
Loading