© 2026 Hedgehog Software, LLC

TwitterGitHubDiscord
More
CommunitiesDocsAboutTermsPrivacy
Search
Star
Setup for Free
FilamentF
Filament•2y ago•
35 replies
BKF Dev

Table recordClasses dark mode

Hello,
This piece of code works fine in default mode, but in dark no change (text-color, bg) !
->recordClasses(fn (Model $record) => match ($record->status) {
                QuotationStatusEnum::DRAFT => '!opacity-30',
                QuotationStatusEnum::CONFIRMED => '!border-l-4 !border-l-green-600 bg-green-50 dark:text-gray-900 dark:bg-green-30',
                QuotationStatusEnum::CANCELLED => '!border-l-4 !border-orange-600 bg-orange-50 dark:text-gray-900 dark:border-orange-300',
                default => null,
            })
->recordClasses(fn (Model $record) => match ($record->status) {
                QuotationStatusEnum::DRAFT => '!opacity-30',
                QuotationStatusEnum::CONFIRMED => '!border-l-4 !border-l-green-600 bg-green-50 dark:text-gray-900 dark:bg-green-30',
                QuotationStatusEnum::CANCELLED => '!border-l-4 !border-orange-600 bg-orange-50 dark:text-gray-900 dark:border-orange-300',
                default => null,
            })
Solution
try this
.table-row-green {
    @apply border-l-4 bg-success-50 !border-l-success-600 dark:bg-success-300;
}
.table-row-green .fi-ta-text-item-label {
    @apply text-success-900 dark:text-success-900;
}
.table-row-green {
    @apply border-l-4 bg-success-50 !border-l-success-600 dark:bg-success-300;
}
.table-row-green .fi-ta-text-item-label {
    @apply text-success-900 dark:text-success-900;
}

QuotationStatusEnum::CONFIRMED => 'table-row-green'
QuotationStatusEnum::CONFIRMED => 'table-row-green'
Jump to solution
Filament banner
FilamentJoin
A powerful open source UI framework for Laravel • Build and ship admin panels & apps fast with Livewire
20,307Members
Resources
Was this page helpful?

Similar Threads

Recent Announcements

Similar Threads

Table to dark mode
FilamentFFilament / ❓┊help
3y ago
dark mode
FilamentFFilament / ❓┊help
5mo ago
Dark-mode/Light-mode
FilamentFFilament / ❓┊help
3y ago
Filament Table Dark Mode with Jetstream and tailwinds dark mode changing using javascript.
FilamentFFilament / ❓┊help
3y ago