next() Packaged Middleware

    @jumpu-ui/tailwindcss

    1.0.1-alpha.4 • Public • Published

    @jumpu-ui/tailwindcss

    @jumpu-ui/tailwindcss パッケージは Jumpu UI の TailwindCSS プラグインです。

    Storybook

    https://tuqulore.github.io/jumpu-ui/

    ステータス

    現在不安定リリースのみ提供しています。安定リリースまで破壊的な変更が含まれる可能性があります。

    使い方

    パッケージをプロジェクトにインストールします。

    npm i -D @jumpu-ui/tailwindcss

    tailwind.config.js に TailwindCSS プラグインとして使用するように設定します。このとき、変数 jumpu は各コンポーネントごとの TailwindCSS プラグインを含んだ配列です。すべて使用したい場合は、スプレッド構文などによって展開してください。

    const jumpu = require("@jumpu-ui/tailwindcss");
    
    module.exports = {
      content: ["src/**/*.tsx"],
      theme: {
        extend: {},
      },
      plugins: [...jumpu],
    };

    一部が使用したい場合は、個別に使用したいプラグインを設定してください。

    const button = require("@jumpu-ui/tailwindcss/button");
    const outlinedButton = require("@jumpu-ui/tailwindcss/outlinedButton");
    const textButton = require("@jumpu-ui/tailwindcss/textButton");
    
    module.exports = {
      content: ["src/**/*.tsx"],
      theme: {
        extend: {},
      },
      plugins: [button, outlinedButton, textButton],
    };

    設定

    Jumpu UI は theme を拡張しています。拡張した値に対してカスタマイズすることができます。

    jumpu.prefix

    jumpu.prefix は Jumpu UI コンポーネントクラスの接頭辞を設定します。デフォルトは "jumpu-" です。

    接頭辞を取り除きたい場合は、空文字列を設定してください。

    theme: {
      extend: {
        jumpu: {
          prefix: "";
        }
      }
    }

    spacing

    rel1 であれば 0.25em となるような相対サイズのスケールを追加しています。

    colors

    • primary: UI コンポーネントで用いられるプライマリカラー。デフォルトは require("tailwindcss/colors").colors.blue
    • white: 白色。デフォルトは require("tailwindcss/colors").white
    • black: 黒色。デフォルトは require("tailwindcss/colors").black
    • success: 成功のステータス色。デフォルトは #00A93E
    • emphasis: 強調のステータス色。デフォルトは #FF002E
    • warning: 警告のステータス色。デフォルトは #FACC15
    • danger: 危険のステータス色。デフォルトは #B80000

    開発

    DEVELOPMENT.mdを参照してください。

    Keywords

    Install

    npm i @jumpu-ui/tailwindcss

    DownloadsWeekly Downloads

    37

    Version

    1.0.1-alpha.4

    License

    MIT

    Unpacked Size

    53.3 kB

    Total Files

    36

    Last publish

    Collaborators

    • knokmki612