re the apply only to large screens: you can either use conditions like i do in the tutorial (i.e. use ID attribute based on screen height)
…or use media queries in your css code. These basically work like conditions in bubble, but directly in the css code. e.g. you could use
<style>
@media (min-height: 815px) {
.dynamic-height {
height: 100vh !important;
}
}
</style>
in that case all elements with the class dynamic-height would be full height if the screen has a height of min 815 px. for smaller screens, the height attribute would not be applied.
and then apply this class to the page itself (i.e. the index) using classify
some background infos Using media queries - CSS: Cascading Style Sheets | MDN and height - CSS: Cascading Style Sheets | MDN