番号付きリストにFontAwesomeを使うUserCSS
/scrapboxlab/箇条書きのバレットをFontAwesomeにするUserCSSの対象を番号付きリストに絞ったUserCSS
/villagepump/Settings#5f4e065a5b98c20000821270を参考に数値の一部を改変している
2021-07-06 05:09:11 FontAwesomeのversionを上げた
code:style.css
.line.number-list .dot::before {
display: block;
position: absolute;
font-family: 'Font Awesome 5 Free';
}
.line.number-list .dot {
background-color: transparent;
display: list-item; /* 表示する */
}
アイコン指定
code:style.css
.line.number-list .dot::before {
top: -11px;
content: '\f292'; /* # */
font-weight: 900;
color: #c9c9c9;
}
フォントサイズと色
code:style.css
.line.number-list .c-0 + .dot::before {
font-size: 11px;
color: #fe0;
}
.line.number-list .c-1 + .dot::before {
font-size: 10px;
color: #F0F;
}
.line.number-list .c-2 + .dot::before {
font-size: 9px;
color: #0FF;
}
.line.number-list .c-3 + .dot::before {
font-size: 8px;
color: #F00;
}
.line.number-list .c-4 + .dot::before {
font-size: 7px;
color: #0F0;
}
UserCSS.icon