├── .gitignore
├── README.md
├── index.js
└── package.json


/.gitignore:
--------------------------------------------------------------------------------
1 | # tailwindcss-aspect-raito gitgnore
2 | .DS_STORE
3 | node_modules
4 | 


--------------------------------------------------------------------------------
/README.md:
--------------------------------------------------------------------------------
 1 | # !important Tailwind Plugin
 2 | 
 3 | ## Installation
 4 | 
 5 | Add this plugin to your project:
 6 | 
 7 | ```bash
 8 | # Install via npm
 9 | npm install --save-dev tailwindcss-important
10 | 
11 | # Install via yarn
12 | yarn add tailwindcss-important --dev
13 | ```
14 | 
15 | Adding variants through plugins is currently an experimental feature in tailwind and requires version 0.6.2 or higher.
16 | 
17 | ## Usage
18 | 
19 | The important plugin exposes an `important` variant for you to use by prepending `!` to your class names: `!text-white !bg-black`
20 | 
21 | ```js
22 | require('tailwindcss-important')()
23 | ```
24 | 
25 | ```js
26 | textColors: ['responsive', 'hover', 'important'],
27 | ```
28 | 
29 | ### Purgecss
30 | If you're using purgecss, you'll want to update your TailwindExtractor to include `!`.
31 | ```
32 | content.match(/[A-Za-z0-9-_:!\/]+/g) || [];
33 | ```
34 | 


--------------------------------------------------------------------------------
/index.js:
--------------------------------------------------------------------------------
 1 | module.exports = function() {
 2 |   return function({ addVariant }) {
 3 |     addVariant('important', ({ container }) => {
 4 |       container.walkRules(rule => {
 5 |         rule.selector = `.\\!${rule.selector.slice(1)}`
 6 |         rule.walkDecls(decl => {
 7 |           decl.important = true
 8 |         })
 9 |       })
10 |     })
11 |   }
12 | }


--------------------------------------------------------------------------------
/package.json:
--------------------------------------------------------------------------------
 1 | {
 2 |   "name": "tailwindcss-important",
 3 |   "version": "1.0.0",
 4 |   "description": "!important variant plugin for tailwindcss framework",
 5 |   "main": "index.js",
 6 |   "scripts": {
 7 |     "test": "echo \"Error: no test specified\" && exit 1"
 8 |   },
 9 |   "repository": {
10 |     "type": "git",
11 |     "url": "git+https://github.com/chasegiunta/tailwindcss-important.git"
12 |   },
13 |   "keywords": [
14 |     "tailwind",
15 |     "tailwindcss",
16 |     "plugin",
17 |     "tailwindcss-plugin"
18 |   ],
19 |   "author": "chasegiunta",
20 |   "license": "MIT",
21 |   "bugs": {
22 |     "url": "https://github.com/chasegiunta/tailwindcss-important/issues"
23 |   },
24 |   "homepage": "https://github.com/chasegiunta/tailwindcss-important#readme"
25 | }
26 | 


--------------------------------------------------------------------------------