From abea733751cad722a9ef69e12ab059dcad895f36 Mon Sep 17 00:00:00 2001 From: otibulai15 Date: Mon, 1 Dec 2025 08:30:14 +0100 Subject: [PATCH 1/9] js files created --- gitcommands.txt/gitignore | 10 ++++++++++ src/Formular.js | 1 + src/index.js | 2 +- src/settings.js | 0 4 files changed, 12 insertions(+), 1 deletion(-) create mode 100644 gitcommands.txt/gitignore create mode 100644 src/Formular.js create mode 100644 src/settings.js diff --git a/gitcommands.txt/gitignore b/gitcommands.txt/gitignore new file mode 100644 index 0000000..f651efa --- /dev/null +++ b/gitcommands.txt/gitignore @@ -0,0 +1,10 @@ +git init +git checkout -b new_branch # create a new branch +git branch # what branches do I have? +git status + +git pull origin develop +git pull origin feature/Formular_Eingabe + +git push -u origin feature/Formular_Eingabe +git push -u origin develop \ No newline at end of file diff --git a/src/Formular.js b/src/Formular.js new file mode 100644 index 0000000..9138cd2 --- /dev/null +++ b/src/Formular.js @@ -0,0 +1 @@ +print("Please enter the weight in kg: ") \ No newline at end of file diff --git a/src/index.js b/src/index.js index 7f1afad..4cf9b72 100644 --- a/src/index.js +++ b/src/index.js @@ -1 +1 @@ -# index +# index \ No newline at end of file diff --git a/src/settings.js b/src/settings.js new file mode 100644 index 0000000..e69de29 From 87a9d67a2c9235585196a60a8c96b22727c97816 Mon Sep 17 00:00:00 2001 From: otibulai15 Date: Mon, 8 Dec 2025 09:08:58 +0100 Subject: [PATCH 2/9] formular.htm wurde aktualisiert mit Eingaben --- src/Formular.css | 0 src/Formular.html | 34 ++++++++++++++++++++++++++++++++++ src/Formular.js | 2 +- 3 files changed, 35 insertions(+), 1 deletion(-) create mode 100644 src/Formular.css create mode 100644 src/Formular.html diff --git a/src/Formular.css b/src/Formular.css new file mode 100644 index 0000000..e69de29 diff --git a/src/Formular.html b/src/Formular.html new file mode 100644 index 0000000..d6dda09 --- /dev/null +++ b/src/Formular.html @@ -0,0 +1,34 @@ +=== FORMULAR.HTML - Pseudocode === + + + + + BMI Rechner + + + + + +

BMI Formular

+
+ + + + + + + + + + + +
+ + + + + \ No newline at end of file diff --git a/src/Formular.js b/src/Formular.js index 9138cd2..4a2ce03 100644 --- a/src/Formular.js +++ b/src/Formular.js @@ -1 +1 @@ -print("Please enter the weight in kg: ") \ No newline at end of file +// ("Please enter the weight in kg: ") \ No newline at end of file From e268769d3fcfbdae45a76d45e1b532db97d01d60 Mon Sep 17 00:00:00 2001 From: Kamron Khakimov <107259358+kameronmazuda@users.noreply.github.com> Date: Mon, 8 Dec 2025 09:17:44 +0100 Subject: [PATCH 3/9] Delete Plan.md --- Plan.md | 2 -- 1 file changed, 2 deletions(-) delete mode 100644 Plan.md diff --git a/Plan.md b/Plan.md deleted file mode 100644 index c25cb4b..0000000 --- a/Plan.md +++ /dev/null @@ -1,2 +0,0 @@ -Formular entries : - - In the entry form the weight must be entered. From 86166aea57e3177be39c1efe07a65da80ba61d80 Mon Sep 17 00:00:00 2001 From: Kamron Khakimov <107259358+kameronmazuda@users.noreply.github.com> Date: Mon, 8 Dec 2025 09:18:04 +0100 Subject: [PATCH 4/9] Delete gitcommands.txt/gitignore --- gitcommands.txt/gitignore | 10 ---------- 1 file changed, 10 deletions(-) delete mode 100644 gitcommands.txt/gitignore diff --git a/gitcommands.txt/gitignore b/gitcommands.txt/gitignore deleted file mode 100644 index f651efa..0000000 --- a/gitcommands.txt/gitignore +++ /dev/null @@ -1,10 +0,0 @@ -git init -git checkout -b new_branch # create a new branch -git branch # what branches do I have? -git status - -git pull origin develop -git pull origin feature/Formular_Eingabe - -git push -u origin feature/Formular_Eingabe -git push -u origin develop \ No newline at end of file From 7e54b38e1e6fbbcfa4d3058b8c1432a42a7384e1 Mon Sep 17 00:00:00 2001 From: Kamron Khakimov <107259358+kameronmazuda@users.noreply.github.com> Date: Mon, 8 Dec 2025 09:18:36 +0100 Subject: [PATCH 5/9] Rename Formular.js to formular.js --- src/Formular.js | 1 - src/formular.js | 1 + 2 files changed, 1 insertion(+), 1 deletion(-) delete mode 100644 src/Formular.js create mode 100644 src/formular.js diff --git a/src/Formular.js b/src/Formular.js deleted file mode 100644 index 4a2ce03..0000000 --- a/src/Formular.js +++ /dev/null @@ -1 +0,0 @@ -// ("Please enter the weight in kg: ") \ No newline at end of file diff --git a/src/formular.js b/src/formular.js new file mode 100644 index 0000000..5ebd446 --- /dev/null +++ b/src/formular.js @@ -0,0 +1 @@ +// ("Please enter the weight in kg: ") From 3dba134f85665e990427f228668f45340bcd83e3 Mon Sep 17 00:00:00 2001 From: Kamron Khakimov <107259358+kameronmazuda@users.noreply.github.com> Date: Mon, 8 Dec 2025 09:18:59 +0100 Subject: [PATCH 6/9] Update and rename Formular.html to formular.html --- src/{Formular.html => formular.html} | 3 ++- 1 file changed, 2 insertions(+), 1 deletion(-) rename src/{Formular.html => formular.html} (96%) diff --git a/src/Formular.html b/src/formular.html similarity index 96% rename from src/Formular.html rename to src/formular.html index d6dda09..73ea4f5 100644 --- a/src/Formular.html +++ b/src/formular.html @@ -31,4 +31,5 @@

Ihr BMI Ergebnis

- \ No newline at end of file + + From 106b65fca8cfeffb52afd1de1cef03600ca35ead Mon Sep 17 00:00:00 2001 From: Kamron Khakimov <107259358+kameronmazuda@users.noreply.github.com> Date: Mon, 8 Dec 2025 09:19:16 +0100 Subject: [PATCH 7/9] Rename Formular.css to formular.css --- src/Formular.css | 0 src/formular.css | 1 + 2 files changed, 1 insertion(+) delete mode 100644 src/Formular.css create mode 100644 src/formular.css diff --git a/src/Formular.css b/src/Formular.css deleted file mode 100644 index e69de29..0000000 diff --git a/src/formular.css b/src/formular.css new file mode 100644 index 0000000..d3f5a12 --- /dev/null +++ b/src/formular.css @@ -0,0 +1 @@ + From 9ff702ffadff136f21243fe4ee12bd4976b1bdd4 Mon Sep 17 00:00:00 2001 From: otibulai15 Date: Mon, 15 Dec 2025 09:23:53 +0100 Subject: [PATCH 8/9] Html und styling changed --- src/Formular.html | 15 ++---- src/css/formular.css | 107 +++++++++++++++++++++++++++++++++++++++++++ 2 files changed, 111 insertions(+), 11 deletions(-) create mode 100644 src/css/formular.css diff --git a/src/Formular.html b/src/Formular.html index d6dda09..24d09e4 100644 --- a/src/Formular.html +++ b/src/Formular.html @@ -1,26 +1,19 @@ -=== FORMULAR.HTML - Pseudocode === BMI Rechner - - + +

BMI Formular

- - - + - - - -
- +
\ No newline at end of file diff --git a/src/css/formular.css b/src/css/formular.css new file mode 100644 index 0000000..758bd9b --- /dev/null +++ b/src/css/formular.css @@ -0,0 +1,107 @@ +body { + font-family: Arial, sans-serif; + background-color: #f4f4f4; + margin: 0; + padding: 20px; + text-align: center; +} + +h1 { + text-align: center; + color: #333; + font-size: 2.5rem; + margin-bottom: 30px; + margin-top: 20px; +} + +/* Container for form */ +#bmiForm { + background: white; + max-width: 400px; + margin: 20px auto; + padding: 25px; + border-radius: 8px; + box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1); + border: 1px solid #e0e0e0; +} + +/* Input fields styling */ +input[type="number"], +input[type="date"] { + width: 100%; + padding: 12px; + margin-bottom: 15px; + border: 2px solid #ddd; + border-radius: 4px; + font-size: 16px; + transition: border-color 0.3s ease; + font-family: Arial, sans-serif; +} + +/* Focus state for inputs */ +input[type="number"]:focus, +input[type="date"]:focus { + outline: none; + border-color: #4CAF50; + box-shadow: 0 0 5px rgba(76, 175, 80, 0.3); +} + +/* Placeholder styling */ +input::placeholder { + color: #888; + font-style: italic; +} + +/* Submit button */ +button { + width: 100%; + padding: 14px; + background-color: #4CAF50; + color: white; + border: none; + border-radius: 4px; + font-size: 16px; + cursor: pointer; + transition: background-color 0.3s ease; + font-weight: 500; +} + +button:hover { + background-color: #45a049; +} + +button:active { + transform: translateY(1px); +} + +/* Error display */ +#error { + display: none; + color: #d32f2f; + background-color: #ffebee; + border: 1px solid #ffcdd2; + padding: 10px; + border-radius: 4px; + margin-top: 10px; + font-size: 14px; + text-align: center; +} + +/* Mobile responsive */ +@media (max-width: 480px) { + #bmiForm { + margin: 10px; + padding: 20px; + } + + input[type="number"], + input[type="date"] { + font-size: 14px; + padding: 10px; + } + + button { + font-size: 14px; + padding: 12px; + } +} \ No newline at end of file From 4f469c911e76d9d140009a42b7a76bd3aa95b2ec Mon Sep 17 00:00:00 2001 From: otibulai15 Date: Mon, 19 Jan 2026 09:23:38 +0100 Subject: [PATCH 9/9] - Formular Folder created - Implemented formular.js with BMI calculation and local storage - Added input validation and error handling - Included clear/reset functionality - Added formular.md documentation" --- .vscode/launch.json | 14 +++ src/settings.js => Plan.md | 0 docs/Formular.md | 34 ++++++ gitcommands.txt/gitignore | 12 ++ src/formular.css | 1 - src/formular.js | 1 - src/{ => formular}/css/formular.css | 6 +- src/{ => formular/html}/formular.html | 10 +- src/formular/js/formular.js | 169 ++++++++++++++++++++++++++ src/index.js | 1 - 10 files changed, 239 insertions(+), 9 deletions(-) create mode 100644 .vscode/launch.json rename src/settings.js => Plan.md (100%) create mode 100644 docs/Formular.md create mode 100644 gitcommands.txt/gitignore delete mode 100644 src/formular.css delete mode 100644 src/formular.js rename src/{ => formular}/css/formular.css (89%) rename src/{ => formular/html}/formular.html (66%) create mode 100644 src/formular/js/formular.js delete mode 100644 src/index.js diff --git a/.vscode/launch.json b/.vscode/launch.json new file mode 100644 index 0000000..503fe88 --- /dev/null +++ b/.vscode/launch.json @@ -0,0 +1,14 @@ +{ + // Use IntelliSense to learn about possible attributes. + // Hover to view descriptions of existing attributes. + // For more information, visit: https://go.microsoft.com/fwlink/?linkid=830387 + "version": "0.2.0", + "configurations": [ + { + "type": "msedge", + "request": "launch", + "name": "Open Formular.html", + "file": "c:\\Users\\OBulai\\Development\\BMI-Web-App-1\\src\\formular\\html\\formular.html" + } + ] +} \ No newline at end of file diff --git a/src/settings.js b/Plan.md similarity index 100% rename from src/settings.js rename to Plan.md diff --git a/docs/Formular.md b/docs/Formular.md new file mode 100644 index 0000000..00983b1 --- /dev/null +++ b/docs/Formular.md @@ -0,0 +1,34 @@ +# BMI Form - Input Component + +## 📝 Project Description +This part of the BMI calculator is responsible for **user input**. Users can enter their personal data and calculate their BMI. + +## 🎯 Features + +### Input Fields +- **Age** (1-120 years) +- **Date** (calculation date) +- **Weight** (1-500 kg) +- **Height** (50-250 cm) + +### Buttons +- **BMI berechnen** - Starts the calculation +- **Clear/Reset** - Clears all inputs and results + +### Functionality +- ✅ **Input Validation** - Checks for empty fields and valid values +- ✅ **BMI Calculation** - Formula: `Weight / (Height/100)²` +- ✅ **BMI Categories** - Underweight, Normal weight, Overweight, Obesity +- ✅ **Local Storage** - Saves inputs in browser +- ✅ **Auto-Load** - Loads saved data on page start +- ✅ **Responsive Design** - Works on desktop and mobile + + +## 🚀 Usage + +1. Open `formular.html` in browser +2. Fill all 4 input fields +3. Click "BMI berechnen" +4. Result is displayed and saved +5. On reload: Data is still there +6. "Clear/Reset" deletes all data \ No newline at end of file diff --git a/gitcommands.txt/gitignore b/gitcommands.txt/gitignore new file mode 100644 index 0000000..812cc91 --- /dev/null +++ b/gitcommands.txt/gitignore @@ -0,0 +1,12 @@ +git init +git checkout -b new_branch # create a new branch +git branch # what branches do I have? +git status + +git pull origin develop +git pull origin feature/Formular_Eingabe + +git push -u origin feature/Formular_Eingabe +git push -u origin develop + + diff --git a/src/formular.css b/src/formular.css deleted file mode 100644 index d3f5a12..0000000 --- a/src/formular.css +++ /dev/null @@ -1 +0,0 @@ - diff --git a/src/formular.js b/src/formular.js deleted file mode 100644 index 5ebd446..0000000 --- a/src/formular.js +++ /dev/null @@ -1 +0,0 @@ -// ("Please enter the weight in kg: ") diff --git a/src/css/formular.css b/src/formular/css/formular.css similarity index 89% rename from src/css/formular.css rename to src/formular/css/formular.css index 758bd9b..402bf39 100644 --- a/src/css/formular.css +++ b/src/formular/css/formular.css @@ -25,17 +25,19 @@ h1 { border: 1px solid #e0e0e0; } -/* Input fields styling */ input[type="number"], input[type="date"] { width: 100%; + max-width: 350px; + margin: 0 auto 15px auto; + /* ← Auto links/rechts = zentriert */ padding: 12px; - margin-bottom: 15px; border: 2px solid #ddd; border-radius: 4px; font-size: 16px; transition: border-color 0.3s ease; font-family: Arial, sans-serif; + display: block; } /* Focus state for inputs */ diff --git a/src/formular.html b/src/formular/html/formular.html similarity index 66% rename from src/formular.html rename to src/formular/html/formular.html index 8e2eefc..097bcb9 100644 --- a/src/formular.html +++ b/src/formular/html/formular.html @@ -3,18 +3,20 @@ BMI Rechner - - + +

BMI Formular

- + +