Filament•5w ago

Navigation item bottom

How can I place a navigation item only at the bottom of the sidebar?

9 Replies

Peppe•5w ago

maybe giving the highest value in the navigation sort?

XaviOP•5w ago

i need something like this

awcodes•5w ago

https://filamentphp.com/docs/3.x/support/render-hooks

Render hooks - Core Concepts - Filament

XaviOP•5w ago

yes, i try it with RenderHooks, but it needs a string, and NavigationGroup it's not a string. I can add a livewire component, but i must to replicate sidebar item and i don't know how

awcodes•5w ago

Well, you can’t just put a navigation item outside of the navigation. But you can make it look like one by copying the classes from the views.

Miguel García•5w ago

A css solution would be: - use the navigatioSort to push/sort the latest pages/resources (Mis compras y Hablamos) to the bottom of the list, - then use css to make 100 height all elements below the main aside item (using flex utilities for instance), - and then apply margin-top: auto to the nth li item (page/resource) that you wan to push to the bottom This css code should do the trick, but use it at your own risk, this might break your side menu if you add more groups, clusters, ... (not sure) or other side menus (if any):

aside.fi-sidebar > nav,
aside.fi-sidebar > nav > ul,
aside.fi-sidebar > nav > ul > li,
aside.fi-sidebar > nav > ul > li > ul {
    flex-grow: 1;
}

aside.fi-sidebar > nav > ul > li > ul > li:nth-last-child(2) {
    margin-top: auto;
}

aside.fi-sidebar > nav,
aside.fi-sidebar > nav > ul,
aside.fi-sidebar > nav > ul > li,
aside.fi-sidebar > nav > ul > li > ul {
    flex-grow: 1;
}

aside.fi-sidebar > nav > ul > li > ul > li:nth-last-child(2) {
    margin-top: auto;
}

Miguel García•5w ago

XaviOP•5w ago

It works perfect @Miguel García Thank you so much!!!

Miguel García•4w ago

@Xavi De res 😉

Gaming

Programming

Navigation item bottom