Убрал всё лишнее, полностью переписал код без питона и вообще без бэкенда.

2026-05-02 23:31:20 +03:00
parent c7220c11b0
commit 4c1fad310a
5 changed files with 173 additions and 230 deletions
@@ -0,0 +1,173 @@
+<!DOCTYPE html>
+<html lang="ru">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>Калькулятор BMI</title>
+    <style>
+        /* Общие стили */
+        body {
+            font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
+            background-color: #e6f7ff;
+            color: #003366;
+            margin: 0;
+            padding: 0;
+            line-height: 1.6;
+        }
+        header {
+            background-color: #b3e0ff;
+            padding: 20px;
+            text-align: center;
+            box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
+        }
+        header h1 {
+            margin: 0;
+            font-size: 28px;
+            color: #003366;
+        }
+        main {
+            max-width: 600px;
+            margin: 30px auto;
+            padding: 20px;
+            background-color: #d9f0ff;
+            border-radius: 10px;
+            box-shadow: 0 4px 10px rgba(0, 0, 0, 0.1);
+        }
+        form label {
+            display: block;
+            margin-top: 15px;
+            font-weight: bold;
+        }
+        form input[type="text"] {
+            width: 100%;
+            padding: 10px;
+            margin-top: 5px;
+            border: 1px solid #99d6ff;
+            border-radius: 5px;
+            font-size: 16px;
+            box-sizing: border-box;
+        }
+        form button {
+            margin-top: 20px;
+            padding: 12px 20px;
+            background-color: #0066cc;
+            color: white;
+            border: none;
+            border-radius: 5px;
+            font-size: 16px;
+            cursor: pointer;
+            transition: background-color 0.3s;
+        }
+        form button:hover {
+            background-color: #004d99;
+        }
+        #result {
+            margin-top: 20px;
+            padding: 15px;
+            background-color: #cce6ff;
+            border-radius: 5px;
+            font-size: 18px;
+            font-weight: bold;
+            text-align: center;
+            display: none;
+        }
+        aside {
+            max-width: 600px;
+            margin: 20px auto;
+            padding: 15px;
+            background-color: #c2e0ff;
+            border-radius: 8px;
+            font-size: 14px;
+        }
+        aside h3 {
+            margin-top: 0;
+            color: #003366;
+        }
+        footer {
+            text-align: center;
+            padding: 20px;
+            background-color: #b3e0ff;
+            color: #003366;
+            font-size: 14px;
+            margin-top: 40px;
+        }
+    </style>
+</head>
+<body>
+    <header>
+        <h1>Калькулятор индекса массы тела (BMI)</h1>
+    </header>
+
+    <main>
+        <form id="bmi-form">
+            <label for="height">Рост (в метрах):</label>
+            <input type="text" id="height" name="height" placeholder="Например: 1.75" required>
+
+            <label for="weight">Вес (в килограммах):</label>
+            <input type="text" id="weight" name="weight" placeholder="Например: 70" required>
+
+            <button type="submit">Рассчитать BMI</button>
+        </form>
+
+        <div id="result"></div>
+    </main>
+
+    <aside>
+        <h3>Интерпретация результата:</h3>
+        <ul>
+            <li><strong>Менее 18.5</strong> — Недостаточный вес</li>
+            <li><strong>18.5–24.9</strong> — Нормальный вес</li>
+            <li><strong>25–29.9</strong> — Избыточный вес</li>
+            <li><strong>30 и более</strong> — Ожирение</li>
+        </ul>
+    </aside>
+
+    <footer>
+        <p>&copy; 2025 Калькулятор BMI. Все права защищены.</p>
+    </footer>
+
+    <script>
+        document.getElementById('bmi-form').addEventListener('submit', function(e) {
+            e.preventDefault();
+
+            const heightInput = document.getElementById('height').value;
+            const weightInput = document.getElementById('weight').value;
+            const resultDiv = document.getElementById('result');
+
+            // Проверка на число
+            const height = parseFloat(heightInput);
+            const weight = parseFloat(weightInput);
+
+            if (isNaN(height) || isNaN(weight)) {
+                resultDiv.style.display = 'block';
+                resultDiv.style.color = '#cc0000';
+                resultDiv.textContent = 'Ошибка: введите корректные числа.';
+                return;
+            }
+
+            if (height <= 0 || height > 3) {
+                resultDiv.style.display = 'block';
+                resultDiv.style.color = '#cc0000';
+                resultDiv.textContent = 'Рост должен быть от 0.5 до 3 метров.';
+                return;
+            }
+
+            if (weight <= 0 || weight > 200) {
+                resultDiv.style.display = 'block';
+                resultDiv.style.color = '#cc0000';
+                resultDiv.textContent = 'Вес должен быть от 1 до 200 кг.';
+                return;
+            }
+
+            // Расчёт BMI
+            const bmi = weight / (height * height);
+            const roundedBmi = Math.round(bmi * 100) / 100;
+
+            // Отображение результата
+            resultDiv.style.display = 'block';
+            resultDiv.style.color = '#003366';
+            resultDiv.textContent = `Ваш BMI: ${roundedBmi}`;
+        });
+    </script>
+</body>
+</html>