Package Exports

@brettsmason/tailwindcss-wordpress

This package does not declare an exports field, so the exports above have been automatically detected and optimized by JSPM instead. If any package subpath is missing, it is recommended to post an issue to the original package (@brettsmason/tailwindcss-wordpress) to support the "exports" field. If that is not possible, create a JSPM override to customize the exports field for this package.

Readme

Tailwind CSS WordPress Utility Classes

Tailwind CSS plugin for generating WordPress utility classes.

This plugin currently includes:

Editor Color Palette classes (.has-[color]-text-color and .has-[color]-background-class)
Editor Font Size classes (.has-[size]-font-size)
.screen-reader-text - WordPress specific accessibility class

Install

Install the plugin:

# Using npm
npm install @brettsmason/tailwindcss-wordpress --save-dev

# Using Yarn
yarn add @brettsmason/tailwindcss-wordpress -D

Add it to your tailwind.config.js file:

// tailwind.config.js
module.exports = {
  // ...
  plugins: [
    require('@brettsmason/tailwindcss-wordpress')
  ]
}

Usage

This plugin uses the keys editorColorPalette and editorFontSizes in your Tailwind config’s theme object to generate the utilities. Here is an example:

// tailwind.config.js
{
  theme: {
    editorColorPalette: {
      'primary': '#f2f2f2',
      'secondary': '#ccc',
    },
    editorFontSizes: {
      'small': '16px',
      'medium': '22px',
    },
  },
  plugins: [
    require('@brettsmason/tailwindcss-wordpress')(),
  ],
}