score:1

Accepted answer

i think the best solution to your question is portals. you could easily do something like the following:

import { useintl } from "gatsby-plugin-intl"
import react, { useeffect, usecontext } from "react"
import reactdom from 'react-dom'
import { row, modal, button, form, col } from "react-bootstrap"
import bgtcontext from "../../context/bgt/bgtcontext"
import localization from "../../helpers/localization"

export default function sectionmodal({ show, onclose, section }) {
  const intl = useintl()
      
  return reactdom.createportal((
    <modal
      show={show}
      onhide={onclose}
      backdrop="static"
      keyboard={false}
      classname="bgt-modal-fullscreen"
    >
      <modal.header closebutton></modal.header>
      <modal.body>
        <p>hello world</p>
      </modal.body>
    </modal>
  ), document.queryselector(".main"));
}

Related Query

More Query from same tag