gaschz/trilium
1
0
Fork 0
mirror of https://github.com/zadam/trilium.git synced 2025-10-20 15:19:01 +02:00
Code Issues Actions 19 Packages Projects Releases Wiki Activity

client/menus: manage proper column breaking on Firefox

Browse Source
This commit is contained in:
Adorian Doran 2025-09-20 02:59:41 +03:00
parent daba190e74
commit 9a9edf16c4
2 changed files with 32 additions and 4 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

32
apps/client/src/menus/context_menu.ts
View File

@ -156,15 +156,32 @@ class ContextMenu {
}
addItems($parent: JQuery<HTMLElement>, items: MenuItem<any>[]) {
for (const item of items) {
let $group = $parent;
let shouldResetGroup = false; // If true, the next item will be the last one from the group
for (let index = 0; index < items.length; index++) {
const item = items[index];
if (!item) {
continue;
}
// If the next item is a separator or header, create a new group to avoid column breaks
// before and after the seaparator/header.
// This is a workaround for Firefox not supporting break-after: avoid on columns.
const nextItem = (index < items.length - 1) ? items[index + 1] : null;
if (!shouldResetGroup && nextItem && "kind" in nextItem) {
if (nextItem.kind === "separator" || nextItem.kind === "header") {
$group = $("<div class='dropdown-no-break'>");
$parent.append($group);
}
}
if ("kind" in item && item.kind === "separator") {
$parent.append($("<div>").addClass("dropdown-divider"));
$group.append($("<div>").addClass("dropdown-divider"));
shouldResetGroup = true;
} else if ("kind" in item && item.kind === "header") {
$parent.append($("<h6>").addClass("dropdown-header").text(item.title));
$group.append($("<h6>").addClass("dropdown-header").text(item.title));
shouldResetGroup = true;
} else {
const $icon = $("<span>");
@ -275,7 +292,14 @@ class ContextMenu {
$item.append($subMenu);
}
$parent.append($item);
$group.append($item);
// After adding a menu item, if the previous item was a separator or header,
// reset the group so that the next item will be appended directly to the parent.
if (shouldResetGroup) {
$group = $parent;
shouldResetGroup = false;
};
}
}
}

4
apps/client/src/stylesheets/style.css
View File

@ -472,6 +472,10 @@ body #context-menu-container .dropdown-item > span {
break-inside: avoid;
}
.dropdown-no-break {
break-inside: avoid;
}
.dropdown-item.disabled,
.dropdown-item.disabled kbd {
color: #aaa !important;