@ampless/plugin-highlight 0.1.0-beta.1 → 0.1.0-beta.2
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.ja.md +2 -0
- package/README.md +2 -0
- package/package.json +1 -1
package/README.ja.md
CHANGED
|
@@ -62,6 +62,8 @@ highlightPlugin({
|
|
|
62
62
|
|
|
63
63
|
**固定。** 明示テーマ（例: `theme: 'github-dark'`）を渡すと、サイトのスキームに関わらずそのスタイルシートに固定され、ライブ切替も無効になります。
|
|
64
64
|
|
|
65
|
+
> **カスタムダークテーマの注意。** `'auto'` は `data-color-scheme` / `prefers-color-scheme` のシグナルで判定し、テーマの見た目の暗さは見ません。テーマがダークなデザインでも `<html>` に `data-color-scheme="dark"` を設定していない場合、`'auto'` は light と判定して明テーマの `github` を読み込み、ダーク背景で低コントラストになります。その場合は `theme: 'github-dark'` を固定してください（またはテーマ側で `data-color-scheme="dark"` を設定）。
|
|
66
|
+
|
|
65
67
|
## コードブロックの検出方法
|
|
66
68
|
|
|
67
69
|
描画後の投稿 HTML から `<pre><code class="language-xxx">` を探し、`language-mermaid` は除外します。ampless のツールバーにあるコードブロック単位の **言語エディタ**が `language-*` クラスを付与し、どの本文フォーマットでも同じ形に着地します:
|
package/README.md
CHANGED
|
@@ -62,6 +62,8 @@ The scheme is detected at runtime, in this order:
|
|
|
62
62
|
|
|
63
63
|
**Pinning.** Pass an explicit theme (e.g. `theme: 'github-dark'`) to pin that stylesheet regardless of the site scheme and disable the live swap.
|
|
64
64
|
|
|
65
|
+
> **Custom dark themes:** `'auto'` keys off the `data-color-scheme` / `prefers-color-scheme` signal, **not** the theme's visual darkness. If your theme renders a dark design but doesn't set `data-color-scheme="dark"` on `<html>`, `'auto'` resolves to light and loads the light `github` stylesheet, which is low-contrast on the dark background. Pin `theme: 'github-dark'` in that case (or have the theme set `data-color-scheme="dark"`).
|
|
66
|
+
|
|
65
67
|
## How code blocks are detected
|
|
66
68
|
|
|
67
69
|
The plugin looks for `<pre><code class="language-xxx">` in the rendered post HTML and skips `language-mermaid`. The ampless toolbar's per-code-block **language editor** writes the `language-*` class, and all body formats land on the same shape:
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@ampless/plugin-highlight",
|
|
3
|
-
"version": "0.1.0-beta.
|
|
3
|
+
"version": "0.1.0-beta.2",
|
|
4
4
|
"description": "Syntax highlighting plugin for ampless — highlights `code.language-*` blocks on the public site via a lazily CDN-loaded highlight.js",
|
|
5
5
|
"license": "MIT",
|
|
6
6
|
"type": "module",
|