Communitygithub.com

papopporking-oss/opencode-nextjs-standard

daisyUI 5 の設定オプション

opencode-nextjs-standard とは?

このスキルは dadyUI 5 の設定方法を説明するものです。daisyUI は Tailwind CSS 用のコンポーネントライブラリであり、CSS プラグインとして設定可能です。主な設定項目として、利用するテーマの指定、デフォルトテーマや prefers-color-scheme 対応テーマの設定、ルート要素(:root)の指定、読み込む/除外するコンポーネント、クラスプレフィックス、ログ出力の有無などがあります。このスキルは、OpenCode などの環境で daisyUI の動作をカスタマイズしたい開発者を対象としており、具体的なコード例とともに設定の書き方を提供します。

対応~Claude Code~Codex CLI~Cursor✓OpenCode
npx skills add https://github.com/papopporking-oss/opencode-nextjs-standard/tree/HEAD/.agents/skills/daisyui/config

お気に入りのAIに質問する

このエージェントスキルを事前に読み込んだ状態で新しいチャットを開きます。

ドキュメント

設定

daisyUI 5 設定ドキュメント: https://daisyui.com/docs/config/

設定なしの daisyUI:

@plugin "daisyui";

light テーマのみを使用する daisyUI 設定:

@plugin "daisyui" {
  themes: light --default;
}

すべてのデフォルト設定を使用する daisyUI:

@plugin "daisyui" {
  themes: light --default, dark --prefersdark;
  root: ":root";
  include: ;
  exclude: ;
  prefix: ;
  logs: true;
}

設定例: この設定では、組み込みのテーマをすべて有効にします。bumblebee テーマがデフォルトテーマです。synthwave テーマは prefersdark テーマであり、デフォルトのダークモードとして機能します。 有効化された他のテーマを使用するには、<html> 要素に data-theme="THEME_NAME" を追加します。 この設定はルートのスクロールバーガターを除外します。すべての daisyUI クラスに daisy- プレフィックスを使用し、コンソールログを無効にします。

@plugin "daisyui" {
  themes: light, dark, cupcake, bumblebee --default, emerald, corporate, synthwave --prefersdark, retro, cyberpunk, valentine, halloween, garden, forest, aqua, lofi, pastel, fantasy, wireframe, black, luxury, dracula, cmyk, autumn, business, acid, lemonade, night, coffee, winter, dim, nord, sunset, caramellatte, abyss, silk;
  root: ":root";
  include: ;
  exclude: rootscrollgutter, checkbox;
  prefix: daisy-;
  logs: false;
}

Individual skills in this repo

This repo contains 4 individual skills — each has its own dedicated page.

関連スキル