Added reusable Back to Top button

[Suhas334]

Summary [required]

This PR adds a reusable "Back to Top" button to improve navigation and user experience across long pages of the website. The button appears after scrolling down and smoothly scrolls the user back to the top when clicked. The implementation is responsive, lightweight, and aligned with the existing UI design.

Related Issue [required]

Closes #267

Type of Change [required]

• Bug fix — resolves a broken behaviour
• Feature — adds new functionality
• Data — adds new projects to data/projects.json
• Documentation — updates docs, README, or code comments only
• Style — CSS or visual changes only, no logic change
• Refactor — restructures code without changing behaviour
• Test — adds or updates tests

What Was Changed [required]

File	Change made
templates/index.html	Added floating Back to Top button
static/style.css	Added responsive styling and hover effects
static/script.js	Added smooth scroll and scroll visibility logic

Before | After

How to Test This PR [required]

1. Clone this branch:
   git checkout feat/back-to-top-button

2. Install dependencies:
   pip install -r requirements.txt

3. Run the app:
   python app.py

4. Open:
   http://127.0.0.1:5000

5. Scroll down the page

6. Verify that:

   • The button appears after scrolling
   • Clicking the button smoothly scrolls to the top
   • The button remains fixed at the bottom-right corner
   • The feature works on both desktop and mobile screens

Test Results [required]

Application runs successfully without errors.
Back to Top button appears correctly.
Smooth scrolling functionality works as expected.
Responsive behavior verified on desktop and mobile views.

[vercel]

@Suhas334 is attempting to deploy a commit to the komalsony234-1530's projects Team on Vercel.

A member of the Team first needs to authorize it.

[komalharshita]

Thanks for the contribution. The Back to Top feature is a useful UX improvement, but I cannot approve this PR in its current state.

Main concerns:

• DevPath already contains an existing scroll-to-top button/logic (#scroll-top-btn). This PR introduces a second implementation (#backToTopBtn) instead of extending or improving the existing component.
• Button visibility is controlled through direct inline style changes (style.display = "block"/"none"). Please follow the existing project pattern of toggling CSS classes for UI state management.
• The new JavaScript does not check whether backToTopBtn exists before attaching event listeners, which may lead to runtime errors in future template variations.
• The PR currently has merge conflicts that must be resolved before further review.

Please refactor this feature to reuse the existing scroll-to-top system, resolve merge conflicts, and update the implementation accordingly. Once those changes are made, I’ll be happy to review again.

[Suhas334]

hi @komalharshita I make the changes as you expected.You can Review Now and tell if there are any issues.

[komalharshita]

@Suhas334 kindly resolve the merge conflicts

[Suhas334]

hi @komalharshita Merge conflicts is solved

[komalharshita]

Approved for merge