Yoshitake
https://lh3.googleusercontent.com/a/ACg8ocISYEPjnYYpQpn3jJugKIkPgnPhm3BU1qvqsAKCMTlngYCP2u1_=s96-c#.png
山本祥武(よしたけ)
管理者
Google Cloud
Looker Customer Engineer
code:style.css
/* インデントレベルごとに行頭文字を切り替えるスタイル指定*/
/* メニューのHide Dotと連動する */
/* この例では、第5レベルまでの行頭文字を指定。第6レベルからはドットに戻る */
/* すべてのビュレット文字に共通の設定 */
.line .indent-mark .dot:before {
display: block;
position: absolute;
right: -5px;
top: -10px;
}
/* 第1レベルのインデント(c-0)の設定 */
/* ドットはバックグラウンドカラーなので透明にする */
/* セレクタとして
.line .indent-mark .dot { ... }
を使うとインデントレベルごとに
background-color: transparent;
を指定する必要はないが、指定のないレベルのドットが消える
*/
.line .indent-mark .c-0 + .dot {
background-color: transparent;
}
/* このレベルの行頭文字を表示 */
.line .indent-mark .c-0 + .dot:before {
content:"〇";
}
/* 以下同様 */
.line .indent-mark .c-1 + .dot {
background-color: transparent;
}
.line .indent-mark .c-1 + .dot:before {
content:"●";
}
.line .indent-mark .c-2 + .dot {
background-color: transparent;
}
.line .indent-mark .c-2 + .dot:before {
content:"○";
}
.line .indent-mark .c-3 + .dot {
background-color: transparent;
}
.line .indent-mark .c-3 + .dot:before {
content:"・";
}
.line .indent-mark .c-4 + .dot {
background-color: transparent;
}
.line .indent-mark .c-4 + .dot:before {
content:"-";
}
.line .indent-mark .c-5 + .dot {
background-color: transparent;
}
.line .indent-mark .c-5 + .dot:before {
content:"-";
}
.line .indent-mark .c-6 + .dot {
background-color: transparent;
}
.line .indent-mark .c-6 + .dot:before {
content:"-";
}
.line .indent-mark .c-7 + .dot {
background-color: transparent;
}
.line .indent-mark .c-7 + .dot:before {
content:"-";
}