settings
/shiology/05161-180613 初期設定がゴシック体なScrapboxでフォントを明朝体に変更する設定を少し改変
code:style.css
body {
font-family: '游明朝体','YuMincho','游明朝','Yu Mincho','ヒラギノ明朝 ProN','Hiragino Mincho ProN','ヒラギノ明朝 Pro','Hiragino Mincho Pro',serif;
}
.editor, .stream, li.page-list-item {font-family: unset !important;}
code:style.css
/* 外部リンクにiconをつける */
.line span:not(.modal-image):not(.pointing-device-map) > a.link:not(.icon)::after {
font-family: 'Font Awesome 5 Free';
content: ' \f35d';
font-weight: 900;
display: inline-block;
}
/customize/ピン留めされたページを独立した段に表示する
code:style.css
.page-list-item.pin + .page-list-item:not(.pin) {
grid-column-start: 1;
}
ブランドアイコンの変更
Thanks: /yamanoku/settings
Thanks:/nwtgck
code:style.css
/* Overwrite the brand icon */
a.navbar-brand.dropdown-toggle {
position: relative;
}
a.navbar-brand.dropdown-toggle::before {
content: "";
width: 46px;
height: 46px;
display: block;
position: absolute;
top: 2px;
left: -3px;
background-image: url(https://scrapbox.io/files/6139445d1d7be3001dd324f2.png);
background-size: contain;
background-repeat: no-repeat;
/* (from: http://www.safaridesign.jp/design-note/css_circle_clipping_a_photo/) */
border-radius: 50%;
}
Thanks:/motoso
code:style.css
body {background-color: #e6735c;
background-image: url(https://scrapbox.io/files/61394700209b46001d75b3cd.jpg);
}
/* 付箋の折返しを背景と同色に */
.grid li.page-list-item a .pin {
background: linear-gradient(45deg, var(--card-backside, #aaa), var(--card-backside, #aaa) 50%, #e6735c 50%, #e6735c)
}
/customize/Streamにアクセスするボタン
code:style.css
.navbar .navbar-menu>li.stream-btn,
.navbar .navbar-menu>li.stream-btn.hidden-xs
{ display: block !important; }
/scrapboxlab/リストからsettingsを消すUserCSS
code:style.css
.grid li.page-list-item > ahref^="/GenjiYomi/settings" {
display: none;
}
/scrapboxlab/箇条書きのバレットをFontAwesomeにするUserCSSや/customize/インデントレベルごとに行頭文字を変更を参考に作成
code:style.css
.line .indent-mark .dot:before {
display: block;
position: absolute;
right: 5px;
top: -10px;
color: #555;
content: '\f518';
/* font-family: FontAwesome;*/
font-family: 'Font Awesome 5 Free';
font-weight: 900
}
.line .indent-mark .dot {
background-color: transparent;
}
/* 第１レベルのインデント（c-0）の設定 */
.line .indent-mark .c-0 + .dot {
background-color: transparent;
}
/* このレベルの行頭文字を表示 */
.line .indent-mark .c-0 + .dot:before {
content: '\f02d';
font-weight: 400
font-family: 'FontAwesome 5 free';
}
カードをお月様化
code:style.css
.page,
.grid li.page-list-item a,
.grid.grid-md li.page-list-item a,
.grid.grid-lg li.page-list-item a {
border-radius: 50% ;
box-shadow: none;
background: yellow;
}
.grid li.page-list-item a .header {
position: relative;
top: 17px;
left: 5px;
z-index: 0;
background: yellow;
border-top: none;
}
.grid li.page-list-item a:hover {
transform: scale(1.5);
color: white;
box-shadow: none;
}
.container {
max-width: none;
}
body{
background-color: white;
}
.grid li.page-list-item a .icon img {
width: 96px;
height: 96px;
border-radius: 50%;
margin: auto;
}
pinページを少し大きくして前に出す
code:style.css
.page-list-item.pin {
transform: scale(1.2);
z-index: 3;
}