Upgrade Pagination comp. + fix ButtonV2 + adj. vertical-align of CareIcons + Generalize Submit and Cancel buttons

[rithviknishad]

Proposed Changes

• Fixes Misalignment across the platform across asset page #4347
• Fixes Misalignment across the platform across multiple location #4343
• Resolves Use angle icons instead of <<<, <, >>>, > texts in pagination component. #4350
• Fixes the misalignment in ButtonV2 caused by Button class getting deleted from the codebase.
• Use CareIcons for the angles of the pagination component
• Use ButtonV2 for navigation buttons of the pagination component
• Added tooltips for navigation buttons of the pagination component
• Use text-* classes to size icons instead of h-*
• Reduce the .care-svg-icon__baseline's vertical alignment to -0.175em
• Resolves Goodbye CheckCircleOutline icon of material UI #4367
• Replaces CheckCircleOutline and it's containing buttons to CareIcon and ButtonV2 in favour of removing material UI components.

Note

From now on we need not adjust the alignment of the icon inside button manually using pt-* / pb-* / mt-* / mb-* classes.

<ButtonV2> {/* already applies "inline-flex items-center gap-2" */}
  <CareIcon className="care-l-check text-lg" />
  <span>Verify</span>
</ButtonV2>

@coronasafe/care-fe-code-reviewers @coronasafe/code-reviewers

Merge Checklist

• Add specs that demonstrate bug / test a new feature.
• Update product documentation.
• Ensure that UI text is kept in I18n files.
• Prep screenshot or demo video for changelog entry, and attach it to issue.
• Request for Peer Reviews
• Completion of QA

[vercel]

The latest updates on your projects. Learn more about Vercel for Git ↗︎

Name	Status	Preview	Updated
care-storybook	✅ Ready (Inspect)	Visit Preview	Dec 22, 2022 at 1:50PM (UTC)

[netlify]

✅ Deploy Preview for care-egov-staging ready!

Name	Link
🔨 Latest commit	e8aa6a9
🔍 Latest deploy log	https://app.netlify.com/sites/care-egov-staging/deploys/63a460259ebcbd0008646873
😎 Deploy Preview	https://deploy-preview-4358--care-egov-staging.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 settings.

[Ashesh3]

LGTM

[Ashesh3]

@rithviknishad The Cypress tests might need to be updated too.

[rithviknishad]

@Ashesh3 yea on it. just finished, pushing it

[github-actions]

👋 Hi, @rithviknishad,
Conflicts have been detected against the base branch. Please rebase your branch against the base branch.

---

This message is automatically generated by prince-chrismc/label-merge-conflicts-action so don't hesitate to report issues/improvements there.

[nihal467]

@rithviknishad

make the proper spacing between the buttons

[nihal467]

@rithviknishad

keep the add present towards the right side, as of the existing staging

[nihal467]

LGTM

[khavinshankar]

@rithviknishad can you checkout the merge conflict

[github-actions]

👋 Hi, @rithviknishad,
Conflicts have been detected against the base branch. Please rebase your branch against the base branch.

---

This message is automatically generated by prince-chrismc/label-merge-conflicts-action so don't hesitate to report issues/improvements there.

[sonarcloud]

Kudos, SonarCloud Quality Gate passed!   

0 Bugs
0 Vulnerabilities
0 Security Hotspots
48 Code Smells

No Coverage information
0.5% Duplication