Added a BMI Calculator

[kshitizvardhan]

Describe your change: Added a BMI Calculator

Checklist:

• [x] I have read CONTRIBUTING.md.
• [x] This pull request is all my own work -- I have not plagiarized.
• [x] I know that pull requests will not be merged if they fail the automated tests.
• [x] This PR only changes one Project folder. To ease review, please open separate PRs for separate algorithms.
• [x] All new Project files are placed inside an existing directory.
• [ ] If this pull request resolves one or more open issues then the description above includes the issue number(s) with a closing keyword: "Fixes #ISSUE-NUMBER".
• [x] My code follows the style guidelines of this project
• [x] I have performed a self-review of my own code
• [x] I have commented my code, particularly in hard-to-understand areas
• [x] My changes generate no new warnings
• [ ] The title of my pull request is a short description of the requested changes.
• [x] I have made corresponding changes to the documentation
• [ ] My PR needs documentation change

ATTACH SCREEN-SHOTS

Before	After
< Before Image >	< After Image >

[netlify[bot]]

✅ Deploy Preview for frontend-database ready!

Name	Link
🔨 Latest commit	a187ba1de55354e06b502992f737302ee66b81a4
🔍 Latest deploy log	https://app.netlify.com/sites/frontend-database/deploys/652bf5ebad1c9f0008ef2258
😎 Deploy Preview	https://deploy-preview-56--frontend-database.netlify.app
📱 Preview on mobile	Toggle QR Code... Use your smartphone camera to open QR code link.

---

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

[pr-explainer-bot[bot]]

Pull Request Review

Hey there! 👋 Here's a summary of the previous results for the pull request review. Let's dive in!

Changes

1. Added a new project 'BMI Calculator' to the ProjectList.json file.
2. Added the necessary details for the 'BMI Calculator' project.
3. Added the file path for the 'BMI Calculator' project.
4. Added a description for the 'BMI Calculator' project.

Suggestions

1. In line 34, consider adding a background-size property to control the size of the background image.
2. In line 45, consider adding a transition property to control the transition effect on hover.
3. In line 56, consider adding a min-height property to ensure the panel has a minimum height.
4. In line 68, consider adding a margin-bottom property to create some space between the form and the panel.
5. In line 79, consider adding a margin-top property to create some space between the button and the form.
6. In line 92, consider adding a margin-top property to create some space between the results and the form.

Bugs

1. The file 'ProjectList.json' may have a missing comma after the 'tags' array in line 11.
2. The file 'index.html' may have a missing comma after the 'background-repeat' property in line 32.
3. The file 'index.html' may have a missing comma after the 'background-image' property in line 33.
4. The file 'index.html' may have a missing comma after the 'background-color' property in line 34.
5. The file 'index.html' may have a missing comma after the 'outline' property in line 36.
6. The file 'index.html' may have a missing comma after the 'margin-bottom' property in line 37.
7. The file 'index.html' may have a missing comma after the 'text-decoration' property in line 43.
8. The file 'index.html' may have a missing comma after the 'color' property in line 44.
9. The file 'index.html' may have a missing comma after the 'transition' property in line 45.
10. The file 'index.html' may have a missing comma after the 'cursor' property in line 46.
11. The file 'index.html' may have a missing comma after the 'text-shadow' property in line 47.
12. The file 'index.html' may have a missing comma after the 'width' property in line 54.
13. The file 'index.html' may have a missing comma after the 'padding' property in line 55.
14. The file 'index.html' may have a missing comma after the 'border' property in line 56.
15. The file 'index.html' may have a missing comma after the 'margin-bottom' property in line 57.
16. The file 'index.html' may have a missing comma after the 'background-color' property in line 58.
17. The file 'index.html' may have a missing comma after the 'outline' property in line 59.
18. The file 'index.html' may have a missing comma after the 'color' property in line 60.
19. The file 'index.html' may have a missing comma after the 'font-size' property in line 61.
20. The file 'index.html' may have a missing comma after the 'border' property in line 68.
21. The file 'index.html' may have a missing comma after the 'background-color' property in line 69.
22. The file 'index.html' may have a missing comma after the 'border-radius' property in line 70.
23. The file 'index.html' may have a missing comma after the 'animation-name' property in line 71.
24. The file 'index.html' may have a missing comma after the 'animation-duration' property in line 72.
25. The file 'index.html' may have a missing comma after the 'animation-timing-function' property in line 73.
26. The file 'index.html' may have a missing comma after the 'animation-delay' property in line 74.
27. The file 'index.html' may have a missing comma after the 'animation-iteration-count' property in line 75.
28. The file 'index.html' may have a missing comma after the 'animation-fill-mode' property in line 76.

Improvements

1. Added a new HTML file 'index2.html' with 111 lines of code.
2. Line 14: Instead of using inline styles, consider moving the CSS code to an external stylesheet for better code organization.
3. Line 38: The closing </ul> tag is missing in the navigation section. Add it to fix the HTML structure.
4. In the CSS code, lines 45-48 can be refactored for better readability by using shorthand properties. Instead of specifying each individual property, you can use the margin property to set all four margins at once. Here's the refactored code snippet:

.content {
  border: 1px solid yellowgreen;
  padding: 25px;
  margin: 20px;
  width: 50%;
  border-radius: 20px 0px 20px 0px;
  background-color: rgba(153, 205, 50, 0.651);
  height: 150px;
  position: relative;
  left: 652px;
  top: 160px;
}

Rating

Rating: 8/10

Criteria:

• Readability: The code is generally readable, but there are some areas where it can be improved, such as using external stylesheets and organizing the CSS code more efficiently.
• Performance: The code doesn't have any performance issues that stand out.
• Security: The code doesn't have any security vulnerabilities that are apparent.

That's it for the summary! Feel free to reach out if you have any questions or need further assistance. Happy coding! 😄🚀

[dev-AshishRanjan]

You can checkout our Idea-Arca, the project idea bank for any languages, for open-source contributions. The PR from this repo is being accepted in hacktoberfest2023

Happy Contributing season! Keep up the good work!