settings
https://gyazo.com/5f93e65a3b979ae5333aca4f32600611
scrapbox の設定ページです。
RADILOG サービスドキュメントとは関係ありません。
code:style.css
body {
background-color: #fbfbfb;
}
.navbar-default {
background-color: #2e323a;
}
.new-button {
background-color: #5dcce0;
}
.grid li.page-list-item a .pin {
background: linear-gradient(45deg, #aaa, #aaa 50%, #fbfbfb 50%, #fbfbfb);
}
.grid li.relation-label.links a {
background-color: #5dcce0;
}
.grid li.relation-label.links .arrow {
border-left-color: #5dcce0;
}
.grid li.relation-label .arrow {
left: calc(100% - 1px);
}
/* 1. Scrapboxアイコンをアイコンに置き換え */
.navbar-brand .brand-icon { display: none !important }
.navbar-brand::before {
content: '';
background: url('https://gyazo.com/c5a297ef16fea7d81aa780d8d6ade44f.png');
background-size: contain;
background-repeat: no-repeat;
width: 30px;
height: 30px;
margin: 7px 4px 7px 0;
flex-shrink: 0;
border-radius: 50%;
}
＃で始まるタグをラベル風にする
code:style.css
atype="hashTag"{
display: inline-block;
padding: 2px 8px;
margin: 0 8px 10px 0;
background: #fff;
color: #f27e48;
font-size: 0.8em;
border: 1px solid #f27e48;
border-radius: 3px;
transition: .3s;
-webkit-transform: scale(1);
transform: scale(1);
}
atype="hashTag":hover{
-webkit-transform: scale(1.1);
transform: scale(1.1);
}
チェックボックス
[_] これが _ こうなるよ。
[x] これは x こうなるよ。
code:style.css
.line ahref="./_",
.line ahref="./x" {
visibility: hidden; display: inline-block; position: relative; min-width: 1.15em; line-height: 1 }
.line ahref="./_"::after,
.line ahref="./x"::after {
visibility: visible; position: absolute; left: 0;
content: '\0025A2'; font-weight: bold; color: #08BDBD !important }
.line ahref="./x" + span { position: relative; vertical-align: text-top; line-height: 1 }
.line ahref="./x" + span::after {
content: ''; visibility: visible; display: inline-block; width: .6em; height: .9em;
position: absolute; left: -0.8em; top: -0.2em;
border-right: .18em solid #2489C5; border-bottom: .18em solid #2489C5; transform: rotate(45deg) }
.line.cursor-line ahref="./_",
.line.cursor-line ahref="./x" { visibility: visible }
.line.cursor-line ahref="./_"::after,
.line.cursor-line ahref="./x"::after { visibility: hidden }
.line.cursor-line ahref="./x" + span { position: inherit }
.line.cursor-line ahref="./x" + span::after {
content: ''; visibility: inherit; display: inherit; position: inherit;
border: inherit; transform: inherit }
リストを階層ごとに変更
1st
2nd
3rd
4th
code:style.css
.line .indent-mark .c-1 + .dot {
background-color: #FFF;
border: 1px solid #555;
}
/* 3rd - */
.line .indent-mark .c-2 + .dot {
border-radius: 0;
height: 2px;
top: 13px;
width: 13px;
right: 7px;
background-color: #999;
}
/* 4th - */
.line .indent-mark .c-3 + .dot {
border-radius: 0;
width: 5px;
height: 5px;
top: 12px;
right: 7px;
background-color: #AAA;
}