Skip to content

website using html css and python flask #2676

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.

Sign up for GitHub

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

Merged
merged 1 commit into from
Aug 10, 2023
Merged

website using html css and python flask #2676

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
22 changes: 22 additions & 0 deletions BMI Calculator/README.md
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,22 @@
# BMI Calculator Project

This is a simple BMI (Body Mass Index) Calculator web application built using Python and Flask. It allows users to calculate their BMI based on their weight and height, and it provides an interpretation of the BMI category.

## Project Structure

The project consists of the following files:

- `app.py`: This is the main Python script that contains the Flask application. It handles the server-side calculations and serves the web pages.
- `templates/`: This folder contains the HTML templates used for rendering the user interface. It includes two templates:
- `index.html`: The main page of the BMI calculator where users can enter their weight and height.
- `result.html`: The result page that displays the calculated BMI, its interpretation, and additional information about BMI categories.
- `styles.css`: The CSS file responsible for styling the user interface of the BMI calculator.

## BMI Categories

The BMI calculator provides interpretation for BMI categories as follows:

- Underweight: less than 18.5
- Normal weight: 18.5 - 24.9
- Overweight: 25 - 29.9
- Obese: 30 or greater
34 changes: 34 additions & 0 deletions BMI Calculator/app.py
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,34 @@
from flask import Flask, render_template, request

app = Flask(__name__)

def calculate_bmi(weight, height):
height_in_meters = height / 100
bmi = weight / (height_in_meters ** 2)
return bmi

def interpret_bmi(bmi):
if bmi < 18.5:
return "Underweight"
elif 18.5 <= bmi < 24.9:
return "Normal weight"
elif 25 <= bmi < 29.9:
return "Overweight"
else:
return "Obese"

@app.route("/", methods=["GET", "POST"])
def index():
if request.method == "POST":
weight = float(request.form["weight"])
height = float(request.form["height"])

bmi = calculate_bmi(weight, height)
interpretation = interpret_bmi(bmi)

return render_template("result.html", bmi=bmi, interpretation=interpretation)

return render_template("index.html")

if __name__ == "__main__":
app.run(debug=True)

Check failure

Code scanning / CodeQL

Flask app is run in debug mode

A Flask app appears to be run in debug mode. This may allow an attacker to run arbitrary code through the debugger.
54 changes: 54 additions & 0 deletions BMI Calculator/styles.css
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,54 @@
body {
font-family: Arial, sans-serif;
background-color: #f8f8f8;
margin: 0;
padding: 0;
}

.container {
max-width: 400px;
margin: 30px auto;
padding: 20px;
border: 1px solid #ccc;
border-radius: 5px;
box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
background-color: #fff;
}

h1 {
text-align: center;
}

label {
display: block;
margin-bottom: 5px;
}

input {
width: 100%;
padding: 8px;
margin-bottom: 10px;
border: 1px solid #ccc;
border-radius: 4px;
}

input[type="submit"] {
background-color: #4CAF50;
color: #fff;
cursor: pointer;
}

input[type="submit"]:hover {
background-color: #45a049;
}

a {
display: block;
text-align: center;
color: #007bff;
text-decoration: none;
}

a:hover {
text-decoration: underline;
}
22 changes: 22 additions & 0 deletions BMI Calculator/templates/index.html
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,22 @@
<!DOCTYPE html>
<html>
<head>
<title>BMI Calculator</title>
<link rel="stylesheet" href="../styles.css">
</head>
<body>
<div class="container">
<h1>BMI Calculator</h1>
<p>
Welcome to the BMI Calculator! Enter your weight and height below to calculate your Body Mass Index (BMI).
</p>
<form method="post" action="/">
<label for="weight">Weight (kg):</label>
<input type="number" step="0.01" name="weight" required><br>
<label for="height">Height (cm):</label>
<input type="number" step="0.01" name="height" required><br>
<input type="submit" value="Calculate">
</form>
</div>
</body>
</html>
24 changes: 24 additions & 0 deletions BMI Calculator/templates/result.html
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,24 @@
<!DOCTYPE html>
<html>
<head>
<title>BMI Calculator - Result</title>
<link rel="stylesheet" href="../styles.css">
</head>
<body>
<div class="container">
<h1>Result</h1>
<p>Your BMI is: {{ bmi }}</p>
<p>Interpretation: {{ interpretation }}</p>
<p>
BMI Categories:
<ul>
<li>Underweight: less than 18.5</li>
<li>Normal weight: 18.5 - 24.9</li>
<li>Overweight: 25 - 29.9</li>
<li>Obese: 30 or greater</li>
</ul>
</p>
<a href="/">Calculate Again</a>
</div>
</body>
</html>