[STYLE CHANGE] Overlapping of upcoming iskcon event search menu with navbar and no hover effect

[supratimbanik]

Description:
Hello! I am an SSOC'24 contributor.
I want to resolve the styling issues of the upcoming events search bar in the isckon events page.

Recording.2024-06-05.182216.mp4

Reason for Change:
Search menu of the search bar overlaps with the navbar on scrolling. Also the search menu has no hover animation. On clicking the search menu option the search field value is not changed. This hampers the UI experience.

Current Styling:
Currently the search elements are only added after text is added to the search field.
There is no hover animation for the search menu.
Also the z-index is also not properly handled.

Proposed Styling:
I will add some event listeners for hover and click actions.
I will also properly set the z-index of the search menu.

Screenshots or Design Mockups

v.mp4

[github-actions]

Congratulations, @supratimbanik! 🎉 Thank you for creating your issue for Moksh. Your contribution is greatly appreciated and we look forward to working with you to resolve the issue. Keep up the great work! Should you have any queries or require guidance, do not hesitate to ask.

[akshitagupta15june]

Go for it!