generated at
●マウスオーバーでインデントレベルを表示する

動機
自分で書いていてどこから分岐しているのかわからなくなることがある
読んでいる方は尚更わからないであろうと予想される
しかし、バレットの見た目を派手にしたくない(個人的なこだわり)

挙動
バレットをマウスオーバーするとインデントレベルが横に青字で表示される
スマホの場合はバレットをタップすれば表示される(多分)

備考
位置の設定とかは適当
ご使用になる場合は適宜調節したりもっと良い書き方に変えたりしてください

style.css
.line .indent-mark .dot:hover::before { position: relative; top: -11px; right: 18px; font-weight: 600; color: blue; } .line .indent-mark .c-0 + .dot:hover::before { content: '1'; } .line .indent-mark .c-1 + .dot:hover::before { content: '2'; } .line .indent-mark .c-2 + .dot:hover::before { content: '3'; } .line .indent-mark .c-3 + .dot:hover::before { content: '4'; } .line .indent-mark .c-4 + .dot:hover::before { content: '5'; } .line .indent-mark .c-5 + .dot:hover::before { content: '6'; } .line .indent-mark .c-6 + .dot:hover::before { content: '7'; } .line .indent-mark .c-7 + .dot:hover::before { content: '8'; }