"True" full height hero on mobile

[huygn]

window.innerHeight is your best bet.

Below method work on both android/chrome and ios/safari. One caveat is that you will see a flash from 100vh to window.innerHeight (at least on https://dautu.io) because the initial html is static-generated, and window is only avaible on client side.

componentDidMount() {
  this.container.style.minHeight = `${window.innerHeight}px`
}

<div ref={this.setRef} className="min-h-screen">...</div>