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

"Feature : Progress bar added in home page & contributors page" #310

Merged
merged 3 commits into from
Nov 8, 2024

Conversation

Edasgh
Copy link
Contributor

@Edasgh Edasgh commented Nov 7, 2024

Fixes #302

Changes:

  1. In the files "index.html" & "pages/contributorsSection.html" : Added the "progress-bar-container" which contains a "progress-bar" div
  2. In the file "index.html" (Inside the <script> tag) & In the file "resources/contributorsSection.js" : Added a self invoking function that constantly checks for the total height scrolled and updates the width of the progressbar
  3. In the files "resources/style.css" & "resources/contributorsSection.css" : Defined the "progress-bar-container" & "progress-bar" styles

Demo:
https://www.loom.com/share/ac202e0a9c3f4477b12072d0e03ad62d?sid=51e396f1-0f53-45ba-bb77-87015cb16e04

Copy link

netlify bot commented Nov 7, 2024

Deploy Preview for codeittool ready!

Name Link
🔨 Latest commit 9d0cacb
🔍 Latest deploy log https://app.netlify.com/sites/codeittool/deploys/672d883f738794000818def1
😎 Deploy Preview https://deploy-preview-310--codeittool.netlify.app
📱 Preview on mobile
Toggle QR Code...

QR Code

Use your smartphone camera to open QR code link.

To edit notification comments on pull requests, go to your Netlify site configuration.

Copy link
Contributor

@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.

🎉 Thank you for your contribution! Your pull request has been submitted successfully. A maintainer from CodeIt will review it as soon as possible. We appreciate your support in making this project better.

@multiverseweb
Copy link
Owner

Hey @Edasgh the colors used in progress bar are very different as compared to that of the website. you can use this gradient:
image

Also, decrease the thickness of the bar, maybe 2-3px is fine.

@Edasgh
Copy link
Contributor Author

Edasgh commented Nov 8, 2024

Hey @Edasgh the colors used in progress bar are very different as compared to that of the website. you can use this gradient: image

Also, decrease the thickness of the bar, maybe 2-3px is fine.

Ok

@Edasgh
Copy link
Contributor Author

Edasgh commented Nov 8, 2024

Hey @Edasgh the colors used in progress bar are very different as compared to that of the website. you can use this gradient: image

Also, decrease the thickness of the bar, maybe 2-3px is fine.

Is this ok?
https://www.loom.com/share/c8da82ff92eb43589316c4613f6be138?sid=16eb73c9-363e-46d8-8470-fc9fe153dc54

@multiverseweb
Copy link
Owner

@Edasgh yes! It looks good now

@multiverseweb
Copy link
Owner

Hey @Edasgh, I think you mistakenly deleted the content after the FAQ section on the landing page.
https://github.com/user-attachments/assets/fa75a620-16ce-40d3-a913-9b2ec7363228

Kindly check it once and let me know if there's a problem on my side.

@Edasgh
Copy link
Contributor Author

Edasgh commented Nov 8, 2024

Hey @Edasgh, I think you mistakenly deleted the content after the FAQ section on the landing page. https://github.com/user-attachments/assets/fa75a620-16ce-40d3-a913-9b2ec7363228

Kindly check it once and let me know if there's a problem on my side.

No problem on my side, the content after faq section is present there:
https://www.loom.com/share/4baf29be1a0d4509a2a6d9df28a248e1?sid=87eec35b-3992-464e-b5f1-239b37ac60e7

https://www.loom.com/share/d28579e7046a4e05926d2eac51b459d7?sid=8cec03a5-979a-4f18-b75e-3ab4a2f9c0e4

@multiverseweb
Copy link
Owner

Okay let me check it by merging directly, I don't have my computer right now

@multiverseweb multiverseweb merged commit 9f3df20 into multiverseweb:main Nov 8, 2024
5 checks passed
@multiverseweb
Copy link
Owner

multiverseweb commented Nov 8, 2024

@Edasgh I'm reverting the PR as the same issue arised in the main site and will get back to you by evening. Will resolve the conflicts if I find any.

I'm traveling right now, sorry for the inconvenience.

@Edasgh
Copy link
Contributor Author

Edasgh commented Nov 8, 2024

@Edasgh I'm reverting the PR as the same issue arised in the main site and will get back to you by evening. Will resolve the conflicts if I find any.

I'm traveling right now, sorry for the inconvenience.

It's ok

@Edasgh
Copy link
Contributor Author

Edasgh commented Nov 8, 2024

Hey @Edasgh, I think you mistakenly deleted the content after the FAQ section on the landing page. https://github.com/user-attachments/assets/fa75a620-16ce-40d3-a913-9b2ec7363228

Kindly check it once and let me know if there's a problem on my side.

Hey @multiverseweb , I just found out that this issue might be occurred because I tried to resolve the conflicts here.
Cause the deployment preview shows something like this:
https://www.loom.com/share/7b029d0a1b4340a2aef5be98519e642a?sid=e87257ad-a9fc-4176-98f3-21f2972f9de0

Should I raise another PR?

@multiverseweb
Copy link
Owner

Yes @Edasgh, create another PR for the same, will merge it

@Edasgh Edasgh mentioned this pull request Nov 9, 2024
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.

🧑‍💻: Design Eye-Catching Progress Bar for UI aesthetics
2 participants