feat: improve library page layout with timeline and switch

[sumitakhuli]

Description

This PR addresses Fixes #367 : Information Layout Too Dense by resigning the Library Page layout to be more visually organized and intuitive.

Key changes:

• Toggle Switch: Replaced the small button with a prominent implementation of Chakra UI Switch component to toggle between "Semester" and "Exam" periods.
• Timeline/Schedule Visualization: Replaced text blocks with a structured vertical list using icons (CalendarIcon, TimeIcon) to represent days.
• Themed Design: Refined the visual design to align strictly with the website's existing theme (Blue background #0050e0, Syne font, high-contrast text).
• Current Day Highlighting: The schedule for the current day is automatically highlighted with a bold font and a left border indicator.
• Status Badges: Added color-coded badges (Green for Open hours, Red for Closed) for quick status recognition.
• Modern Cards: Encapsulated "Opening Hours" and "Contact" sections in modern card layouts with shadows for better separation.

Related Issue

Fixes Issue #367: Information Layout Too Dense

Motivation and Context

The previous layout displayed opening hours and contact information in dense text blocks that were hard to scan. The period toggle was also small and easy to miss. This update improves readability and adds helpful visual cues for the user.

How Has This Been Tested?

Tested locally in the development environment:

1. Toggle: Verified that switching between "Semester" and "Exams" updates the displayed hours correctly.
2. Date Logic: Manually verified that the current day is highlighted based on the system date.
3. Responsiveness: Checked layout on desktop (side-by-side cards) and mobile (stacked cards).
4. Links: Confirmed the "Library Website" button redirects correctly based on the selected language.

Screenshots or GIF (In case of UI changes):

Before:

After:

Types of changes

• Bug fix (non-breaking change which fixes an issue)
• New feature (non-breaking change which adds functionality)
• Breaking change (fix or feature that would cause existing functionality to change)

Checklist:

• My code follows the code style of this project.
• My change requires a change to the documentation.
• I have updated the documentation accordingly.
• I have added tests to cover my changes.
• All new and existing tests passed.

[GeorgeFkd]

The button does not communicate its intent properly like the previous button and also when toggling between exam and courses period there is a layout shift(tested on IPhone 11 Pro from Firefox DevTools). If you can fix these two it should be fine. Also the layout on the contact info remains a bit awkward and could be fixed within this PR.