Closed ogwata closed 2 years ago
たまたま9月はv2.9、v2.10、 v2.11と更新が続きましたが、あまり「1ヵ月」に意味はないので、次のタイトルと記事ファイル名のほうがよいと思います。
日本語タイトル: 最近のVivliostyle.jsの進化について 英語タイトル: Recent Vivliostyle.js updates 記事のファイル名: recent-vivliostyle-js-updates
このあとも重要な更新を予定しているので、今後も同様のタイトルでリリースの記事を出すようにするとよいかと思います。
この記事中、「セレクター」という語が3回使われていますが、たぶんこれは「機能の追加」と書くべきところを誤って「セレクターの追加」と書いてしまったのかと思います。「セレクターの追加」はしていないので。(CSSのセレクターについては https://developer.mozilla.org/ja/docs/Learn/CSS/Building_blocks/Selectors の解説をお読みください)
この記事中、「セレクター」という語が3回使われていますが、たぶんこれは「機能の追加」と書くべきところを誤って「セレクターの追加」と書いてしまったのかと思います。
すいません、セレクターではなくプロパティ、つまり「対応するプロパティの追加」という意味で使いました。以下のように変更するのではどうでしょう?
すいません、セレクターではなくプロパティ、つまり「対応するプロパティの追加」という意味で使いました。以下のように変更するのではどうでしょう?
- セレクターの追加 → プロパティの追加
anywhere
, min-content
, max-content
はプロパティ追加ではなく、プロパティの値の追加です。 unicode-range
はプロパティではなく、記述子 (descriptor) といいます。
追加された機能のうち、プロパティの追加は font-variant-*
だけです。
したがって、「機能」、あるいは「CSSの機能」が適切です。
v2.9で追加された @supports
についても載せた方がよいと思います。
本ページに掲載したVivliostyle Viewerのスクリーンショットをご覧ください。画面左上に虫眼鏡のアイコンがあります。
スクリーンショットで設定メニューが開いているために、ツールボタンが無効状態になっています。設定メニューを開いていない状態でスクリーンショットをとったほうがよいと思います。
スクリーンショットで設定メニューが開いているために、ツールボタンが無効状態になっています。設定メニューを開いていない状態でスクリーンショットをとったほうがよいと思います。
なるほど、たしかに! ただ、設定メニューを見せたのは、バージョン番号を見せたかったからでした(元々バージョン番号が小さいので、ウィンドウ自体を小さくして、相対的に番号の文字サイズが大きくなるようにしている)。
このスクリーンショットを選んだ意図は、検索機能の説明だけでなく、新しいバージョンの Vivliostyle Viewer であることを明示したいからです。
たしかに虫眼鏡のアイコンはグレイアウトしていますが、アイコンそのものは見えており、この部分で読者が混乱することはないように思います。このままにさせてもらえないでしょうか?
このスクリーンショットを選んだ意図は、検索機能の説明だけでなく、新しいバージョンの Vivliostyle Viewer であることを明示したいからです。
たしかに虫眼鏡のアイコンはグレイアウトしていますが、アイコンそのものは見えており、この部分で読者が混乱することはないように思います。このままにさせてもらえないでしょうか?
おまかせします。
ちなみに、設定メニューは開いたままでツールボタンを有効にすることも可能です。 ツールチップに "Settings (S), Double click/type to pin" とあるように、ダブルクリックか、"S" キーを2回打つかすると、設定メニューがピン留めになります。お試しください。
@MurakamiShinyu ここまでの修正に加え、「バグ修正にともなう組版結果への影響①」の節を追加してpushしました。ご確認ください。
旧バージョンのスクリーンショットですが、v2019.11はあまりに古いので、v2.9.1で再作成することにします。
一応、全体を書き終えました。
ただ、white-space: break-spaces
の説明が自信ありません。それから、「root要素で指定された継承プロパティを〜〜」のコードブロックが大きすぎて不体裁な気がします。この部分だけ小さくする方法はないのでしょうか。
"Vivliostyle.js" の表記は、小文字の "vivliostyle.js" ではなく "Vivliostyle.js" に統一しませんか。
"Vivliostyle.js" の表記は、小文字の "vivliostyle.js" ではなく "Vivliostyle.js" に統一しませんか。
うーん、言われて初めて気付きましたが、私は大文字の "Vivliostyle.js" に違和感をもっていました。
Vivliostyle PubやVivliostyle CLIなど、エンドユーザーが使うプロダクトは大文字でよいと思うのですが、vivliostyle.js はドットで区切られていることからも分かるとおりライブラリです。エンドユーザー向けのプロダクトとは区別する方がよいように思いました。そこでGitHubリポジトリの表記を使っていたわけです。
それから、なぜ "Vivliostyle.js" はよくて、 "Vivliostyle.Js" にならないのでしょう? そんな違和感から、すべて小文字の “vivliostyle.js” にしたという理由もありました。
村上さんは、なぜ大文字の方がよいと思ったのでしょう? 私は明快な理屈が通っていれば拘りません。
"Vivliostyle.js" の表記は、小文字の "vivliostyle.js" ではなく "Vivliostyle.js" に統一しませんか。
うーん、言われて初めて気付きましたが、私は大文字の "Vivliostyle.js" に違和感をもっていました。
Vivliostyle PubやVivliostyle CLIなど、エンドユーザーが使うプロダクトは大文字でよいと思うのですが、vivliostyle.jsはライブラリなので、GitHubリポジトリの表記の方が相応しいと思ったのです。
Node.js や Paged.js など、JavaScript のツールやライブラリの名前で ".js" が付くものは、先頭大文字が普通です。小文字だけの名前に ".js" が付いているとJavaScriptプログラムのファイル名に見えてしまいます。正式な名前としては、先頭大文字の "Vivliostyle.js" のほうが適切だと思います。
Node.js や Paged.js など、JavaScript のツールやライブラリの名前で ".js" が付くものは、先頭大文字が普通です。
なるほど、明快ですね。納得しました。 "Vivliostyle.js" に直しましょう。
min/max/fit-content について、「ボックスを生成する」と説明されていますが、これらはサイズを指定するプロパティの値のキーワードであって、これらにボックスを生成する機能があるわけではありません。そこで、各説明の文末の「ボックスを生成する」を「ボックスを生成するためのサイズを指定するキーワード」と直すとよいと思います。
min/max/fit-content について、「ボックスを生成する」と説明されていますが、これらはサイズを指定するプロパティの値のキーワードであって、これらにボックスを生成する機能があるわけではありません。そこで、各説明の文末の「ボックスを生成する」を「ボックスを生成するためのサイズを指定するキーワード」と直すとよいと思います。
ご提案の文言は正確かもしれませんが、難渋で分かりづらいように思います。元々この文字数で動作の全てを正確に説明するのは不可能です。元のままにさせていただけませんか。
min/max/fit-content について、「ボックスを生成する」と説明されていますが、これらはサイズを指定するプロパティの値のキーワードであって、これらにボックスを生成する機能があるわけではありません。そこで、各説明の文末の「ボックスを生成する」を「ボックスを生成するためのサイズを指定するキーワード」と直すとよいと思います。
ご提案の文言は正確かもしれませんが、難渋で分かりづらいように思います。元々この文字数で動作の全てを正確に説明するのは不可能です。元のままにさせていただけませんか。
なるほど、了解です。ただ、文の繋がりが不自然になってしまうので、代案を考えてみます。すこしお待ちください。
ご提案の文言は正確かもしれませんが、難渋で分かりづらいように思います。元々この文字数で動作の全てを正確に説明するのは不可能です。元のままにさせていただけませんか。
分かりました。このv2.10.0でのCSSの機能追加の項目はどれもブラウザで使えるのにVivliostyle.jsで使えなくしていたのを直したというだけなので、詳しい説明は不要であり、ほかでのCSS仕様の説明へのリンクだけでもよかったかもしれないですね。
なるほど、了解です。ただ、文の繋がりが不自然になってしまうので、代案を考えてみます。すこしお待ちください。
代案を考えてみました。以下ではいかがでしょう。
現在 左の旧バージョンの緑色枠の外側には8pxの間隔が確保されているのに対し、右側のv2.10.0では間隔はゼロであることが分かります(HTMLとCSSのコードは Issue #776を参照)。
修正案
意図的にマージンをなくすよう@page {margin: 0;}
を指定したにもかかわらず(コードは Issue #776を参照)、左の旧バージョンの緑色枠の外側には8pxの間隔が発生してしまいました。それに対し、右側のv2.10.0では指定通り間隔はゼロであることが分かります。
ちょっと待ってください。
修正案 意図的にマージンをなくすよう
@page {margin: 0;}
を指定したにもかかわらず(コードは Issue #776を参照)、左の旧バージョンの緑色枠の外側には8pxの間隔が発生してしまいました。それに対し、右側のv2.10.0では指定通り間隔はゼロであることが分かります。
上記で「意図的にマージンをなくすよう@page {margin: 0;}
を指定した」と書きました。しかし、改めて私が書いたコードを確認したところ、@page {margin: 0;}
の指定はありませんでした(ごめんなさい)。
https://github.com/ogwata/testbed-20211012/blob/main/test.html
HTMLだけで、CSSは指定し忘れています。CSSを加えてスクリーンショットを撮り直すので、すこしお待ちください(掲載前に気付いてよかった)。
HTMLだけで、CSSは指定し忘れています。CSSを加えてスクリーンショットを撮り直すので、すこしお待ちください(掲載前に気付いてよかった)。
取り急ぎ、コードを書き直してVivliostyle Viewerで読み込んでみたのですが、表示は変わりません。
コードに問題はないか(#776と齟齬がないか)、一応ご確認ください。 https://github.com/ogwata/testbed-20211012/blob/main/test.html
HTMLだけで、CSSは指定し忘れています。CSSを加えてスクリーンショットを撮り直すので、すこしお待ちください(掲載前に気付いてよかった)。
取り急ぎ、コードを書き直してVivliostyle Viewerで読み込んでみたのですが、表示は変わりません。
コードに問題はないか(#776と齟齬がないか)、一応ご確認ください。 https://github.com/ogwata/testbed-20211012/blob/main/test.html
問題ないです。こちらで確認すると:
問題ないです。
ご確認、ありがとうございます。修正案に少し手を加えてコミットしました。合わせて、新旧バージョンのVivliostyle Viewerのリンクを注記で追加しました。
これでマージしてよいか、ご確認いただけませんか。
「重複約物」は「連続約物」のほうが適切でないでしょうか? (重複では同じ文字が重なっているよう)
「重複約物」は「連続約物」のほうが適切でないでしょうか? (重複では同じ文字が重なっているよう)
たしかに!
重複するホワイトスペースの間も改行する
というところも、「連続する」が適切だと思います。
まだデフォルト値変更の節がまだですが、ここまででチェックいただけないでしょうか。