GadgetLogs

GitHub Alert Blocks

blog

GitHub Alert Blocks

GitHub では、> [!NOTE]> [!WARNING] のようなアラート記法がそのまま使えますが、
GitHub Pages や、Markdown を HTML に変換する静的サイトでは、見た目が再現されません。

そこで、GitHub のアラートスタイルをちょっとだけ読み解いて、
必要な部分だけを抽出して、 CSS としてまとめたライブラリを作りました

GitHub Alert Blocks は、
GitHub のアラートブロックに使われている色、余白、アイコン、ボーダーの感覚を、
最小限の実装で再現することを目指しています。

今後は、次のような拡張も少しずつ進めていく予定です。

興味がある人は、ぜひ触ってみてください。小さな試みですが、Markdown を少しだけ上品にしたいときには役に立つかもしれません

[!NOTE] NOTE本文内容1
NOTE本文内容2

[!TIP] TIP本文内容1

[!IMPORTANT] IMPORTANT本文内容1

[!WARNING] WARNING本文内容1

[!CAUTION] CAUTION本文内容1