Implement Multi-Page Layout

[paolomandica]

We need to transition from a single-page website template to a multi-page layout to improve navigation and user experience. The new structure should include separate pages for various sections, including:

• Team: A dedicated page to showcase team members, their roles, and biographies.
• Projects: A page to detail current and past projects, including descriptions, progress updates, and outcomes.
• Events: An events page listing upcoming and past events, with details such as dates, locations, and event summaries.
• [Other Sections as Needed]

Tasks

• [x] 1. Plan the Structure: Outline the new page structure and navigation flow.
• [x] 2. Design Templates: Create design templates for each new page.
• [x] 3. Implement Pages: Develop the new pages based on the designs.
• [x] 4. Update Navigation: Modify the website’s navigation menu to include links to the new pages.
• [x] 5. Content Migration: Move existing content to the appropriate new pages.
• [x] 6. Testing: Ensure all links and new pages function correctly and are mobile-responsive.

Acceptance Criteria

• All specified sections have their own dedicated pages.
• The navigation menu is updated and fully functional.
• The website maintains a consistent design and user experience across all pages.
• All new pages are tested and free of errors.

Additional Notes

• Consider SEO implications when creating new pages.

[paolomandica]

New features and fixes to be implemented:

• [ ] Fix multi-page navigation in mobile mode
  • Create an hamburger menu which opens by clicking on a button positioned in the top-right section of each page
• [ ] Move back the contact section in the landing page (index.html)
• [ ] Change the background color to be white for all pages
• [ ] Experiment with different colors for the projects squares

[DustinDus]

Pushed new changes:

• Swapped out the old navbar for a basic hamburger menu
• Moved the contact section back to index.html (contact is now empty)
• Changed the background color of all pages to white, also fixed a problem with thin lines of the wrong color appearing at the bottom of svgs
• Tried out several colors on the project.html squares, ultimately went with ghostwhite and a variation of ivory (#fffff4); others I thought looked nice are aliceblue, azure, floralwhite, honeydew, mintcream, snow and whitesmoke. Also added a box-shadow to the images in the boxes