シンタックスハイライト機能を追加しました。

機能追加のお知らせです。

What's new?

コードブロックのシンタックスハイライト機能を追加し、より読みやすいUIを実現しました。この機能はPrismというJavaScriptライブラリを使用して実装しています。

Example

以下はシンタックスハイライト機能の適用前後のサンプルです。Prismは<pre class="language-*">の形式を読み取り、適切な色分けを行います。

Before:

// サンプルコードです
function highlightCode() {
    const blocks = document.querySelectorAll('pre code');
    blocks.forEach((block) => {
        Prism.highlightElement(block);
    });
}

After:

// サンプルコードです
function highlightCode() {
    const blocks = document.querySelectorAll('pre code');
    blocks.forEach((block) => {
        Prism.highlightElement(block);
    });
}