Skip to content

slack techbookfest 2019 09 09

Jump to bottom
akabeko edited this page Nov 16, 2019 · 1 revision

2019-09-09

Time Icon Name Message
06:15 akabeko Markdown の記述で気になった点がありましたので列挙します。

• 役名（ <strong> タグ）で の <strong> に対応する閉じタグがないため、以降がすべて太字になっています。今回の合同誌に使用する Markdown パーサーは HTML をそのまま処理すると思われますので、閉じタグを入れるか、タグ部分だけバッククォートで括ってエスケープしたほうがよいと思います。
• CSS や HTML の例示にコード ブロックを使用していますが、これの開始部分に言語名を入れると CSS としてキーワード (margin-inline-start など) がハイライト表示されるので指定したほうがよいと思います。ちなみに CSS は css、HTML は html が言語名になります。
06:24 akabeko 補足。

css


という感じで開始すると指定された言語でハイライト表示するモードになります。
06:28 shinyu 小形さん、読みました。以下コメントです：

みんなもVivliostyleのslackに参加するといいよ！
[^“Vivliostyle slack” ...]:
コメント：　招待リンクの長いURLを印刷本に載せるよりも、
「Vivliostyle公式サイトの「コミュニティ」ページ https://vivliostyle.org/ja/community/ から参加できます」
のように紹介するのがよいと思います。

3行目を見ていただくと分かるとおり、行が折り返されていない。white-spaceプロパティはコードを表示するためのものなので、これは当然の振る舞いと言える。
コメント：　white-space: pre のかわりに white-space: pre-wrap の指定をすると、タブ等の空白文字をそのまま表示して、行の折り返しはするようにできます。しかしタブ幅は自由にできないのでこれでも役に立ちませんが。

しかし論理プロパティを使えば、writingmodeプロパティの値を切り換えるだけですむ
表記：writingmode → writing-mode


仕様がエディターズドラフトの段階にも関わらず、プラウザへの実装はきわめて順調に進んでおり、
コメント：「エディターズドラフト」→「ワーキングドラフト」です（最初のWDが出たのが2017年5月）。勧告候補になる前にプラウザへの実装が進められた理由は、すでに勧告候補になっている CSS Writing Modes の実装に論理プロパティが必要だからです。
Vivliostyle — open source, web browser based CSS typesetting engine project
06:41 shinyu 私も合同誌に何か書くつもりでいながら、すみませんまだ書いてないです。次のテーマで書こうかなと思います。ほかに書いてほしいリクエストがあればどうぞ。

- Vivliostyle のこれからの開発課題を詳しく
06:44 小形克宏 akabekoさん、コメント感謝です。

｀役名（ <strong> タグ）で｀ の ｀<strong>｀ に対応する閉じタグがないため、以降がすべて太字になっています。
この部分、閉じタグがないのはどの箇所でしょう？　“strong” で検索したのですが、いずれも閉じられているように見えます。前後のテキストも含めて箇所をご教示いただけるとありがたいです。

css
>
という感じで開始すると指定された言語でハイライト表示するモードになります。
ごめんなさい、私の知識不足で意味が分かりません。こちらはmdを「Typora」というアプリケーションで開いています。「開始」とはどんな操作なのでしょう？
06:46 小形克宏 村上さん
コメントありがとうございます。
いただいたコメントを反映させて改訂を進めます！
06:50 akabeko &lt;strong&gt; は以下の部分です。

- 役名（ <strong> タグ）ではじまるセリフの段落を他の段落と区別できるようにclassをつける

ここに含まれる &lt;strong&gt; が HTML として解釈され、対応する &lt;/strong&gt; がないので以降が太字になります。

コードブロックは Slack でも機能してしまうので説明するのが難しいのですがバッククォート 3 つで開始〜終了している部分です。原稿では

p {
margin-left: 6em; /* ブロック全体を 6em 左（縦の場合は上）に /
text-indent: -6em; / 先頭行のみ 6em 右（縦の場合は下）に */
}
```

などですね。これを囲うバッククォート 3 つの内、開始側の方へ バッククォート 3 つに続けて言語名を記述 すると、その言語でよしなにハイライト表示されます。
06:56 akabeko Markdown には色々と方言があり、パーサー (解析エンジン) によって利用できるものや表示結果が変わるのですが、今回の合同誌では私の作成した https://github.com/akabekobeko/env-create-book をベースにするそうですので、GFM (GitHub Flavored Markdown) が近くなります。

GFM な Markdown をプレビューする場合、

• GitHub に Markdown ファイルをコミットして GitHub 上で見る
• Atom や Visual Studio Code などの標準 Markdown プレビューを利用する

などの方法が考えられます。もちろん https://github.com/spring-raining/tbf07-draft が動くようになれば、それで確認するのが一番です。私は Visual Studio Code 上で編集とプレビューの両方をおこなっています。
akabekobeko/env-create-book

spring-raining/tbf07-draft
06:57 akabeko https://support.typora.io/Markdown-Reference/#fenced-code-blocks を読むと Typora もコードブロックの言語指定に対応しているようです。このページの例だと ruby を指定してますね。
Overview Markdown is created by Daring Fireball; the original guideline is here. Its syntax, however, varies between different parsers or editors. Typora is using GitHub Flavored Markdown. Overview Block Elements Paragraph and line breaks Headers Blockquotes Lists Task List (Fenced) Code Blocks Math Blocks Tables Footnotes Horizontal Rules YAML Front Matter Table of Contents (TOC) Span Elements Links Internal Links Reference Links URLs Images Emphasis Strong Code Strikethrough Underlines Emoji :happy: Inline Math Subscript Superscript Highlight HTML Embed Contents Video Other HTML Support Block Elements Paragraph and line breaks A paragraph is simply one or more consecutive lines of text....
07:05 akabeko 
- 役名（ <strong> タグ）ではじまるセリフの段落を他の段落と区別できるようにclassをつける

の部分は

- 役名（ &lt;strong&gt; タグ）ではじまるセリフの段落を他の段落と区別できるようにclassをつける
```

のようにするのが簡単で影響も少ないと思います。
07:11 akabeko とりあえず小形さん本人だけが直せる本文に絞って修正していただき、Markdown 的な課題は私 or はるさめさんが後で手を入れる、という手もありますね。
08:51 小形克宏 akabekoさん、なるほど！　そういうことでしたか。
ご説明感謝です。了解しました。バッククォートでエスケープする方向で対処します。
今晩遅くにフィクス版をこちらに公開するつもりなので、それでまたチェックしてもらえませんか。
10:56 akabeko はい
13:52 小形克宏 懸案だったChromeでtype3フォントとして埋め込まれてしまうのを回避する方法について報告するのはいかがでしょう。
15:26 shinyu そうですね、問題とその解決方法については、もっと広められるように、Vivliostyle公式サイトに「よくある質問と回答」のページを作って検索しやすくしたいと思っています。
17:05 小形克宏 ようやく完成しました。大幅に書き加えました。
脚註、図版、キャプションなど田嶋さんのmdファイルを参考にさせていただきました。もちろん村上さん、akabekoさんのコメントも。
https://www.dropbox.com/s/ue6bssjhnaa2xwi/20190910_ogata.zip?dl=1

それでちょっと不安なのが以下の図8です。キャプションは下記の通り。
図8 物理プロパティで横組から縦組に切り換えようとする場合、横組のプロパティの値を、同じ数字の縦組のプロパティに書き移さなければならない。しかし論理プロパティでは数字とプロパティが縦組／横組で変わらないことから分かるように、こうした複雑な修整は不要だ
これで間違ってないかどうか、ご確認いただけるとありがたいです。
https://vivliostyle.slack.com/files/UJS3RCS86/FN5BW41DJ/fig_8.png
Clone this wiki locally