我希望能把一级目录弄成红色字体，二级绿色，三级黄色。
一级目录，不见得是页面中的一级标题。
比如我的页面最高级别的标题是二级，那么在目录中的一级目录就是页面中的二级标题。
假如我的二级标题下方没有三级标题，直接是四级标题，则此四级标题就是二级目录。
如果四级标题上有三级标题，则四级标题是三级目录。
我用 AI 弄了半天，结果二级是红色，三级是绿色，四级是黄色。
/* --- 强制重置所有目录项颜色为默认值 --- */
.workspace-leaf-content[data-type="outline"] .tree-item-self .tree-item-inner {
color: var(--text-normal) !important;
}
/* --- 方案一：假设存在 data-heading-level 属性 ---
注意：此方法依赖于 Obsidian 是否真的生成了这些属性，
并且其值是否直接对应原始 Markdown 标题级别 (#, ##, ### ...)。
这不一定可靠，但值得一试。
*/
/* 原始 H1 -> 第一层级 (红色) - 不太常见于笔记正文开头 */
/* .workspace-leaf-content[data-type="outline"] .tree-item-self[data-heading-level="1"] .tree-item-inner {
color: red !important;
} */
/* 原始 H2 -> 如果是最高级，则视为第一层级 (红色) */
.workspace-leaf-content[data-type="outline"] .tree-item-self[data-heading-level="2"] .tree-item-inner {
color: red !important;
}
/* 原始 H3 -> 如果 H2 是最高级，则视为第二层级 (绿色) */
.workspace-leaf-content[data-type="outline"] .tree-item-self[data-heading-level="3"] .tree-item-inner {
color: green !important;
}
/* 原始 H4 -> 如果 H2/H3 是上级，则视为第三层级 (黄色) */
.workspace-leaf-content[data-type="outline"] .tree-item-self[data-heading-level="4"] .tree-item-inner {
color: yellow !important;
}
/* 可根据需要继续添加 H5, H6 */
/* --- 方案二：基于嵌套深度的精确匹配 (修正思路) ---
分析之前的失败原因：
`.tree-item-children > .tree-item:nth-child(n+2)` 可能仍然不对，
因为顶级列表可能就是从第一个 .tree-item 开始的。
正确的做法应该是直接匹配顶级列表的直接子元素。
*/
/* 获取包含大纲项目的主容器 */
/* .workspace-leaf-content[data-type="outline"] .tree-item-children */
/* --- 第一层级目录项 (红色) ---
匹配大纲容器下的 *所有* 直接子 tree-item。
这应该能选中视觉上的第一层。
*/
.workspace-leaf-content[data-type="outline"] .tree-item-children > .tree-item > .tree-item-self > .tree-item-inner {
color: red !important; /* 应用于第一层 */
}
/* --- 第二层级目录项 (绿色) ---
在第一层的基础上，再深入一层嵌套。
匹配第一层项目的子容器(.tree-item-children)下的直接子 tree-item。
*/
.workspace-leaf-content[data-type="outline"] .tree-item-children > .tree-item > .tree-item-children > .tree-item > .tree-item-self > .tree-item-inner {
color: green !important; /* 应用于第二层 */
}
/* --- 第三层级目录项 (黄色) ---
在第二层的基础上，再深入一层嵌套。
*/
.workspace-leaf-content[data-type="outline"] .tree-item-children > .tree-item > .tree-item-children > .tree-item > .tree-item-children > .tree-item > .tree-item-self > .tree-item-inner {
color: yellow !important; /* 应用于第三层 */
}
/* --- 备用方案：极其宽泛的尝试 ---
如果以上都不行，试试这个极其宽泛的选择器组合。
但这可能导致意外匹配，风险较高。
*/
/*
.workspace-leaf-content[data-type="outline"] .tree-item > .tree-item-self > .tree-item-inner { color: red !important; }
.workspace-leaf-content[data-type="outline"] .tree-item .tree-item .tree-item-self .tree-item-inner { color: green !important; }
.workspace-leaf-content[data-type="outline"] .tree-item .tree-item .tree-item .tree-item-self .tree-item-inner { color: yellow !important; }
*/
