#daiizメモ

Scrapboxに夢中

【Scrapbox・UserCSS】一覧ページのカードサイズを小さくする

Scrapboxの UserCSS という機能を使います.見た目を変更したいHTML要素に関するCSSを書くと,「自分だけ」または「訪問者全員」に対するデザインを設定できます.今回は,一覧表示されるページのカードのサイズを小さくするCSSを紹介します.

/* カードを小さくする */
.page-list .grid li, 
.related-page-list .grid li.page-list-item,
.related-page-list .grid li.relation-label {
  width : 110px !important;
  height: 110px !important;
}
 
/* 左上固定の大きなカードも小さくする */
.two-two {
  width : 110px !important;
  height: 110px !important;
}

.two-two .icon {
  padding-top: 30px !important;
}
 
.two-two .title {
  height: 0px !important;
}

このCSSを code:style.css としてScrapboxのページ内に書いておきます.「自分のユーザ名」のページに書くと自分だけのデザイン,「settings」という名のページに書くと訪問者全員に対して適用されるデザインになります.(見本)

明日はカードをくるくる回します.