Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Added 'Back-To-Top' Button on All Pages #245

Merged
merged 2 commits into from
Jun 10, 2024

Conversation

AsmitaMishra24
Copy link
Contributor

@AsmitaMishra24 AsmitaMishra24 commented Jun 9, 2024

Issue Reference:
#243

Description:
Added a 'Back-To-Top' button across all pages to enhance user experience by allowing quick navigation to the top of the page. The button appears after the user scrolls down a specified amount and scrolls smoothly to the top when clicked.

Changes:

  1. Implemented a BackToTop Button for Home, About, Contributors, FAQs, Search, Advanced Search, Settings, Login, Signup, Confess, Privacy Policy, and Terms and Conditions pages.
  2. Implemented a BackToTop React component using useState and useEffect for state management and scroll detection.
  3. Integrated the react-scroll library for smooth scrolling.
  4. Added Font Awesome for the up arrow icon.
  5. Applied CSS for styling and transitions.

Details:

  1. The button becomes visible after scrolling 200px down.
  2. Smooth scrolling behavior with a duration of 500ms.
  3. Responsive and styled to match the site's design.

Screenshots:
https://github.com/Sayak-Bhunia/mystory/assets/146121869/53268f75-d94c-411f-8e77-a2b0a26120b9

Testing:

  1. Verified on various pages to ensure consistent functionality.
  2. Tested across different browsers and screen sizes for compatibility.

Copy link

vercel bot commented Jun 9, 2024

@AsmitaMishra24 is attempting to deploy a commit to the sayakbhunia's projects Team on Vercel.

A member of the Team first needs to authorize it.

Copy link

github-actions bot commented Jun 9, 2024

Thank you for submitting your pull request! 🙌 We'll review it as soon as possible. In the meantime, please ensure that your changes align with our CONTRIBUTING.md. If there are any specific instructions or feedback regarding your PR, we'll provide them here. Thanks again for your contribution! 😊

Copy link

@github-actions github-actions bot left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Congratulations on submitting your first pull request in this repository! 🥳🙌 We'll review it as soon as possible. Thank you for your contribution! 😊

@AsmitaMishra24
Copy link
Contributor Author

I've added a smooth scroll-activated "Back to Top" button on all pages. Please evaluate the feature and consider upgrading its level to Level 2 if it meets your expectations.

@Kritika30032002 Kritika30032002 merged commit eb0514e into Sayak-Bhunia:main Jun 10, 2024
2 of 3 checks passed
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

Successfully merging this pull request may close these issues.

2 participants