いじったカスタマイズ
当プロジェクトで手を加えた箇所をまとめる
また手を加えた理由についても記載する
一応なのだが元のデザインにケチをつける目的はないということは書いておく
管理人の好みに変えた、というだけの話
当プロジェクトのCSSはこちら
→（settings）
デフォルトは以下の通り
"Open Sans",Helvetica,Arial,"Hiragino Sans",sans-serif 変更した理由は、正直まあ好みなのだが
細いウエイトだと目の負担が減りそうである
フォントの視覚的ストレスについては色々調べたが、正直これで問題ないようにも思える
>参考
>伝わるデザイン 研究発表のユニバーサルデザイン 様 【おすすめフォント】
また細いウエイトのNoto Sansは格調高い印象になる
しかし綺麗すぎても可愛げがないのでそのあたりまた今度手を加えようか
2021/2/11 游ゴシックにした
CSSで文字詰めが出来ることを知ったので試してみたがちょっと詰まりすぎている印象があったのでそのままにした
フォントにもよるが
font-feature-settings で指定できる文字が詰まってない方に見慣れたからかもしれないが
これもまた今度
箇条書きのビュレットのデザインを変更した
ビュレットとは、
←このような箇条書きを表す印のこと
どうでもよいが「中黒」とは別物らしい、他人が誤用していても指摘することは野暮だが
デフォルトは以下の通り
少し大きかったので現在のデザインにした
CSSの作者は窓辺ちゃんさん
またインデントのレベルで明度を変更するようにした
視認性向上が目的だが、そもそもインデントされている時点で分かるかも
このように、
薄くなる
3段階以上は、
薄くならない
テロメアの非表示設定
スマートフォンでの閲覧時にテロメアを非表示にした
スマートフォンでの閲覧時に窮屈に感じたため非表示にした
デフォルトは以下の通り
2021/4/17
なんか新着テロメアの青がちょっとギラつきすぎている感じもする
いっそ非表示にしようかな、とも思うが
まあまた今度
ハッシュタグ表示の変更
以下のものにした
CSSの作者はヤマギシチヒロさん？
可愛いので多くの方のScrapboxプロジェクトで使用されている
そのためオリジナルが分からない
デフォルトではリンク記法とほぼ見た目が変わらない
「見た目が異なるリンク記法」ということを活用したかったので上記のものを採用した
デフォルトではリンク先が有る状態と無い状態での区別が無かったので少しいじった
リンク切れで赤く表示されるように変更した
以下の通り
ページ一覧表示の設定
ピン留めページの見た目を変更し、また非ピン留めページとの間に区切りを設けた
デフォルトでは以下の通り
ピン留めされたページとそうでないページとの区別が付きづらいと感じた
以下のようにした
元々「ページ一覧の先頭に表示すること」のみが目的と思われる
以下の方々のものを参考にした
/customize/pin折り返し部分の背景色（作者はdaiizさん？）
区切り線に関しては良く分からないことがあったので別の記事にまとめた
以下、やろうと思って途中で諦めたものなど
関連ページリストの表示方法
ページ下部ではなくサイドに表示するカスタムを作っている方がいらっしゃった
appachanさんという方の制作
参考にして右側に置いた
Flexboxは聞いたことがあったが勝手が分からなかったので調べた
しかしこのレイアウトだと関連ページの方が多い際に記事のあるべき箇所がそのまま空欄になってしまう
こういうUIは「サイドメニューがメインコンテンツをはみ出さない」という前提で設計されているのか
なるほどといった感じ
どうでもよいのだが、記事のwidthは960px
関連ページリストのwidthは147pxで、これにmarginの15pxが加わる
関連ページリストは最大で6枚置かれるので、こちらの合計は147*6+15*5で957px
3pxはみ出るじゃん、と思ったら本当にはみ出てた
このくらいのズレだったらパッと見では分からないということか、なるほど
その後は色々試してみた
