Filament•5w ago

On sm, filament admin panel nav at the bottom of the screen

On sm screens, i want the filament admin panel navbar to be at the bottom of the screen, how would u achieve it?

10 Replies

ericmpOP•4w ago

bump

toeknee•4w ago

You would need to override the views or add a custom view which renders the bottom bar and hides the top

ericmpOP•4w ago

hmm sounds difficult have u ever done it in some of ur projects? @toeknee

toeknee•4w ago

Nope, not a requirement really.

Vp•4w ago

You can use these css

.fi-topbar {
    top: unset;
    bottom: 0;
    position: fixed;
    width: 100%;
}

.fi-main {
    padding-bottom: 60px;
}

.fi-topbar {
    top: unset;
    bottom: 0;
    position: fixed;
    width: 100%;
}

.fi-main {
    padding-bottom: 60px;
}

Just check only from browser, so transform to TW and or specify sm screen

ericmpOP•4w ago

hmm if i apply this and i use the global search, the styles broke? or is cool? okayyyy

Vp•4w ago

the user menu also not looking good, I show you how you can transform, the rest you have to figure out since filament is not design to behave like this.

ericmpOP•4w ago

okay yeah. well thanks (: i asked this question since a lot of my users think that on mobile, the top navbar should be on bottom. is just much easier to reach it with the finger than in the top of the screen u know but yah as filament is not designed by default to behave like this it may be too much customisation and perhaps i may not do this change since i guess it will break a lot of stuff of the ui (,:

Ali•4w ago

I agree with you

ericmpOP•4w ago

in case someone finds an easy solution for this. please let others know ^^, in this thread for example. ill do it too maybe we could build like a filament plugin or so hmmm. if i had the knowledge, id try to PR it to the filament core xd. bottom navbars r very interesting

Gaming

Programming

On sm, filament admin panel nav at the bottom of the screen