UI glitch/issue with a Page (Livewire component)

So, I made a filament page and I added a form with a file upload. This creates some weird UI glitches; the navigation dropdown is gone and the profile dropdown is opened and reversed. Is this because of me or a bug?
I read the doc according to:
https://filamentphp.com/docs/2.x/forms/layout
https://filamentphp.com/docs/2.x/forms/fields

<x-filament::page>
    <body>
        {{$this->form}}
    </body>
    <x-filament::card>
        <button wire:click="like">{{ $text }}</button>
    </x-filament::card>
</x-filament::page>

<x-filament::page>
    <body>
        {{$this->form}}
    </body>
    <x-filament::card>
        <button wire:click="like">{{ $text }}</button>
    </x-filament::card>
</x-filament::page>

Filament

Layout - Form Builder - Filament

The elegant TALL stack form builder for Laravel artisans.

Filament

Fields - Form Builder - Filament

The elegant TALL stack form builder for Laravel artisans.

Solution

Remove the body tags in your blade file. You’re confusing the browser. They are already part of the page component.

Jump to solution

Filament•3y ago•

42 replies

Matthew

UI glitch/issue with a Page (Livewire component)

<x-filament::page>
    <body>
        {{$this->form}}
    </body>
    <x-filament::card>
        <button wire:click="like">{{ $text }}</button>
    </x-filament::card>
</x-filament::page>

<x-filament::page>
    <body>
        {{$this->form}}
    </body>
    <x-filament::card>
        <button wire:click="like">{{ $text }}</button>
    </x-filament::card>
</x-filament::page>

Filament

Layout - Form Builder - Filament

The elegant TALL stack form builder for Laravel artisans.

Filament

Fields - Form Builder - Filament

The elegant TALL stack form builder for Laravel artisans.

Solution

Remove the body tags in your blade file. You’re confusing the browser. They are already part of the page component.

Jump to solution

UI glitch/issue with a Page (Livewire component)

UI glitch/issue with a Page (Livewire component)

Similar Threads

Similar Threads

Similar Threads