razvan1033
Page header in topbar
I managed to move the page header into topbar.
Here's how I did this:
1. Create a custom layout based on
vendor/filament/filament/resources/views/components/layout/index.blade.php
Modify it so that it uses a custom sidebar and custom topbar
topbar is copied from vendor/filament/filament/resources/views/components/topbar/index.blade.php
sidebar is copied from vendor/filament/filament/resources/views/components/sidebar/index.blade.php
2. In topbar I removed the sections about tenancy and navigation since I won't use them and added an empty <div id="here-is-where-i-need-page-header" />
I also increased the height of the topbar.
3. In sidebar i just increased the height so it matches the topbar
4. Create custom header from vendor/filament/filament/resources/views/components/header/index.blade.php
Added @teleport('#here-is-where-i-need-page-header'). This id should match the one from point 2.
5. Create custom page from vendor/filament/filament/resources/views/components/page/index.blade.php
In my custom page i replaced the <x-filament-panels::header /> with my custom one <x-filament.header />
Here is how to use the new components.
In the custom page that you create, you should have the following:
The page view should use your custom page instead of <x-filament-panels::page /> created on point 5.
Now the page header should appear in the topbar.
Let me know what you think about this approach!12 replies