Styling in a Livewire Form
I've recently upgraded from v2 to v3, but the styling in the Livewire form was wonky before that. It was just usable, now it's not.
In the Filament Admin Panel, the form displays nicely (image 1). In my Livewire component, not so much (image 2).
It gets worse if I try to put a FIle Upload control into a Livewire form. Instead of the beautiful and drag & drop interface, I get the browser's select file button and a mess of other text.
When I inspect the elements in the browser, the class names of the controls labels, divs, etc., seem to be consistent between those very different looks.
I'm sure I've missed a step or dependency somewhere. Unfortunately, after some internet searching and reading similar issues on this Discord, I'm fresh out of ideas of places to look.
In the Filament Admin Panel, the form displays nicely (image 1). In my Livewire component, not so much (image 2).
It gets worse if I try to put a FIle Upload control into a Livewire form. Instead of the beautiful and drag & drop interface, I get the browser's select file button and a mess of other text.
When I inspect the elements in the browser, the class names of the controls labels, divs, etc., seem to be consistent between those very different looks.
I'm sure I've missed a step or dependency somewhere. Unfortunately, after some internet searching and reading similar issues on this Discord, I'm fresh out of ideas of places to look.
Solution
I found it. This was an upgrade from Laravel 9, Tailwind 2, and Filament 2 to Laravel 10, Tailwind 3, and Filament 3.
There were changes that I needed to make to my tailwind.config.js file to reference the Filament presets. I may have missed that piece all the way back to the old version.
Like I said, the styling classes were there, they just weren't applying. Now they are.
There were changes that I needed to make to my tailwind.config.js file to reference the Filament presets. I may have missed that piece all the way back to the old version.
Like I said, the styling classes were there, they just weren't applying. Now they are.
