settings

フォント変更

code:style.css

.editor, .stream, .title {

font-family: 'Kosugi Maru', sans-serif;

}

タグをラベル風にする

code:style.css

display: inline-block;

padding: 4px 8px;

margin-right: 4px;

background-color:#e9ebef;

border-radius: 4px;

text-decoration: none;

transition: background-color 0.2s ease-in-out;

}

background-color: rgba(0, 119, 204, 0.2);

}

全体的な見た目

行頭のドットを目立たなくする

code:style.css

.line .indent-mark .dot {

width : 3px;

height : 3px;

top : 12px;

}

ナビゲーションバーを青色に

code:style.css

.navbar-default, .new-button {

background-color:#88b3ed;

}

画像の設定

code:style.css

.level-1 img { width: 16.7%; max-height: none; }

.level-2 img { width: 33.3%; max-height: none; }

.level-3 img { width: 50%; max-height: none; }

.level-4 img { width: 66.7%; max-height: none; }

.level-5 img { width: 83.3%; max-height: none; }

.level-6 img { width: 100%; max-height: none; }

一覧カードの調整

code:style.css

/* ピン留めしたページを目立たせる　*/

.grid li.page-list-item a .pin {

height: 30px;

width: 30px;

}

code:style.css

.grid li.page-list-item a .header {

border: 0;

}

code:style.css

/* サムネ画像をフィットさせる */

.grid li.page-list-item a .icon {

position: relative;

}

.grid li.page-list-item a .icon img {

display: table-cell;

width: auto;

max-height: 90px;

max-width: 90%;

vertical-align: middle;

position: absolute;

top: calc(50% + 40px);

left: 50%;

transform: translateX(-50%) translateY(-50%);

border-radius:5px;

}

code:style.css

/* 正方形にする　*/

.page-list .grid li,

.related-page-list .grid li.page-list-item,

.related-page-list .grid li.relation-label {

width: 168px;

height: 168px;

margin: 1em;

}