Package Exports

@neojp/tailwindcss-important-variant

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 (@neojp/tailwindcss-important-variant) to support the "exports" field. If that is not possible, create a JSPM override to customize the exports field for this package.

Readme

A utility-first CSS framework for rapidly building custom user interfaces.

Tailwind CSS `!important` variant

This is a Tailwind CSS plugin that adds an !important variant.

Maintained by: Joan Piedra → @neojp

Installation

Install as a node module with either npm or yarn on your command line

# Install via npm
npm install --save-dev @neojp/tailwindcss-important-variant

# Install via yarn
yarn add --dev @neojp/tailwindcss-important-variant

Add this module as a plugin on your Tailwind configuration file (tailwind.config.js).

module.exports = {
  plugins: [
      require('@neojp/tailwindcss-important-variant')
  ]
};

Use this plugin in your list of variants, either globally

module.exports = {
  variants: ['responsive', 'important']
};

Or per utility:

module.exports = {
  variants: {
    borderRadius: ['responsive', 'important']
  }
};

Usage

Use your Tailwind utility classes with an exclamation mark ( ! ) as a suffix.

<div class="rounded!"></div>

Output

Tailwind will be outputed as follows.

.rounded\! {
  border-radius: 0.25rem !important
}

Contributing

Feel free to submit a PR request, and send me a message on Twitter (@neojp) about it.

License

This project has been licensed under the Hippocratic License.

@neojp/tailwindcss-important-variant