New Light Theme issue for Notifications
In filament 3.2.132, i am setting notification like this
public function success(string $title = 'Success', string $body = '', string $icon = 'heroicon-o-check-circle', int|string|null $duration = null, array|ActionGroup|Closure $actions = []): Notification
{
$duration = $duration ?? $this->duration;
return Notification::make()
->title($title)
->body($body)
->success()
->color('success')
->icon($icon)
->iconColor('success')
->duration($duration)
->actions($actions)
->send();
}
in Create Action:
Actions\CreateAction::make()->successNotification(fn () => Toast::success(title: 'Success')),
in dark mode its fine but in light theme it doesn't look good
Solution:Jump to solution
finally i found where i made a mistake, sorry for wasting your time and thanks for your cooperation. Actually i overload the filament app.css using PanelsRenderHook::HEAD_END with the default resources/css/app.css
19 Replies
->color('success') this one not looks good in new light theme
i mean setting the built-in background color functionality not looks good
What is „New Light Theme“? A plugin?
i don't install any plugin, i freshly installed filament project and i changed the theme mode to light in profile section then this theme is changed i don't change any default colors in filament
Your screenshot doesn’t look like light theme though
but i do artisan optimize:clear and filament:clear still i get this color in light mode
What’s the output of
artisan about for the filament section?Filament ...............................................................................................................
Blade Icons ................................................................................................. NOT CACHED
Packages ............................................................... filament, forms, notifications, support, tables
Panel Components ............................................................................................ NOT CACHED
Version ....................................................................................................... v3.2.132
Views .................................................................................................... NOT PUBLISHED
Blade Icons ................................................................................................. NOT CACHED
Packages ............................................................... filament, forms, notifications, support, tables
Panel Components ............................................................................................ NOT CACHED
Version ....................................................................................................... v3.2.132
Views .................................................................................................... NOT PUBLISHED
Hmm, can you run
npm run build?
Also,what about livewire?i working in development and livewire version 3.5.12
Hm looks good.
How to fix it?
Can you check where the blueish styles come from through DevTools?
Can you please explain it more?
Open DevTools, Inspect some Element and check where the CSS declarations come from. Especially the blue tones. Light mode should be white as in https://demo.filamentphp.com
But the demo site version is not the latest one
Again i installed the fresh filament project it also shows the light theme mode of the same new light theme i shared
I just installed a fresh Laravel project with Filament and can't replicate the issue.
Please check our DevTools
Could it be that he didn't run
npm install && npm run build?He said it's fresh Filament without any plugins. I don't expect a custom theme.
Solution
finally i found where i made a mistake, sorry for wasting your time and thanks for your cooperation. Actually i overload the filament app.css using PanelsRenderHook::HEAD_END with the default resources/css/app.css