Add Scroll-to-Top Button for Better UX

[thecyberdevvarun]

Description:

A "Scroll-to-Top" button should be added to the portfolio website to improve user experience. This button will appear when the user scrolls down and, when clicked, smoothly scrolls back to the top of the page.

Expected Behavior:

• The button should remain hidden when the user is at the top of the page.
• The button should appear when the user scrolls 100px or more.
• When clicked, the page should smoothly scroll back to the top.

Implementation Steps:

1. Create an HTML button element with an id="scrollBtn" and style it appropriately (e.g., positioned at the bottom-right corner).
2. Use JavaScript to detect the scroll position and show/hide the button accordingly.
3. Implement the scrollTo method with behavior: "smooth" for a smooth scrolling effect.
4. Ensure the feature works on both desktop and mobile devices.

Tech Stack:

• HTML
• Tailwind CSS
• JavaScript

Possible Enhancements:

• Add an animated icon (e.g., an up arrow).
• Use a fade-in/out effect when showing/hiding the button.
• Add a hover effect for better UI.

Contribution Guidelines:

• Fork the repository and create a new branch (e.g., feature/scroll-to-top).
• Implement the feature and test it properly.
• Create a pull request with a brief description of your changes.