Add sistent modal component

[sudhanshutech]

Description

This PR fixes #5519

Notes for Reviewers

Signed commits

• Yes, I signed my commits.

[l5io]

🚀 Preview for commit c9bd32f at: https://668ba40161200ef289114fe1--layer5.netlify.app

[l5io]

🚀 Preview for commit 3ea33e0 at: https://668bcb973bde7d0acfeafc53--layer5.netlify.app

[hargunkaur286]

opening the modal component redirects to a blank page. Also, the "Modal" component the we import from the sistent package, by default has an overlay property cannot be overwritten and thus, we cannot display the modal inline, as it was given in the figma file:

I was trying to make the modal to be pixel perfect which is why i made a custom component for the "overview", "guidance" and the "code" pages, for the sake of displaying them on the screen. The modal imported from the sistent package has extra padding in the header and footer, and no space between the buttons, and making changes in it wouldn't make any sense.

This is why I got confused, but if this is the approach that we'll be working with, then it looks good to me. Let me know if I can help in any part.

[l5io]

🚀 Preview for commit ae28f0a at: https://668fcdb215bf4d0e4f8f7d20--layer5.netlify.app

[l5io]

🚀 Preview for commit 4b957c1 at: https://668fe39fc07f28307f92ae2b--layer5.netlify.app

[l5io]

🚀 Preview for commit 8a5dc4e at: https://6691a68c2fc3db59838a057a--layer5.netlify.app