Infinite height when using viewport units in theme

I've imported a custom theme in Boostrap Studio that contains a "hero" component, intended to have the full height of the window. To do that, my theme uses viewport height units. But when I use that component in a page in Bootstrap Studio, the page height grows infinitely. This only happens inside the app and when the rule is in the theme. The preview works fine, and if I add the same rule to a custom CSS and import that, or if I create the rule directly inside the app, the page displays correctly.

if you're willing to share a sampble .bsdesing i can look into that issue. I've run into different issues with full-height heroes not showing properly inside the app.

Thank you!

I've added both the sample theme CSS and the sample .bsdesign to this dropbox folder.

Sorry that you've run into this problem! This is a known limitation with the way vh/vw units are handled. Bootstrap Studio knows how to process vh and vw when they are written in the CSS but it doesn't do any processing to the theme CSS.

We will fix this in the future, but for now an easy workaround is to lave only the bootstrap code in the theme, and include your hero styles as a separate css file.

I see, thanks for explaining! I'll do that for now.