Feat: Contact Page UI Implementation

[bertrandshema]

Description:

Implement the UI for the Contact page based on the provided Figma design. The Contact page should be responsive, accessible, and match the design specifications closely.

Design Specifications:

• Follow the Figma design provided.
• Ensure consistency with the overall theme and style of the app.
• Maintain responsiveness for various screen sizes (mobile, tablet, desktop).

Acceptance Criteria:

• The Contact page UI matches the Figma design closely.
• The page is fully responsive and looks good on different screen sizes.
• Form validation works as expected.
• Contact details and FAQs are displayed correctly.
• All interactive elements (form, inputs) function as intended.

[bertrandshema]

Implementation Plan: Contact Page UI

Overview

The Contact Page will be divided into three main sections: Contact Form, Contact Information, and FAQs. Each section will be implemented as separate components for better modularity and maintainability.

Components to be Created

1. ContactForm: Handles user input and submission of the contact form.
2. ContactInfo: Displays the company's contact information.
3. FAQs: Lists frequently asked questions and answers.

Steps for Implementation

1. Create a new branch for the contact page feature: feat-contact-page-ui-implementation-#97
2. Create ContactForm Component: src/components/ContactForm.tsx
3. Create ContactInfo Component: src/components/ContactInfo.tsx
4. Create FAQs Component: src/components/FAQs.tsx
5. Integrate Components into ContactPage: src/pages/ContactPage.tsx
6. Testing for ContactForm, ContactInfo, FAQs Components