Citizen Comments - Answer Overflow

Citizen

Posts Comments

FFilament

•Created by Citizen on 4/23/2025 in #❓┊help

Is it possible to use Filament 3 without downgrading Tailwind 4 to 3 if no custom themes are used?

All good my dude I appreaciate the contribution

21 replies

FFilament

•Created by Citizen on 4/23/2025 in #❓┊help

Is it possible to use Filament 3 without downgrading Tailwind 4 to 3 if no custom themes are used?

I think that's this: https://gist.github.com/thaqebon/994d5d8ba1d3b9643de8c32b2400e2c7

21 replies

FFilament

•Created by Citizen on 4/23/2025 in #❓┊help

Is it possible to use Filament 3 without downgrading Tailwind 4 to 3 if no custom themes are used?

Makes sense

21 replies

FFilament

•Created by Citizen on 4/23/2025 in #❓┊help

Is it possible to use Filament 3 without downgrading Tailwind 4 to 3 if no custom themes are used?

got it

21 replies

FFilament

•Created by Citizen on 4/23/2025 in #❓┊help

Is it possible to use Filament 3 without downgrading Tailwind 4 to 3 if no custom themes are used?

On the same note, I think the directions here are a little confusing as well: https://filamentphp.com/docs/3.x/tables/installation#installing-tailwind-css. Each section has it's own installation instructions and they all say that you must downgrade tailwind. Is that actually the case if you want to install these packages on their own? Or is it only true if you want to customize the css through vite?

21 replies

FFilament

•Created by Citizen on 4/23/2025 in #❓┊help

Is it possible to use Filament 3 without downgrading Tailwind 4 to 3 if no custom themes are used?

Yeah there's a copy of it here https://filamentphp.com/docs/3.x/panels/themes#creating-a-custom-theme but I think what the docs are missing is super confidence in what to do from someone on the outside and how to help make those decisions. Happy to submit a PR on it once I test out the options

21 replies

FFilament

•Created by Citizen on 4/23/2025 in #❓┊help

Is it possible to use Filament 3 without downgrading Tailwind 4 to 3 if no custom themes are used?

Ok cool I'll give it a shot and if it works I'll submit a PR

21 replies

FFilament

•Created by Citizen on 4/23/2025 in #❓┊help

Is it possible to use Filament 3 without downgrading Tailwind 4 to 3 if no custom themes are used?

I mean that looks good to me. How do we go about excluding it from vite?

21 replies

FFilament

•Created by Citizen on 4/23/2025 in #❓┊help

Is it possible to use Filament 3 without downgrading Tailwind 4 to 3 if no custom themes are used?

And it seems like if we did the npx route, we'd also need a final quick step to exclude filament from tailwind4's autodiscovery since the custom themes have tailwind configs and the panel providers specify the vite theme.

21 replies

FFilament

•Created by Citizen on 4/23/2025 in #❓┊help

Is it possible to use Filament 3 without downgrading Tailwind 4 to 3 if no custom themes are used?

Does it make sense for me to update the docs here? https://filamentphp.com/docs/3.x/actions/installation#installing-tailwind-css kinda seems like there's no scenario where downgrading is the right choice. For frequently updated theming, it sounds like @awcodes option is the right choice, and for infrequently updated, using npx for just the theme is the way to go. Dennis, do you have an example for that that I could use? I'm not familiar with using npx and I see two attempts here https://www.answeroverflow.com/m/1346411514353160212 and here https://github.com/filamentphp/filament/issues/15774 but neither seems like a clean one-liner for this minimalist use case.

21 replies

FFilament

•Created by Citizen on 4/23/2025 in #❓┊help

Is it possible to use Filament 3 without downgrading Tailwind 4 to 3 if no custom themes are used?

Just to update, based on my test the answer is yes. I disabled my custom themes and it appears I have Filament 3 working just fine in Laravel 12 with Tailwind 4 and everything looks fine. The only exception is the Overwatch plugin because (accorind to their docs) a custom theme must be used. So my plan is to disable Overwatch and launch without downgrading to Tailwind 3 unless someone has something I haven't thought of that this will create problems with. Any warnigns of doom if I don't downgrade? Is it worth updating the documentation? If yes, I'm happy to do a PR for it.

21 replies

FFilament

•Created by Citizen on 2/11/2025 in #❓┊help

How can I re-use the filament boolean icon in more places?

I found the icon documentary page but maybe I'm doing something wrong here:

->icon(static fn (User $record) => $record->phone_verified_at ? 'infolists::components.icon-entry.true' : 'infolists::components.icon-entry.true')

3 replies

FFilament

•Created by Citizen on 2/11/2025 in #❓┊help

Why are my dashboard panels so small?

Oh snap, you were right but in the other direction. I needed to add it to my admin tailwind config, not the project root one. Thank you!!!

10 replies

FFilament

•Created by Citizen on 2/11/2025 in #❓┊help

Why are my dashboard panels so small?

Here's my actual tailwind config:

import defaultTheme from 'tailwindcss/defaultTheme';
import forms from '@tailwindcss/forms';
import typography from '@tailwindcss/typography';

/** @type {import('tailwindcss').Config} */
export default {
    content: [
        './vendor/laravel/framework/src/Illuminate/Pagination/resources/views/*.blade.php',
        './vendor/laravel/jetstream/**/*.blade.php',
        './storage/framework/views/*.php',
        './resources/views/**/*.blade.php',
        './vendor/awcodes/overlook/resources/**/*.blade.php',
    ],

    theme: {
        extend: {
            fontFamily: {
                sans: ['Figtree', ...defaultTheme.fontFamily.sans],
            },
        },
    },

    plugins: [forms, typography],
};

import defaultTheme from 'tailwindcss/defaultTheme';
import forms from '@tailwindcss/forms';
import typography from '@tailwindcss/typography';

/** @type {import('tailwindcss').Config} */
export default {
    content: [
        './vendor/laravel/framework/src/Illuminate/Pagination/resources/views/*.blade.php',
        './vendor/laravel/jetstream/**/*.blade.php',
        './storage/framework/views/*.php',
        './resources/views/**/*.blade.php',
        './vendor/awcodes/overlook/resources/**/*.blade.php',
    ],

    theme: {
        extend: {
            fontFamily: {
                sans: ['Figtree', ...defaultTheme.fontFamily.sans],
            },
        },
    },

    plugins: [forms, typography],
};

10 replies

FFilament

•Created by Citizen on 2/11/2025 in #❓┊help

Why are my dashboard panels so small?

My bad, the tailwind config I pasted was the one from my admin panel, not the overall, I'll check the real one

10 replies

FFilament

•Created by Citizen on 2/11/2025 in #❓┊help

Why are my dashboard panels so small?

No worries. Size doesn't matter. I tried explaining this to my wife but apparently she's not a filament expert. I did run both assets and upgrade, and they're part of my composer.json scripts. I just realized that these widgets are generated by overlook. I think I did follow the steps and I made a custom theme. That theme file is just this:

@import '/vendor/filament/filament/resources/css/theme.css';

@config 'tailwind.config.js';

@import '/vendor/filament/filament/resources/css/theme.css';

@config 'tailwind.config.js';

and my tailwind config:

import preset from '../../../../vendor/filament/filament/tailwind.config.preset'

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

import preset from '../../../../vendor/filament/filament/tailwind.config.preset'

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

about yields this:

Filament .......................................................................................  
  Blade Icons ............................................................................. CACHED  
  Packages ....................................... filament, forms, notifications, support, tables  
  Panel Components ........................................................................ CACHED  
  Version ............................................................................... v3.2.139  
  Views ............................................................................ NOT PUBLISHED

Filament .......................................................................................  
  Blade Icons ............................................................................. CACHED  
  Packages ....................................... filament, forms, notifications, support, tables  
  Panel Components ........................................................................ CACHED  
  Version ............................................................................... v3.2.139  
  Views ............................................................................ NOT PUBLISHED