Polish export-html tree styling

- Add subtle border between sidebar and content
- Use selectedBg for tree node hover state
- Add left border accent for active and in-path nodes
This commit is contained in:
Mario Zechner 2026-01-01 03:46:08 +01:00
parent f53cabe1e3
commit c8c7e0fba4

View file

@ -37,6 +37,7 @@
position: sticky; position: sticky;
top: 0; top: 0;
height: 100vh; height: 100vh;
border-right: 1px solid var(--dim);
} }
.sidebar-header { .sidebar-header {
@ -110,17 +111,24 @@
} }
.tree-node:hover { .tree-node:hover {
background: rgba(128, 128, 128, 0.15); background: var(--selectedBg);
} }
.tree-node.active { .tree-node.active {
background: rgba(128, 128, 128, 0.2); background: var(--selectedBg);
border-left: 2px solid var(--accent);
padding-left: 6px;
} }
.tree-node.active .tree-content { .tree-node.active .tree-content {
font-weight: bold; font-weight: bold;
} }
.tree-node.in-path {
border-left: 2px solid var(--dim);
padding-left: 6px;
}
.tree-prefix { .tree-prefix {
color: var(--dim); color: var(--dim);
flex-shrink: 0; flex-shrink: 0;