Scrapboxのプレゼンテーションモードの研究
#作業ログ
Scrapboxのプレゼンモードはとても好き。
作成が容易、修正も容易、保管場所のことも考えなくていい
(できる限り)スライド作成アプリをつかいたくない!
ただ、見た目がいまいちなので、なんとかしたい!
CSSでなんとかなるとおもうんだけど……
なんとかしたいポイント
ヘッダの字をもう少し小さく
ヘッダとボディの間をもう少し大きく
ボディの行間をもう少しあける
と書きつつ、メンテナンスしたのでだいぶこれでいい気がしてきたw
---
見出しの色を変えるとよさそう→太字に色をつけた
.lineのline-hightを変えられるが、通常モードとプレゼンモードと共通で、ちょっと不便
.glidはサムネイル頁の設定
CSSの親玉みたいなのは見つけたapp.cssが、プレゼンモードをいじってもうまくいかない
code:style.css
htmldata-display-style * ='presentation' .text-input {
font-size: 3vw
}
htmldata-display-style * ='presentation' .text-input.line-title {
font-size: 6vw
}
---
settingsのコレクション
/madobes/settings 窓辺の砂場 🌟
/Porin-Room/settings これはすごいしていねい 🌟
/phoooutty/settings phooooutty's グリッドが凝ってる 🌟
/ucdktr2020/settings u-labo's 授業関連2020
/kemsso/settings bearの何がいいのかを参考にしながら作ったテーマです。(2019/1/12)
/lnspartner/settings ロイロスクールパートナー向け
---
プレゼンモードはちょうどいい → line hightでできないかな?
テーブルはいまいち
code:style.css
@media screen {
/* 本文のフォント設定: 行間 */
// .app:not(.presentation) .line .text:not(.code-block) { line-height: 2.1 }
.line .text:not(.code-block) { line-height: 1.5 }
}
---
ようやくできた!
プレゼンモードと、それ以外で、別々にline-hight指定
あとはプレゼンモードのテーブルだな……
code:style.css
@media screen {
// 本文のフォント設定: 行間
// 非プレゼンモードと、プレゼンモードの指定
.app:not(.presentation) .line .text:not(.code-block) { line-height: 1.5 }
.app.presentation .line .text:not(.code-block) { line-height: 1.5 }
}
まあ、これで使いやすくなった。ハッピー!
.text-inputの設定でもう少し変えられるのだろうか?