Skip to content

slack project markupdown 2020 01 21

akabeko edited this page Feb 15, 2020 · 1 revision

2020-01-21

Time (UTC) Icon Name Message
00:42 dynamis あ、そういうことでしたか。何か村上さんとお話ししたときとさっと調べた用語があってないなと思ってはいました。(こちら見落としてました、ご指摘感謝!)
<https://github.com/vivliostyle/discussion/wiki/slack-development-2019-12-07
00:42 Kiara Translation 🇬🇧: Oh, was that the case? When I talked to Mr. Murakami, I thought there wasn't a term I looked up quickly. (I overlooked this, thanks for pointing out!)
<https://github.com/vivliostyle/discussion/wiki/slack-development-2019-12-07
06:43 uetchy
HTML 埋め込みの嵐か変換後の HTML に class 付与作業が別途必要とかなるので。
これは本当に解決すべき問題です。各セクションにあるブロック要素に対してちょっとした視覚的差別化を与えたくなった場合でも、Markdownにそのような記法が存在しないためHTMLを書く羽目になってしまいます。
局所的にしか使用しないコンポーネントであればHTMLを書いても良いと考えることはできますが、頻出する単純なコンポーネントについては、糖衣構文によるサポートを受けられるようにしたいです。
06:43 Kiara Translation 🇬🇧: & gt; Because it is necessary to add class to HTML embedded storm or converted HTML.
This is really a problem to be solved. If you want to give a bit of visual differentiation to the block elements in each section, you still have to write HTML because Markdown does not have such a notation.
You can think that you can write HTML for components that are used only locally, but I would like to be able to receive support for sugary syntax for frequently occurring simple components.
06:47 uetchy それを解決するため、Scoped block(あるいはNamed block)という記法を導入します。

===section-author<br>uetchy<br>===<pre>これは<br></pre>&lt;div class="section-author"&gt;<br> &lt;p&gt;uetchy&lt;/p&gt;<br>&lt;/div&gt;
に変換されます。=の数を増やせばネストも出来ます。
これにより、CSSを使って特定のブロックの表現を制御することが出来るようになります。
構文については今後の議論で改善していきましょう。
06:47 Kiara Translation 🇬🇧: To solve it, we introduce a notation called Scoped block (or Named block).

`md<br>=== section-author<br>uetchy<br>=== <br>this is<br><br>`` html
& lt; div class = "section-author" & gt;
  & lt; p & gt; uetchy & lt; / p & gt;
& lt; / div & gt; `` `
Is converted to You can nest by increasing the number of =.
This allows you to control the representation of specific blocks using CSS.
We will improve the syntax in future discussions.
06:48 akabeko GFM のように HTML 埋め込みするものだと HTML はそのまま解釈されて内包された Markdown 記法は無視されます。
このルールを踏襲するなら、糖衣構文は HTML ではなく Markdown 側の拡張ですかね。

コード ブロックのように行頭に始点・終点の記法を設け、その範囲を &lt;div class="foo"&gt; とする。
すれ違いでしたが↑で @uetchy さんが提案しているような感じで。
06:49 Kiara Translation 🇬🇧: If you embed HTML like GFM, HTML is interpreted as it is and the included Markdown notation is ignored.
If you follow these rules, isn't sugar syntax an extension of Markdown, not HTML?

Set the notation of the start point and end point at the beginning of a line like a code block, and set the range to &amp; lt; div class =" foo "&amp; gt;.
It was a pass, but it looks like Pode proposed.
06:54 uetchy ### Nested named block

===section-author<br><br>uetchy<br><br>====author-homepage<br><https://uechi.io><br>====<br>===
&lt;div class="section-author"&gt;<br> &lt;p&gt;uetchy&lt;/p&gt;<br> &lt;div class="author-homepage"&gt;<br> &lt;a href="<https://uechi.io>"&gt;<https://uechi.io>&lt;/a&gt;<br> &lt;/div&gt;<br>&lt;/div&gt;
06:54 Kiara Translation 🇯🇵: ###ネストされた名前付きブロック

`md<br>===セクション作成者<br><br>エッチな<br><br>==== author-homepage<br><https://uechi.io><br>====<br>=== <br>`` html
&lt; div class = "section-author"&gt;
  &lt; p&gt; uetchy&lt; / p&gt;
  &lt; div class = "author-homepage"&gt;
    &lt; a href = "https://uechi.io"&gt; https://uechi.io&lt; / a&gt;
  &lt; / div&gt;
&lt; / div&gt; `` `
06:57 uetchy 画像の横カラム対応については、Deckset Markdown方言が参考になりました。
https://docs.deckset.com/English.lproj/Media/02-inline-images.html

![](img1)![](img2)
を2カラム画像と認識して、CSSでスタイリング出来るよう良い感じのHTMLに変換するイメージです。
Media, Working with Inline Images
06:57 Kiara Translation 🇬🇧: The Deckset Markdown dialect was helpful for supporting horizontal columns in images.
https://docs.deckset.com/English.lproj/Media/02-inline-images.html

`! [] (img1)! [] (img2)`
This is an image that recognizes as a two-column image and converts it into a nice-looking HTML that can be styled with CSS.
07:01 uetchy 内側のコンテンツはVFMとして解釈されパースされます。VFMにはHTMLを埋め込めるため、名前付きブロックの内側ではVFMとHTML両方が使えます。
07:01 Kiara Translation 🇬🇧: The inner content is interpreted and parsed as VFM. Since VFM can embed HTML, that is, both VFM and HTML can be used inside a named block.
07:16 spring-raining PHP Markdown Extraでは同じ問題を解決するためのAttribute文法があります。 {.class #id} のようなAttributeを決められた場所につける拡張文法です
07:16 Kiara Translation 🇬🇧: PHP Markdown Extra has an Attribute syntax to solve the same problem. An extended grammar that attaches an attribute such as {.class #id} at a certain place
07:19 spring-raining 任意のDiv要素が作れるかは分からないですが、例えばPandocでオプションを有効にすると以下のような変換をしてくれます
## heading {#foo .bar}<pre>↓</pre>&lt;h2 id="foo" class="bar"&gt;heading&lt;/h2&gt;
07:19 Kiara Translation 🇬🇧: I do not know if you can create any Div element, but if you enable the option in Pandoc, for example, the following conversion will be done
`## heading {#foo .bar}`

`&amp; lt; h2 id =" foo "class =" bar "&amp; gt; heading &amp; lt; / h2 &amp; gt;`
07:20 uetchy https://michelf.ca/projects/php-markdown/extra/#fenced-code-blocks
Fenced Code Blocks知らなかった
めちゃくちゃ記法が似ているけど、逆に発想が間違ってないことを再確認できました😂
07:20 Kiara Translation 🇬🇧: https://michelf.ca/projects/php-markdown/extra/#fenced-code-blocks
Fenced Code Blocks I didn't know
It reminds me that the notation is similar, but the idea is not wrong: joy:
07:22 uetchy @spring-raining さんが例示してくれたような、インライン記法による名前空間指定もできるようにしたいですね
07:22 Kiara Translation 🇬🇧:  I would like to be able to specify namespaces using inline notation as exemplified by Mr.
15:29 shinyu
GFM のように HTML 埋め込みするものだと HTML はそのまま解釈されて内包された Markdown 記法は無視されます。
これについて疑問に思い、GFMの HTML blocks の仕様を確認したところ、HTMLブロックは空白行を入れればそこで終わるので、開始タグと終了タグとのあいだの Markdown 記法が無視されないようにすることができます。例:

&lt;div class="foo"&gt;<br><br>* this is *markdown* list item<br><br>&lt;/div&gt;
したがって、糖衣構文を定義するのであっても、タグ+空白行に変換することでGFMへの変換ができます。

https://github.github.com/gfm/#html-blocks
15:29 Kiara Translation 🇬🇧: & gt; If you embed HTML like GFM, HTML will be interpreted as it is and the included Markdown notation will be ignored.
I wondered about this and checked the specifications of GFM's HTML blocks, HTML block ends with a blank line, so Markdown notation between start and end tags can be prevented from being ignored . Example:

`&amp; lt; div class =" foo "&amp; gt;<br><br>* this is * markdown * list item<br><br>&amp; lt; / div &amp; gt; `
Therefore, even if you define sugar coating syntax, you can convert to GFM by converting to tag + blank line.

https://github.github.com/gfm/#html-blocks
22:21 akabeko 空行を入れればよかったのですね。
HTML タグもコード ブロックなどと同様に開始から終了までを複数行に渡って一括変換する想定でしたが、そうでないとは。
22:21 Kiara Translation 🇬🇧: I wish I had a blank line.
HTML tags, like code blocks, are supposed to be converted all at once from the beginning to the end over multiple lines, but that is not the case.
Clone this wiki locally