#AppShell : Sticky middle section?

6 messages · Page 1 of 1 (latest)

fading minnow
#

I want to create a chat app and only have the Left navigation panel and the right aside (I have already removed the top navbar and footer).

If I want the center panel to be a scrolling chat with a sticky input at the bottom, is there a way I could accomplish this with current Mantine components? Currently it seems the whole central panel scrolls while the left and right panels are stationary.

Applying some css styling to the central panel is proving to be a bit tricky to accomplish what I need, so is there a nice clean way of doing this with a particular Mantine component?

fading minnow
#

Thanks for the example! Unfortunately I'm running into the same problem I was hitting with my own solution:

#

The middle panel scrolls the text, but you can see how the footer is off at the bottom so the entire middle div also scrolls

#

Only solution so far is to make the height smaller than 100vh, but it is not consistent for different size screens - not optimal.