/yuiseki/Settings - Scrapbox Reader

generated at 10/17/2024, 4:15:32 AM
settings

参考文献
/help-jp/UserCSS
/scrapboxlab/UserCSS
/customize/UserCSS

サイドメニューのランダムボタンを消す
style.css.random-jump-button {
	display:none !important;
}

CSSだけでindent-rainbow
Example
test
test
test
test
test
test
test
test
test
test
test
test
style.css.indent-mark {
	height: 100% !important;
}
.indent-mark .pad {
	height: 100% !important;
	overflow: unset !important;
}
.indent-mark span:nth-child(4n+1) .pad {
	background: lightblue !important;
	opacity: 0.5;
}
.indent-mark span:nth-child(4n+2) .pad {
	background: lightpink;
	opacity: 0.5;
}
.indent-mark span:nth-child(4n+3) .pad {
	background: lightyellow;
	opacity: 0.5;
}
.indent-mark span:nth-child(4n+4) .pad {
	background: lightgreen;
	opacity: 0.5;
}

sectionを水平線で区切る
style.css.app:not(.presentation) .line.section-title:not(.line-title) {
	position: relative;
}
.app:not(.presentation) .line.section-title:not(.line-title) .text {
	padding-top: 1em;
}
.app:not(.presentation) .line.section-title:not(.line-title):before {
	content: "";
	display: block;
	width: 111%;
	position: absolute;
	left: -49px;
	border: 1px lightgray solid;
}

sectionに番号を表示する
style.css.app {
	counter-reset: section;
}
.app:not(.presentation) .line.section-title:not(.line-title) {
	position: relative;
}
.app:not(.presentation) .line.section-title:not(.line-title):after {
	z-index: 1000;
	counter-increment: section;
	content: counter(section);
	display: inline-block;
	width: 1.6em;
	height: 1.6em;
	position: absolute;
	top: -10px;
	left: -55px;
	background-color: #52ba68;
	border-radius: 50%;
	color: #fff;
	font: 600 normal 90%/1.6 'Century Gothic', Arial, sans-serif;
	text-align: center;
	white-space: nowrap
}

コードブロック記法で空白文字可視化
Scrapboxのコードブロック記法で空白文字可視化
style.cssspan.code-tab {
	background-color:rgba(169,169,169,0.4);
	opacity: 0.5;
}
span.code-tab:after {
	display: inline-block;
	position: relative;
	left: -0.7em;
	content: "→";
	width: 0px;
}
span.code-double-byte-whitespace {
	background-color:rgba(169,169,169,0.4);
	opacity: 0.5;
}
span.code-double-byte-whitespace:after {
	display: inline-block;
	position: relative;
	left: -1em;
	content: "＿";
	width: 0px;
}