function ScrollWrapper({ children, ...props }) {
  return (
    <div {...props}>
      <section style={{ ...style }}>
        <h1>⬇ Scroll Down ⬇</h1>
      </section>
      {children}
      <section style={{ ...style }}>
        <h1>⬆︎ Scroll up ⬆︎</h1>
      </section>
    </div>
  )
}
function ScrollWrapper({ children, ...props }) {
  return (
    <div {...props}>
      <section style={{ ...style }}>
        <h1>⬇ Scroll Down ⬇</h1>
      </section>
      {children}
      <section style={{ ...style }}>
        <h1>⬆︎ Scroll up ⬆︎</h1>
      </section>
    </div>
  )
}
function ScrollWrapper ( { children , ... props } ) { return ( < div { ... props } > < section style = { { ... style } } > < h1 > ⬇ Scroll Down ⬇</h1 > < / section > { children } < section style = { { ... style } } > < h1 > ⬆︎ Scroll up ⬆︎</h1> < / section > < / div > ) }
ScrollWrapper directs the user to scroll the page to reveal it's children.
Use this on Modules that have scroll and/or observer triggers.
ScrollWrapper directs the user to scroll the page to reveal it s children . Use this on Modules that have scroll and / or observer triggers .