From 81158cb4ca2fc79d794adf37eaf01eab8d845e9c Mon Sep 17 00:00:00 2001
From: Yoshihiro OKUMURA <orrisroot@gmail.com>
Date: Tue, 15 Sep 2026 18:27:17 +0900
Subject: [PATCH] fix: draw the index tree lines at the right depth
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

The index tree has a single root, so its first indent unit is always
marked as an end and every line was shifted one column to the right,
doubling the vertical line under the root. Hide that unit and draw the
node's own branch (├ or └) after the indent from the leaf-last class,
as nimg.neuroinf.jp already does.
---
 src/database/blocks/IndexTree.module.css | 27 +++++++++++++++++-------
 1 file changed, 19 insertions(+), 8 deletions(-)

diff --git a/src/database/blocks/IndexTree.module.css b/src/database/blocks/IndexTree.module.css
index 23190b7..7cd838d 100644
--- a/src/database/blocks/IndexTree.module.css
+++ b/src/database/blocks/IndexTree.module.css
@@ -43,26 +43,37 @@
     display: inline-block;
     height: 20px;
     width: 9px;
-    background: url(../assets/images/tree_line.png);
+    background: url(../assets/images/tree_line.png) no-repeat -18px 0;
 }
-.indexTree:global(.rc-tree .rc-tree-treenode .rc-tree-indent .rc-tree-indent-unit:not(:last-child)) {
+/* treeData has a single root, so the first indent unit never carries a line. */
+.indexTree:global(.rc-tree .rc-tree-treenode .rc-tree-indent .rc-tree-indent-unit:first-child) {
+    display: none;
+}
+.indexTree:global(.rc-tree .rc-tree-treenode .rc-tree-indent .rc-tree-indent-unit:not(.rc-tree-indent-unit-end)) {
     background-position: -9px 0;
 }
-.indexTree:global(
-    .rc-tree .rc-tree-treenode .rc-tree-indent .rc-tree-indent-unit:not(:last-child).rc-tree-indent-unit-end
-) {
-    background-position: -18px 0;
+/* The node's own branch (├ or └) is drawn after the indent units. */
+.indexTree:global(.rc-tree .rc-tree-treenode .rc-tree-indent)::after {
+    content: "";
+    display: inline-block;
+    vertical-align: bottom;
+    height: 20px;
+    width: 9px;
+    background: url(../assets/images/tree_line.png) no-repeat 0 0;
 }
-.indexTree:global(.rc-tree .rc-tree-treenode .rc-tree-indent .rc-tree-indent-unit:last-child.rc-tree-indent-unit-end) {
+.indexTree:global(.rc-tree .rc-tree-treenode.rc-tree-treenode-leaf-last .rc-tree-indent)::after {
     background-position: -27px 0;
 }
+.indexTree:global(.rc-tree .rc-tree-treenode:first-child .rc-tree-indent)::after {
+    display: none;
+}
 
 .indexTree:global(.rc-tree .rc-tree-treenode .rc-tree-switcher) {
     display: inline-block;
     height: 20px;
     width: 16px;
     margin-right: 2px;
-    background: url(../assets/images/tree_node.png);
+    background: url(../assets/images/tree_node.png) no-repeat;
     cursor: pointer;
 }
 .indexTree:global(.rc-tree .rc-tree-treenode:first-child .rc-tree-switcher.rc-tree-switcher-noop) {