feat(web): new beta modal design

[nina992]

Overview

A new design for Modal component - these changes are related to Beta project

What I've done

• Add the ability to customize Layout.
• Create header and add (X) close button.
• Create footer with a divider.
• check if this new design is fit wherever the modal is used before.
• Modify the storybook accordingly if needed.

screenshots

What I haven't done

How I tested

Which point I want you to review particularly

Memo

https://www.figma.com/file/W6nDSiCBLubcNeAT6RkOoa/Re%3AEarth-Beta-Design-system?type=design&node-id=256-6282&mode=design

[netlify]

✅ Deploy Preview for reearth-web ready!

Name	Link
🔨 Latest commit	919cd8c
🔍 Latest deploy log	https://app.netlify.com/sites/reearth-web/deploys/64be32d6a4095200085af909
😎 Deploy Preview	https://deploy-preview-579--reearth-web.netlify.app/
📱 Preview on mobile	Toggle QR Code... Use your smartphone camera to open QR code link.

---

To edit notification comments on pull requests, go to your Netlify site configuration.

[codecov]

Codecov Report

Merging #579 (919cd8c) into main (7338624) will decrease coverage by 0.03%.
The diff coverage is 2.40%.

Additional details and impacted files

@@            Coverage Diff             @@
##             main     #579      +/-   ##
==========================================
- Coverage   28.36%   28.34%   -0.03%     
==========================================
  Files        1417     1418       +1     
  Lines      152299   152429     +130     
  Branches     3639     3641       +2     
==========================================
+ Hits        43197    43200       +3     
- Misses     107950   108077     +127     
  Partials     1152     1152              

Flag	Coverage Δ
web	26.23% <2.40%> (-0.03%)	⬇️
web-beta	26.23% <2.40%> (-0.03%)	⬇️
web-classic	26.23% <2.40%> (-0.03%)	⬇️
web-utils	26.23% <2.40%> (-0.03%)	⬇️

Flags with carried forward coverage won't be shown. Click here to find out more.

Impacted Files	Coverage Δ
web/src/beta/components/Divider/index.tsx	0.00% <0.00%> (ø)
web/src/beta/components/Modal/ModalFrame/index.tsx	0.00% <0.00%> (ø)
web/src/beta/components/Modal/index.tsx	0.00% <0.00%> (ø)
web/src/beta/hooks/useManageSwitchState/hooks.tsx	100.00% <100.00%> (ø)