Chienomiの細かな改良・新機能について
開発::web
序
実はさふぁいあさんの記事を公開するにあたり、非技術者の流入を見越していくつか修正を入れていた。
また、それに伴って気になっていた部分を改良した。
内容
一部テーマの改良
色が見づらい、と指摘のあった部分についてCSSの記載漏れがあったため、これを修正した。
これは結構前に行った。
strongの表示の変更
strongは従来、border
を使っていたが、text-decoration
を使用するように変更した。
単純な
text-decoration
ではなく、個別プロパティを使ったものになっている。
topic pathの追加
PureBuilder Simplyの改良を伴ってtopic pathが追加された。
こちらも結構前に入った変更。
Jump2Tocボタンの追加
ナロー画面において右下のTOCボタンが気づきにくく忘れやすい、TOCの意味が分かる人でないと押せない、という問題があり、アイコンを追加するとともに、ナロー画面では記事丈夫にジャンプボタンを追加した。
Atom Feed復活
RSSフィードはないのか、という問い合わせがあったため、追加した。
サイドバーから辿ることができる。
Telegramによる更新通知
更新通知用のTelegram channelが登場し、サイドバーに追加された。
なお、Discordのサーバーも存在するのだが、現状、参加者を他参加者から隠す方法がないので公開していない。
また、eメールによる更新通知はWordPress公式だから許されていた面があり、私がやるとスパム判定待ったなしなので採用予定はない。
Copy linkボタンの追加
従来Twitter/LINE/web Share APIという3つだったのだが、Twitterは非常にシェアがしづらくなってしまったし、PCからだとシェアしづらいので、PCでも機能するCopy linkボタンを作った。
このボタンはリンクだけではなくタイトルも含めてコピーする。
onclick
属性直埋めになっているのだが、実は割とめんどくさいことをしている。
navのまとめ
サイドバーが小さなnavブロックがたくさんある形になっていたが、これは良くないので、ひとつのnavブロックにまとめるようにした。
セクショニングコンテンツをh1
で始めるのが好きではない人もいるだろうが、この仕様を変更すると支障があるため、これは維持している。
stickyの採用
本文のh2
がsticky
になった。
stickyの挙動は、その要素より先に進んだ場合にビューポート上端に固定されるというものである。
これには大きな問題があり、h2
要素が折り返されている場合、後続のh2
要素よりもボックスの高さがある状態になってしまい、重なり合ったh2
要素は後にあるものほど上のレイヤーになるものの、2行目が残ってしまう。
そこで、ナローモードでは折り返さず、省略するようにした。これはtext-overflow: ellipsis
を使ったものである。
なお、各h2
要素が独立したブロックに含まれるようにすればブロックそのものに覆われてしまうため見えなくなるのだが、Pandocでそんなことをするのはとても面倒だし、無意味な大量のブロックを配置することになってしまうため、していない。