Custom page color

I have created a livewire page that extends the

SimplePage

SimplePage

. I have copied the setup from RegisterPage and LoginPage, but my question is how can I set the primary color?

You can see the "blue" primary color on the login page, but the simple page I have created to accept a user invite is yellow (the default color I guess).

Is there a way I can get the blue primary color I have defined in the provider?

 ->colors([
    'primary' => "#39afd1",
])

 ->colors([
    'primary' => "#39afd1",
])

The component is attached

And this is the view

<x-filament-panels::page.simple>

    <x-filament-panels::form wire:submit="create">
        {{ $this->form }}

        <x-filament-panels::form.actions
            :actions="$this->getCachedFormActions()"
            :full-width="true">
        </x-filament-panels::form.actions>
    </x-filament-panels::form>

</x-filament-panels::page.simple>

<x-filament-panels::page.simple>

    <x-filament-panels::form wire:submit="create">
        {{ $this->form }}

        <x-filament-panels::form.actions
            :actions="$this->getCachedFormActions()"
            :full-width="true">
        </x-filament-panels::form.actions>
    </x-filament-panels::form>

</x-filament-panels::page.simple>

Do I need to define in the component which panel this should be connected to? Because what if I have multiple panels and create a custom component to each of them, how can I "inherit" the panel style?

Any help is appreciated

Thanks

AcceptInvitation.php1.7KB

Solution

add in the appserviceprovider

use Filament\Support\Colors\Color;
use Filament\Support\Facades\FilamentColor;
FilamentColor::register(['primary' => '#39afd1']);

use Filament\Support\Colors\Color;
use Filament\Support\Facades\FilamentColor;
FilamentColor::register(['primary' => '#39afd1']);

Jump to solution

Custom page color

I have created a livewire page that extends the

SimplePage

SimplePage

 ->colors([
    'primary' => "#39afd1",
])

 ->colors([
    'primary' => "#39afd1",
])

The component is attached

And this is the view

<x-filament-panels::page.simple>

    <x-filament-panels::form wire:submit="create">
        {{ $this->form }}

        <x-filament-panels::form.actions
            :actions="$this->getCachedFormActions()"
            :full-width="true">
        </x-filament-panels::form.actions>
    </x-filament-panels::form>

</x-filament-panels::page.simple>

<x-filament-panels::page.simple>

    <x-filament-panels::form wire:submit="create">
        {{ $this->form }}

        <x-filament-panels::form.actions
            :actions="$this->getCachedFormActions()"
            :full-width="true">
        </x-filament-panels::form.actions>
    </x-filament-panels::form>

</x-filament-panels::page.simple>

Thanks

AcceptInvitation.php1.7KB

Solution

add in the appserviceprovider

use Filament\Support\Colors\Color;
use Filament\Support\Facades\FilamentColor;
FilamentColor::register(['primary' => '#39afd1']);

use Filament\Support\Colors\Color;
use Filament\Support\Facades\FilamentColor;
FilamentColor::register(['primary' => '#39afd1']);

Jump to solution

Custom page color

Custom page color

Similar Threads

Similar Threads

Similar Threads