Starlight のコンポーネント

ページでは Starlight 標準のコンポーネントと RefineUI のコンポーネントを混ぜて使えます。テーマが標準コンポーネントを同じトークンで描き直すので、両者は同じように見えます。

Aside

ノート

ノートは情報の色を使います。

ヒント

ヒントは成功の色を使います。

設定を確認してください

注意は警告の色を使います。

危険

危険はエラーの色を使います。

Badge

Default Note Tip Caution Danger Success

Tabs

bun

bun add @pelagornis/page

npm

npm install @pelagornis/page

Steps

1. プラグインをインストールします。

2. Starlight の plugins に pagePlugin() を追加します。

3. dev サーバーを起動します。

Card

シェル

ヘッダー、サイドバー、検索、フッターは RefineUI です。

コンポーネント

すべての RefineUI コンポーネントは @pelagornis/page/components から使えます。

はじめにテーマをインストールしてプラグインを登録します。

ファイルツリー

• astro.config.ts
• markdoc.config.mjs
• ディレクトリsrc/

  • ディレクトリcontent/

    • ディレクトリdocs/

      • index.mdx
      • ディレクトリguides/

        • getting-started.mdx