Chienomi

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ブロックにまとめるようにした。

セクショニングコンテンツをh1で始めるのが好きではない人もいるだろうが、この仕様を変更すると支障があるため、これは維持している。

stickyの採用

本文のh2stickyになった。

stickyの挙動は、その要素より先に進んだ場合にビューポート上端に固定されるというものである。 これには大きな問題があり、h2要素が折り返されている場合、後続のh2要素よりもボックスの高さがある状態になってしまい、重なり合ったh2要素は後にあるものほど上のレイヤーになるものの、2行目が残ってしまう。

そこで、ナローモードでは折り返さず、省略するようにした。これはtext-overflow: ellipsisを使ったものである。

なお、各h2要素が独立したブロックに含まれるようにすればブロックそのものに覆われてしまうため見えなくなるのだが、Pandocでそんなことをするのはとても面倒だし、無意味な大量のブロックを配置することになってしまうため、していない。