Re-Designed and Enhanced "Back to Top" Button Aesthetics and Functionality

[MastanSayyad]

Hey @Akshatchaube01 Issue closes #346

I have created and added "Back to Top" button both aesthetically and functionally in the application.

Changes I made

• Added a useEffect hook to manage scroll event listeners.
• Implemented a smooth scroll effect when the button is clicked using the window.scrollTo method.
• Set the visibility threshold for the button to appear after scrolling 200 pixels down.
• Styled the button using styled-components
• Added a smooth transition effect for background color and transform properties.
• Applied styles for positioning, sizing, color, and hover effects.
• Added transform: translateY(-5px) to move the button and arrow upward on hover.
• included a transition for smooth visual effects on hover.
• Added z-index 9999 to appear the button in front of web components

Screen Record

fixx.mp4

Please take a look and review it, also if possible add higher level labels, Thank YOU!!

[vercel]

The latest updates on your projects. Learn more about Vercel for Git ↗︎

Name	Status	Preview	Comments	Updated (UTC)
time-warp	✅ Ready (Inspect)	Visit Preview	💬 Add feedback	Jul 6, 2024 8:05pm