modal.jsx

{
  <div>
          <Modal show={open} onHide={handleClose} className="pt-5 " size="lg">
            <div className="linee">
              <MdCancel onClick={handleClose} />
            </div>
            <div>
              {' '}
              <Modal.Title className="titt">{selectedPost?.title}</Modal.Title>
            </div>
            <div className="okokok mt-4">
              <div className="rigyt">
                By <span className="sly">Sylvester Nnachi</span>
              </div>
              <div className="rigyt">
                {' '}
                {formatDate(selectedPost?.dateAdded)}
              </div>

              <div className="rigyt">4 Mins read</div>
            </div>

            <div className="okokok pt-3 pb-4">
              <div className="key">
                <a
                  href="https://web.facebook.com/vestarplusng"
                  target="_blank"
                  style={{ textDecoration: 'none', color: 'black' }}
                >
                  <FaFacebookF />
                </a>
              </div>
              <div className="key">
                <a
                  href="https://www.instagram.com/vestarplus/"
                  target="_blank"
                  style={{ textDecoration: 'none', color: 'black' }}
                >
                  <FaInstagram />
                </a>
              </div>
              <div className="key">
                <a
                  href="https://twitter.com/vestarplus"
                  target="_blank"
                  style={{ textDecoration: 'none', color: 'black' }}
                >
                  <FaTwitter />
                </a>
              </div>
              <div className="key">
                <a
                  href="https://www.linkedin.com/company/vestarplus/mycompany/"
                  target="_blank"
                  style={{ textDecoration: 'none', color: 'black' }}
                >
                  <FaLinkedin />
                </a>
              </div>
            </div>

            <img
              src={selectedPost?.coverImage || getRandomImage()}
              style={{ height: '340px', objectFit: 'cover', padding: '10px' }}
            />

            <Modal.Body>
              {' '}
              <MarkdownToJSX className="edeygo" options={options}>
                {selectedPost?.contentMarkdown}
              </MarkdownToJSX>
            </Modal.Body>

            <div className="btb">
              <div className="usToday">Contact us today for your:</div>
              <div className="baseat">
                <div className="wert">Website Development</div>
                <div className="bhu">Mobile App Development</div>
              </div>
              <div className="baseat">
                <div className="ui">UI & UX Design</div>
                <div className="graph">Graphics Design</div>
              </div>

              <div className="ohn ">
                Let’s build something awesome together!
              </div>
              <div className="shilalo">
                Email:project@vestarplus.com
                <br /> Call: +234 802 2861 622
              </div>
            </div>
          </Modal>
        </div>
}