【已解决】css怎么写才能让渲染后的标题单独缩进?

我在用 border 主题配合 style settings 插件使用。原主题的标题左侧的指示器,是统一开关的,我想要每个层级标题单独开关,就自己简单改了一下。

但是我这样改完以后,在编辑模式下,标题没法单独跟随指示器的出现而缩进了。如图,关掉指示器后,标题并没有跟着去掉缩进。编辑模式下却是可以的。
如果直接删掉缩进这段,标题文字跟指示器就挤在一起了,也不好。


代码放在下面了(注释是 gpt 加的),请大佬帮忙看看要怎么修改?

(h2 类名为 .h2-indicator-on,h3 类名为 .h3-indicator-on,依此类推)

/* 1. 设置基础样式,默认没有缩进 */
.markdown-rendered>:is(h1, h2, h3, h4, h5, h6),
.markdown-preview-sizer>div>:is(h1, h2, h3, h4, h5, h6) {
    position: relative;
    text-indent: 0; /* 默认无缩进 */
}

/* 2. 仅当存在 -indicator-on 类时,添加缩进 */
[class*="-indicator-on"] .markdown-rendered>:is(h1, h2, h3, h4, h5, h6),
[class*="-indicator-on"] .markdown-preview-sizer>div>:is(h1, h2, h3, h4, h5, h6) {
    text-indent: 9px; /* 有指示符时缩进 */
}

/* 3. 伪元素样式 */
.h1-indicator-on .markdown-rendered>h1::before,
.h1-indicator-on .markdown-preview-sizer>div>h1::before {
  margin-right: 6px;
  content: " ";
  display: inline-block;
  width: 3px;
  height: calc(1.2em - 8px);
  border-radius: var(--radius-m);
  background-color: var(--h1-accent-color);
  position: absolute;
  top: 4px;
  left: 0px;
}

/* 插件设置项:*/
/* @settings

name: Editor
id: Editor
settings:
    - 
        id: Headings
        title: Headings
        title.zh: 标题
        type: heading
        collapsed: true
        level: 3
    -
        id: Indicators
        title: Indicators
        title.zh: 标题左侧指示器
        type: heading
        collapsed: true
        level: 4
    - 
        id: h1-indicator-on
        title: Enable headings indicator
        title.zh: 启用 H1 指示器
        type: class-toggle
        default: true
        
        ...依此类推
    - 
        id: h6-indicator-on
        title: Enable headings indicator
        title.zh: 启用 H6 指示器
        type: class-toggle
        default: true
*/

二编:把缩进拆开写就好了……每个标题都得单独写