feat: Scroll to top button

[Ishika-Gupta06]

Is your feature request related to a problem? Please describe. The Scroll to Top button feature is often related to the problem of usability on pages with long content. Users may find it inconvenient or time-consuming to manually scroll back to the top after navigating down a lengthy webpage.

Describe the solution you'd like Fixed position scroll-to-top button: A button that stays fixed at the bottom-right corner of the screen as the user scrolls. When clicked, it smoothly scrolls the user back to the top of the page.

Design details:

The button should be simple and non-intrusive, perhaps with an icon like an upward arrow (↑) or a customizable icon. It should only appear after the user has scrolled down a certain distance (e.g., 100px) and disappear when the user is near the top of the page.

Describe alternatives you've considered

1. Browser-based scrolling: Relying on the user's browser back or home button to navigate to the top of the page.

Pros: No need for additional code or design elements. Cons: It’s less intuitive and may require more effort from users, leading to a poorer user experience, especially on long pages.

2. Infinite scrolling: Instead of scrolling back to the top, content continuously loads as the user scrolls, reducing the need to go back to the top.

Pros: Ideal for content-heavy websites where users stay engaged by scrolling. Cons: Not suitable for all website types and can confuse users if they want to reach a specific section or the top of the page.

Additional context

[Ishika-Gupta06]

@SaurabhS55 please assign me under gssoc-ext, hacktoberfest, level-1,2,3