Is recordClasses broken in v3?

[emincer]

` public static function table(Table $table): Table
{
return $table
// ->recordClasses(fn (Model $record) => match ($record->priority) {
// 'Urgent' => 'line-through border-s-2 border-orange-600 dark:border-orange-300',
// default => null,
// })

        ->recordClasses(function (Model $record) {
            $classes = [];
        
            if ($record->completed_at) {
                $classes[] = 'line-through';
            }
        
            if ($record->priority === '1. Urgent') {
                $classes[] = 'border-s-2 border-orange-600 dark:border-orange-300';
            }
        
            dump(implode(' ', $classes));
            return implode(' ', $classes);
        })
       
        ->groups([
            Group::make('priority')
            ->getDescriptionFromRecordUsing(fn (ToDo $record): string => match ($record->priority) {
                '1. Urgent' => 'Needs to be done ASAP',
                '2. Easy' => 'A fast task you can knock off your list',
                '3. Short Term' => 'An ordinary task that can be done soon',
                '4. Long Term' => 'Requires more planning, time and possibly resources',
                default => 'Unknown priority', // Handle any other values

            })
            ->titlePrefixedWithLabel(false),`

Even the commented out section straight from the docs (except my field name) didn't work.

You can see on the screenshot that the combined classes are being returned but only line-through works. Front end is not my forte that's for sure. I know that CSS cascading can get complex but I thought the doc example classes might at least work.

I've gone waayyyyy down the rabbit hole and even tried a custom theme with a class name for urgent priority tasks and
tr.task-urgent td a { @apply !text-red-600; }
for the css. I confirmed that the class name is being applied but something somewhere overrides every time.

I just cannot seem to change a row's text color, border color or anything.

[leandrocfe]

try this using a custom theme

[emincer]

Tried that too. Made up a class name and defined that in the custom theme. I can see the class name come through on the browser by inspecting the element. I can even see the text color style, but something overrides it. The anchor tag for the link to edit seems to override. I know it’s possible to turn off edit as default behavior for the row, maybe that will help. But couldn’t find that in the docs.On Oct 15, 2023, at 2:09 AM, Leandro Costa Ferreira ***@***.***> wrote: try this using a custom theme —Reply to this email directly, view it on GitHub, or unsubscribe.You are receiving this because you authored the thread.Message ID: ***@***.***>

[emincer]

Here is a screenshot when I use a custom theme as @leandrocfe suggested. You can see the 'edit' is in red but not the data in the row.

Can someone tell me how to turn off edit for the entire row and rely just on the right side action buttons?

[leandrocfe]

Did you run npm run build, right?

[emincer]

Yes

…

On Oct 15, 2023, at 7:55 AM, Leandro Costa Ferreira ***@***.***> wrote: Did you run npm run build, right? — Reply to this email directly, view it on GitHub <#9108 (reply in thread)>, or unsubscribe <https://github.com/notifications/unsubscribe-auth/AAOQUHGHGTNFBJ53LR4FH53X7P2NHAVCNFSM6AAAAAA6AXBRTKVHI2DSMVQWIX3LMV43SRDJONRXK43TNFXW4Q3PNVWWK3TUHM3TEOBVGM2TA>. You are receiving this because you authored the thread.

[emincer]

This issue is beyond my skill level. I'll try to come back around and create a bug repo to demonstrate this when I can but it might be a while. I am pretty convinced it's a bug though. It seems like a specificity issue and that something from the table classes, be it at the tr or td level has higher specificity.

I could be wrong, that's as deep as I can go right now. But @danharrin just tagging you in as an FYI.

[ferox]

Yeah, that is definitely a bug @emincer

I'm having the same issue here.

E set the ->recordClasses('bg-red-300') to alter my row record and nothing happens.

Eve if I put an !important rule to my css like ->recordClasses('!bg-red-300') nothing happens.

When inspecting my page there is a css class injected on tag, but nothing happens.

As you can see the bd-red-300 is a native tailwind rule.

[leandrocfe]

https://x.com/leandrocfe/status/1801233185092542591
https://youtu.be/7SnzOjPV7ms?si=2s0LwVOg5X2YAkaw

These classes are not automatically compiled by Tailwind CSS. If you want to apply Tailwind CSS classes that are not already used in Blade files, you should update your content configuration in tailwind.config.js to also scan for classes inside your directory: './app/Filament/**/*.php'

[ferox]

https://x.com/leandrocfe/status/1801233185092542591 https://youtu.be/7SnzOjPV7ms?si=2s0LwVOg5X2YAkaw

These classes are not automatically compiled by Tailwind CSS. If you want to apply Tailwind CSS classes that are not already used in Blade files, you should update your content configuration in tailwind.config.js to also scan for classes inside your directory: './app/Filament/**/*.php'

So I have to create a theme to fix the issue??

[leandrocfe]

https://x.com/leandrocfe/status/1801233185092542591 https://youtu.be/7SnzOjPV7ms?si=2s0LwVOg5X2YAkaw

These classes are not automatically compiled by Tailwind CSS. If you want to apply Tailwind CSS classes that are not already used in Blade files, you should update your content configuration in tailwind.config.js to also scan for classes inside your directory: './app/Filament/**/*.php'

So I have to create a theme to fix the issue??

Yes

[ferox]

It works, thanks @leandrocfe !!!