Update README.md
This commit is contained in:
parent
27a491e6ae
commit
99f731c966
177
README.md
177
README.md
@ -1,163 +1,20 @@
|
|||||||
<!DOCTYPE html>
|
def hitung_beban_maksimum(berat_keledai_kg):
|
||||||
<html lang="id">
|
"""
|
||||||
<head>
|
Menghitung beban maksimum yang dapat dibawa keledai.
|
||||||
<meta charset="UTF-8" />
|
Rata-rata keledai dapat membawa 20%–30% dari berat badannya.
|
||||||
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no" />
|
"""
|
||||||
<title>Penghitung Beban Keledai</title>
|
if berat_keledai_kg <= 0:
|
||||||
<style>
|
raise ValueError("Berat keledai harus lebih dari 0 kg.")
|
||||||
/* Reset and base */
|
|
||||||
*, *::before, *::after {
|
beban_min = berat_keledai_kg * 0.2
|
||||||
box-sizing: border-box;
|
beban_maks = berat_keledai_kg * 0.3
|
||||||
}
|
|
||||||
body {
|
|
||||||
margin: 0;
|
|
||||||
font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
|
|
||||||
background: linear-gradient(135deg, #a8dadc, #457b9d);
|
|
||||||
color: #1d3557;
|
|
||||||
display: flex;
|
|
||||||
justify-content: center;
|
|
||||||
align-items: center;
|
|
||||||
height: 600px;
|
|
||||||
max-width: 350px;
|
|
||||||
margin: auto;
|
|
||||||
padding: 1rem;
|
|
||||||
}
|
|
||||||
.container {
|
|
||||||
background-color: #f1faee;
|
|
||||||
border-radius: 1rem;
|
|
||||||
padding: 2rem;
|
|
||||||
width: 100%;
|
|
||||||
box-shadow: 0 8px 20px rgba(0,0,0,0.2);
|
|
||||||
display: flex;
|
|
||||||
flex-direction: column;
|
|
||||||
align-items: center;
|
|
||||||
}
|
|
||||||
h1 {
|
|
||||||
margin-bottom: 0.25rem;
|
|
||||||
font-weight: 700;
|
|
||||||
font-size: 1.8rem;
|
|
||||||
color: #1d3557;
|
|
||||||
}
|
|
||||||
p.subtitle {
|
|
||||||
margin-top: 0;
|
|
||||||
color: #457b9d;
|
|
||||||
font-weight: 500;
|
|
||||||
font-size: 1rem;
|
|
||||||
margin-bottom: 2rem;
|
|
||||||
}
|
|
||||||
label {
|
|
||||||
font-weight: 600;
|
|
||||||
font-size: 1rem;
|
|
||||||
align-self: flex-start;
|
|
||||||
margin-bottom: 0.25rem;
|
|
||||||
}
|
|
||||||
input[type="number"] {
|
|
||||||
width: 100%;
|
|
||||||
padding: 0.5rem 0.75rem;
|
|
||||||
font-size: 1.1rem;
|
|
||||||
border: 2px solid #a8dadc;
|
|
||||||
border-radius: 0.5rem;
|
|
||||||
transition: border-color 0.3s ease;
|
|
||||||
}
|
|
||||||
input[type="number"]:focus {
|
|
||||||
outline: none;
|
|
||||||
border-color: #1d3557;
|
|
||||||
}
|
|
||||||
button {
|
|
||||||
margin-top: 1.5rem;
|
|
||||||
background-color: #1d3557;
|
|
||||||
color: #f1faee;
|
|
||||||
border: none;
|
|
||||||
padding: 0.75rem 1.25rem;
|
|
||||||
font-size: 1.1rem;
|
|
||||||
font-weight: 700;
|
|
||||||
border-radius: 0.7rem;
|
|
||||||
cursor: pointer;
|
|
||||||
width: 100%;
|
|
||||||
transition: background-color 0.3s ease;
|
|
||||||
}
|
|
||||||
button:hover,
|
|
||||||
button:focus {
|
|
||||||
background-color: #457b9d;
|
|
||||||
}
|
|
||||||
.result {
|
|
||||||
margin-top: 2rem;
|
|
||||||
font-weight: 700;
|
|
||||||
font-size: 1.25rem;
|
|
||||||
text-align: center;
|
|
||||||
min-height: 2rem;
|
|
||||||
}
|
|
||||||
.safe {
|
|
||||||
color: #2a9d8f;
|
|
||||||
}
|
|
||||||
.warning {
|
|
||||||
color: #e63946;
|
|
||||||
}
|
|
||||||
@media (max-width: 400px) {
|
|
||||||
.container {
|
|
||||||
padding: 1rem;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
</style>
|
|
||||||
</head>
|
|
||||||
<body>
|
|
||||||
<div class="container" role="main" aria-live="polite">
|
|
||||||
<h1>Beban Maksimal Keledai</h1>
|
|
||||||
<p class="subtitle">Hitung apakah beban yang akan dibawa aman untuk keledai Anda.</p>
|
|
||||||
<form id="load-form" onsubmit="return false;">
|
|
||||||
<label for="weightInput">Masukkan berat beban (kg):</label>
|
|
||||||
<input
|
|
||||||
type="number"
|
|
||||||
id="weightInput"
|
|
||||||
name="weightInput"
|
|
||||||
min="1"
|
|
||||||
max="200"
|
|
||||||
placeholder="Contoh: 50"
|
|
||||||
required
|
|
||||||
aria-describedby="weightHelp"
|
|
||||||
inputmode="numeric"
|
|
||||||
/>
|
|
||||||
<small id="weightHelp" style="color:#555; font-size:0.85rem;">Beban aman maksimal sekitar 50kg - 70kg (tergantung ukuran keledai)</small>
|
|
||||||
<button type="submit" id="calculateBtn">Hitung</button>
|
|
||||||
</form>
|
|
||||||
<div id="result" class="result" aria-live="assertive"></div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<script>
|
|
||||||
(function(){
|
|
||||||
const form = document.getElementById('load-form');
|
|
||||||
const input = document.getElementById('weightInput');
|
|
||||||
const resultDiv = document.getElementById('result');
|
|
||||||
|
|
||||||
// Typical safe weight range for donkeys varies, often around 50kg-70kg
|
|
||||||
const safeWeightMin = 50;
|
|
||||||
const safeWeightMax = 70;
|
|
||||||
|
|
||||||
form.addEventListener('submit', () => {
|
|
||||||
const weight = parseFloat(input.value);
|
|
||||||
if (isNaN(weight) || weight < 1) {
|
|
||||||
resultDiv.textContent = "Tolong masukkan angka berat beban yang valid.";
|
|
||||||
resultDiv.className = "result warning";
|
|
||||||
return;
|
|
||||||
}
|
|
||||||
if (weight <= safeWeightMax) {
|
|
||||||
resultDiv.textContent = `Aman! Beban ${weight} kg sesuai untuk keledai Anda.`;
|
|
||||||
resultDiv.className = "result safe";
|
|
||||||
} else {
|
|
||||||
resultDiv.textContent = `PERINGATAN! Beban ${weight} kg terlalu berat untuk keledai Anda. Kurangi beban!`;
|
|
||||||
resultDiv.className = "result warning";
|
|
||||||
}
|
|
||||||
});
|
|
||||||
|
|
||||||
// Accessibility: Clear result on input change
|
|
||||||
input.addEventListener('input', () => {
|
|
||||||
resultDiv.textContent = '';
|
|
||||||
resultDiv.className = 'result';
|
|
||||||
});
|
|
||||||
})();
|
|
||||||
</script>
|
|
||||||
</body>
|
|
||||||
</html>
|
|
||||||
|
|
||||||
|
return beban_min, beban_maks
|
||||||
|
|
||||||
|
def main():
|
||||||
|
berat = float(input("Masukkan berat keledai (kg): "))
|
||||||
|
beban_min, beban_maks = hitung_beban_maksimum(berat)
|
||||||
|
print(f"Beban ideal yang bisa dibawa: {beban_min:.2f} kg - {beban_maks:.2f} kg")
|
||||||
|
|
||||||
|
if __name__ == "__main__":
|
||||||
|
main()
|
||||||
|
|||||||
Loading…
x
Reference in New Issue
Block a user