Closed srishti023 closed 1 month ago
github-actions[bot]
commented
1 month ago 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! 😊
Suman373
commented
1 month ago @srishti023 Nice work !
Trisha-tech
commented
1 month ago Description
This PR implements a responsive progress bar with a bluish-to-yellowish gradient that visually represents the user's scroll progress on the webpage. The gradient adds a modern and dynamic feel to the UI, smoothly transitioning as the user scrolls. The progress bar adapts well to different screen sizes, ensuring a consistent and appealing user experience across devices.
This PR does the following:
- Adds Bluish-to-yellowish gradient for a visually striking look.
- Smooth animation reflecting scrolling progress.
- Responsive design that adjusts based on screen size.
Related Issues
Link any related issues using the format
Fixes #511. This helps to automatically close related issues when the PR is merged.
- Placeholder: "Fixes [Feature Request]: Missing Progress Bar and Hamburger Functionality on Pages #511"
Changes
List the detailed changes made in this PR.
- Added a new feature to implement a scroll progress bar that tracks the user's scroll activity and displays it as a bluish-to-yellowish gradient.
- Refactored the existing layout CSS to ensure proper responsiveness for the progress bar across all screen sizes (mobile, tablet, desktop).
- Enhanced the scrolling animation for a smoother transition effect when the progress bar updates as the user scrolls.
Testing Instructions
Detailed instructions on how to test the changes. Include any setup needed and specific test cases.
- Pull this branch.
- Run
npm installto install dependencies.- Run
npm testto execute the test suite.- Verify that ...
Screenshots (if applicable)
Add any screenshots that help explain or visualize the changes.
Online.Book.Sales.-.Google.Chrome.2024-10-20.11-14-49.mp4
Additional Context
Any additional context or information that reviewers should be aware of.
- This PR is based on the following...
Checklist
Make sure to check off all the items before submitting. Mark with [x] if done.
- [x] I have performed a self-review of my code
- [x] I have commented my code, particularly in hard-to-understand areas
- [x] My changes generate no new warnings
- [x] I am working on this issue under GSSOC
Kindly resolve these conflicts @srishti023
srishti023
commented
1 month ago @Trisha-tech please check
srishti023
commented
1 month ago Please merge my PR
Suman373
commented
1 month ago @Trisha-tech you may verify and merge this
Description
This PR implements a responsive progress bar with a bluish-to-yellowish gradient that visually represents the user's scroll progress on the webpage. The gradient adds a modern and dynamic feel to the UI, smoothly transitioning as the user scrolls. The progress bar adapts well to different screen sizes, ensuring a consistent and appealing user experience across devices.
Related Issues
Link any related issues using the format
Fixes #511. This helps to automatically close related issues when the PR is merged.Changes
List the detailed changes made in this PR.
Testing Instructions
Detailed instructions on how to test the changes. Include any setup needed and specific test cases.
npm installto install dependencies.npm testto execute the test suite.Screenshots (if applicable)
Add any screenshots that help explain or visualize the changes.
https://github.com/user-attachments/assets/2d2dc023-6be5-4733-9de1-b6da8ba45061
Additional Context
Any additional context or information that reviewers should be aware of.
Checklist
Make sure to check off all the items before submitting. Mark with [x] if done.