UI: Header should be fixed (sticky) to the top on scroll #1
Description
The main navigation header currently scrolls with the rest of the page. This is not ideal for user experience, as the primary navigation links (Dashboard, My Events, etc.) and the user's login status are hidden as soon as they scroll down.
Acceptance Criteria :
- The header should remain fixed, or "sticky," at the top of the viewport at all times.
- This can be implemented in style.css by applying position: sticky; and top: 0; to the .header class.
- A backdrop-filter: blur(10px); should be added to give the sticky header a semi-transparent "frosted glass" effect.
- The body.dashboard-page must have padding-top: 70px; (or the height of the header) added to prevent the page content from being hidden underneath it.