FilamentF
Filament•3y ago
friese

Tailwind content detection in custom theme not working

I setup a fresh installation of laravel 10 and filament 3.
Unfortunately I can't get the custom theme to work properly to get access to all the tailwind css classes.

I followed the steps in the documentation (https://filamentphp.com/docs/3.x/panels/themes#creating-a-custom-theme) to create a custom theme.
But when I run the build script (sail npm run build), I get this warning, and the classes used in my blade files are not available:
warn - The `content` option in your Tailwind CSS configuration is missing or empty.
warn - Configure your content sources or your generated CSS will be missing styles.
warn - https://tailwindcss.com/docs/content-configuration


resources/css/filament/admin/theme.css
@import '../../../../vendor/filament/filament/resources/css/theme.css';
@config './tailwind.config.js';


resources/css/filament/admin/tailwind.config.js
import preset from '../../../../vendor/filament/filament/tailwind.config.preset'

export default {
    presets: [preset],
    content: [
        './app/Filament/**/*.php',
        './resources/views/**/*.blade.php',
        './vendor/filament/**/*.blade.php',
    ],
}


vite.config.js
import { defineConfig } from 'vite';
import laravel from 'laravel-vite-plugin';

export default defineConfig({
    plugins: [
        laravel({
            input: [
                'resources/css/app.css',
                'resources/js/app.js',
                'resources/css/filament/admin/theme.css',
            ],
            refresh: true,
        }),
    ],
});


If I add a tailwind.config.js in the project root and add some content entries there, the warning disappears, but still the css classes are missing.
If I add a syntax error to the resources/css/filament/admin/tailwind.config.js the build process fails, so it appears to read it.

Can someone help me?
Themes - Panel Builder - Filament
Solution
I was missing /Tables/**/*.php', in the tailwind config..
Jump to solution
Was this page helpful?