Project Setup

[TanyaMushonga]

Title:
Initial Project Setup with Theming, Typography, Folder Structure, and Navigation Bar

Description:
This PR sets up the foundation for the open-source project by implementing key structural and UI elements. Below is a breakdown of the changes made:

• Theming and Typography:

  • Applied global themes, including color schemes, fonts, and base styles to ensure consistency across the project.
  • Configured typography for headings, paragraphs, and other text elements.

• Project Folder Structure:

  • Created an organized folder structure to promote scalability and maintainability.
  • Separated components, styles, assets, and pages to streamline development and future enhancements.

• Navigation Bar:

  • Designed and implemented a responsive navigation bar.
  • Linked navigation bar buttons to their respective pages.
  • Ensured the navigation bar is responsive across various screen sizes for a seamless user experience.

Testing:

• Verified that the navigation bar functions correctly on both desktop and mobile.
• Ensured all linked pages are accessible through the navigation bar.
• Checked responsiveness on different device viewports.

Next Steps:

• Future PRs will build upon this foundation, adding additional components and functionalities.

[terrameijar]

@TanyaMushonga, thank you for setting this up. I'll take a close look at the PR soon. The PR is failing eslint check, could you please run eslint on your changes and ensure that there are no eslint errors?

[TanyaMushonga]

@terrameijar Ok let me fix rhe eslint errors

[terrameijar]

Hi @TanyaMushonga, let's use a different placeholder picture for this part of the UI. You can use a service like this one to generate a fake image: https://pravatar.cc/

I hadn't thought of this but we should implement a profile picture upload feature in the backend that frontend users can use at registration. I'll create an issue for it.

[TanyaMushonga]

No problem let me work on it

[terrameijar]

@TanyaMushonga thank you, this looks good so far. There only change I'll ask you to make is removing your picture from the project and using a fake avatar instead.

[TanyaMushonga]

@terrameijar l have fixed the issue of placeholder profile picture

[TanyaMushonga]

@terrameijar can you review and merge the changes that l have made

[terrameijar]

These changes look good. Thanks @TanyaMushonga !