Skip to content

Commit 5d35f73

Browse files
author
Jonas Siewertsen
authored
Simplify adding css classes if using TailwindCSS (#22)
1 parent 0d90e57 commit 5d35f73

File tree

4 files changed

+7
-136
lines changed

4 files changed

+7
-136
lines changed

README.md

Lines changed: 7 additions & 34 deletions
Original file line numberDiff line numberDiff line change
@@ -104,49 +104,22 @@ The ordering does not matter. Classify will take care of that for you.
104104

105105
## Working With CSS Frameworks Like Tailwind CSS
106106

107-
Some CSS frameworks utilize JIT compiling, or have some other means of purging CSS classes from production builds to reduce file sizes. Classify provides a Laravel Artisan command to generate a JavaScript configuration file containing all Classify class names that can be used when configuring your CSS build process.
107+
Some CSS frameworks utilize JIT compiling, or have some other means of purging CSS classes from production builds to reduce file sizes.
108108

109-
Running the following command from the root of the project:
110-
111-
```
112-
php artisan classify:export
113-
```
114-
115-
Would create a new (or update an existing) `classify.config.js` JavaScript file containing your Classify class name configuration:
109+
Make sure to include your CSS classes as content, so TailwindCSS can include those in the compiled file. This is important, as your
110+
classify CSS classes may not be in your template files, as they will be added dynamically.
116111

117112
```js
118-
module.exports.classes = [
119-
"mt-8",
120-
"first:mt-0",
121-
"text-xs",
122-
"uppercase",
123-
];
124-
```
125-
126-
This configuration file can be used in conjunction with your CSS framework's build tools. For example, we can add our Classify class names to the Tailwind CSS 3 safe list ([https://tailwindcss.com/docs/content-configuration#safelisting-classes](https://tailwindcss.com/docs/content-configuration#safelisting-classes)):
127-
128-
Within `tailwind.config.js`:
129-
130-
```js
131-
const classify = require('./classify.config');
132-
133113
module.exports = {
134114
content: [
135-
'./pages/**/*.{html,js}'
136-
'./components/**/*.{html,js}',
115+
// all of your content files
116+
// './pages/**/*.{html,js}'
117+
// './components/**/*.{html,js}',
118+
'./config/classify.php',
137119
],
138-
safelist: [
139-
...classify.classes,
140-
'bg-red-500',
141-
'text-3xl',
142-
'lg:text-4xl',
143-
]
144-
// ...
145120
}
146121
```
147122

148-
> **Important**: Remember to run the `php artisan classify:export` command after making these changes to your Tailwind CSS configuration file before you build your front-end assets!
149-
150123
# More about us
151124
- [www.statamic-agency.com](https://statamic-agency.com)
152125
- [www.visuellverstehen.de](https://visuellverstehen.de)

src/Commands/Export.php

Lines changed: 0 additions & 41 deletions
This file was deleted.

src/ServiceProvider.php

Lines changed: 0 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -11,10 +11,6 @@ class ServiceProvider extends AddonServiceProvider
1111
\VV\Classify\Modifiers\Classify::class,
1212
];
1313

14-
protected $commands = [
15-
\VV\Classify\Commands\Export::class,
16-
];
17-
1814
public function boot()
1915
{
2016
parent::boot();

tests/Unit/ExportTest.php

Lines changed: 0 additions & 57 deletions
This file was deleted.

0 commit comments

Comments
 (0)