I'm trying to style the sidecart as a pop-up which overlays the main site content rather than animating in from the side. So far, the best approach I can think of is just by overriding the CSS from the responsive_styles.css stylesheet. This would involve forcing the translateX values of the div[data-fc-with-sidecart] to 0, and overriding all the styles of the div[data-fc-sidecart] and positioning it fixed and center.
This approach feels a bit hacky but I can't think of a better way. So one question is: am I missing something here?
The second question, which applies assuming the above approach is the way to go, is that I'm having a frustrating issue figuring out why all the fixed elements from the main site are no longer staying fixed (whilst the inspector shows that they are) but instead scrolling up with the page. I think the problem has arisen because the scrollbar is scrolling something other than the main content, and so while the content is fixed, it's moving up with its container. Any thoughts on what's going on here, and how it might be resolved (what needs overriding etc.)?