Glassy Navbar on scroll and navbar sticks on top

[mohammedasimahmed]

Description:
Currently, the navigation bar does not remain fixed at the top of the page when the user scrolls, and there is no dynamic background transition from transparent to glassy based on scroll position.

Tasks to be done:

• Update the CSS to make the navigation bar fixed at the top of the page when the user scrolls.
• Initially, set the background of the navigation bar to transparent , then Implement a transition effect to change the background to a glassy appearance as the user scrolls down , then Implement logic to revert the background to transparent when the user scrolls back to the top of the page.