settings
https://gyazo.com/f5aad8e143b8d197c25d5e884bb315a2
引用でのイタリック体をやめる。
code:style.css
.line .quote {
font-style: normal;
}
Portrait
バレットを少し薄めに
code:style.cs
.line .indent-mark .dot {
top: 12px;
width: 6px;
height: 4px;
background-color: #c9c9c9;
}
/takker/コードブロック記法に行番号を表示するUserCSS
code:style.css
@import '../コードブロック行頭の空白の色を変えるCSS/style.css';
htmldata-project-theme="paper-dark-dark",
htmldata-project-theme="defaut-dark" {
--code-line-number-color: #D181FF;
}
.section-title, .code-block-start {
counter-reset: codeline
}
.code-block .indent-mark > spanclass^="c-":last-child {
counter-increment: codeline
}
body:not(.presentation) .code-block .indent-mark > spanclass^="c-":last-child::before {
content: counter(codeline);
position: absolute;
}
.code-block .indent-mark > spanclass^="c-":last-child::before {
color: var(--code-line-number-color, #3f3f3f);
}
/* カーソル選択時の行番号の色 */
.cursor-line .code-block .indent-mark > spanclass^="c-":last-child::before {
color: var(--cursor-code-line-number-color, #FF00F0);
font-weight: bolder;
}
/noratetsu/●「行番号を表示する」改良版
code:style.cs
/* 行番号を表示 -- ウィンドウ幅768px以上で適用 */
@media screen and (min-width: 768px) {
.editor .lines { counter-reset: line }
/* タイトルから数えるときは :not(.line-title) を消してね */
.editor .line:not(.line-title) { counter-increment: line }
/* タイトルから数えるときは :not(.line-title) を消してね */
.app:not(.presentation) .editor .line:not(.line-title)::before {
content: counter(line);
position: absolute; display: inline-block; left: -110px; z-index: 10;
min-width: 50px; text-align: right; vertical-align: middle;
/* 行番号のフォントとか色とかの指定はここ */
font-family: monospace; color: grey }
/* カーソル行の行番号を濃く表示する */
.editor .line:not(.line-title)::before { opacity: .5 }
.editor .line.cursor-line:not(.line-title)::before { opacity: 1; font-weight: bolder } }
/villagepump/特定のページを非表示にする
code:style.css
.page-list-itemdata-page-title="書籍名",
.page-list-itemdata-page-title="settings",
.page-list-itemdata-page-title*="icon",
.stream .pagedata-title*="settings",
.stream .pagedata-page-title*="icon" {
display: none !important;
}
#page-info-menu + ul > li:nth-child(2) {
display: none;
}
code:style.css
#page-info-menu + ul > li:is(:nth-child(4), :nth-child(6)) > div {
display: none;
}
バレットを星にする
code:style.cs
/* アイコン指定 */
.line .indent-mark .dot::before {
display: block;
position: absolute;
top: -10px;
font-family: 'Font Awesome 5 Free';
font-size: .7em;
/* content: '\f068'; /* マイナス記号:通常 */
content: '\f005'; /* スター:クリスマス用 */
/* content: '\f1b0'; /* 肉球:猫の日用 */
/* content: '\f1fd'; /* バースデーケーキ */
font-weight: 900;
color: #c9c9c9;　
}
/* 既定のbulletを消す */
.line .indent-mark .dot {
background-color: transparent;
}
/* 色 */
.indent-markstyle*="width: 1.5em" .dot::before,
.indent-mark .dot:nth-child(6n+2)::before {
color: #EDAD0B;
}
.indent-markstyle*="width: 3em" .dot::before,
.indent-mark .dot:nth-child(6n+3)::before {
color: #C7243A;
}
.indent-markstyle*="width: 4.5em" .dot::before,
.indent-mark .dot:nth-child(6n+4)::before {
color: #932674;
}
.indent-markstyle*="width: 6em" .dot::before,
.indent-mark .dot:nth-child(6n+5)::before {
color: #3261AB;
}
.indent-markstyle*="width: 7.5em" .dot::before,
.indent-mark .dot:nth-child(6n+6)::before {
color: #009F8C;
}
.indent-markstyle*="width: 9em" .dot::before,
.indent-mark .dot:nth-child(6n+7)::before {
color: #c9c9c9;
}
.indent-mark span.dot:nth-child(n+10)::before {
--over-dot-color: #363636;
color: #fffafa;
text-shadow: 1px 0px 1px var(--over-dot-color),
0px 1px 1px var(--over-dot-color),
-1px 0px 1px var(--over-dot-color),
0px -1px 1px var(--over-dot-color);
}
番号つきリスト
code:style.cs
.line.number-list .dot {
display: list-item; /* 表示する */
}
/* アイコン指定 */
.line.number-list .dot::before {
position: inherit;
top: -11px;
content: '\f292'; /* #:通常 */
/* content: '\f2dc'; /* 雪:クリスマス用 */
font-size: .6em;
}