update sibling view ui

This commit is contained in:
celeste 2023-04-05 21:00:32 -07:00
parent e946b0de20
commit 8948b8386f
2 changed files with 17 additions and 8 deletions

14
main.ts
View file

@ -1860,15 +1860,19 @@ class LoomSiblingsView extends ItemView {
return;
}
const siblings = Object.entries(state.nodes).filter(([, node]) => node.parentId === state.nodes[state.current].parentId);
const parentId = state.nodes[state.current].parentId;
const siblings = Object.entries(state.nodes).filter(([, node]) => node.parentId === parentId);
for (const i in siblings) {
const [id, node] = siblings[i];
const siblingDiv = outline.createEl("div", { cls: "loom-sibling" });
siblingDiv.createEl("span", {
text: "…",
cls: "loom-sibling-ellipsis",
const siblingDiv = outline.createEl("div", {
cls: `loom-sibling${id === state.current ? " is-active" : ""}`,
});
if (parentId !== null)
siblingDiv.createEl("span", {
text: "…",
cls: "loom-sibling-ellipsis",
});
siblingDiv.createEl("span", { text: node.text.trim() });
siblingDiv.addEventListener("click", () => this.app.workspace.trigger("loom:switch-to", id));

View file

@ -267,19 +267,24 @@
.loom-sibling {
color: var(--nav-item-color);
font-size: 0.9em;
line-height: 1.3;
padding: 0.6em 0.6em;
white-space: pre-wrap;
cursor: pointer;
}
.loom-sibling:hover {
color: var(--nav-item-color-active);
}
.loom-sibling.is-active {
background-color: var(--nav-item-background-active);
color: var(--nav-item-color-active);
}
.loom-sibling-divider {
margin: 1.2em 0;
margin: 0;
}
.loom-sibling-ellipsis {