Greetings, Bubblers! With the power of the new responsive engine, I’m guessing there’s a way to achieve this, but is it possible to make a sidebar that fits 100% of the view height but the “page content” can scroll freely? I can’t seem to make it work. Here’s the problem I have currently:
Here’s what I want to achieve:
Not sure how to do it in the new editor but in the old I believe you could use a floating group that is tied to bottom and top.
Don’t know if you’ve already seen/tried it, but I made this example which spans 85% of the height. Changing it to 100% would be trivial. I have not, however, tried it within the context of a sidebar. Let us know if it works out.
-Steve
Sorry, missed the part about the button at the bottom of the sidebar remaining fixed. Here’s one approach…
There’s likely more than one way to go about it. You didn’t say how it should behave on narrower widths like mobile. This approach just satisfies what I understood the requirements to be from your post.
Thanks for that, @sudsy! Definitely is helping me get closer. I did notice, though, that this setup doesn’t seem to work when the “content” area extends off the screen (unless I’m missing something):
Any ideas?
Thanks for the reply, @sem! The problem I’ve run into with floating groups is the fact that they sit above the page content rather than operate as an extension of the page content itself. The reason I say this is I am wanting to create a “static” sidebar that, when hidden, slides out of sight and “brings” the page’s content with it. Here’s an example using a standard group + the awesome new responsive engine; notice the animated transition of the text on the right rather than an abrupt switch.
I can achieve the slide in/out effect. The problem, though, is I can’t get the “sidebar” content to remain fixed to viewport height while letting page content scroll.
That’s almost EXACTLY what I’m wanting to achieve, @adamhholmes! Brilliant technique. Makes me laugh because I had done something similar using the old engine, but never even thought to do so with the new! 
Thanks much. Now I’m just hoping the Bubble team lets us control expand/collapse transition speed.
In case anyone’s interested, I just posted an idea on the Ideaboard about this if they wish to upvote.
Yeah that’s the one thing missing here - being able to set the collapse animation speed to match the animation speed from the workflow (or to whatever speed you want) will make the UX much nicer. Hopefully we’ll get that option soon…
Ah, ok. I think I have the full picture now.
Here’s an alternative approach which doesn’t require a “spacer” group; and the sidebar footer remains in exactly in the same place relative to the sidebar, regardless of viewport height.
It also employs a “trick” I’ve used in other contexts - namely, using an invisible border instead of a margin for the “offset”. That way, one can use a transition, which affords some control over the animation.
-Steve
