Skip to content

Commit c346f52

Browse files
committed
percentage exersice added
1 parent 22c0fee commit c346f52

File tree

4 files changed

+70
-18
lines changed

4 files changed

+70
-18
lines changed

Sprint-1/prep/example.js

Lines changed: 4 additions & 18 deletions
Original file line numberDiff line numberDiff line change
@@ -1,21 +1,7 @@
1-
// Your birthdate
2-
const birthYear = 1992;
3-
const birthMonth = 3; // March (1 = January, 2 = February, 3 = March, etc.)
4-
const birthDay = 21; // replace with your actual day of birth
1+
//percentage exercise
52

6-
// Current date
7-
const today = new Date();
8-
const currentYear = today.getFullYear();
9-
const currentMonth = today.getMonth() + 1; // getMonth() is 0-based
10-
const currentDay = today.getDate();
3+
const decimalNumber = 0.5;
114

12-
// Calculate age
13-
let age = currentYear - birthYear;
14-
15-
// Adjust if birthday hasn't happened yet this year
16-
if (currentMonth < birthMonth || (currentMonth === birthMonth && currentDay < birthDay)) {
17-
age--;
18-
}
19-
20-
console.log(`You are ${age} years old.`);
5+
const percentage = `${decimalNumber * 100} %`
216

7+
console.log(percentage);
File renamed without changes.

Sprint-1/prep/percentage.html

Lines changed: 66 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,66 @@
1+
<!DOCTYPE html>
2+
<html lang="en">
3+
<head>
4+
<meta charset="UTF-8">
5+
<meta viewport="width=device-width, initial-scale=1.0">
6+
<title>Percentage Exercise</title>
7+
<style>
8+
body{
9+
text-align: center;
10+
font-family: Arial, sans-serif;
11+
margin-top: 10%;
12+
}
13+
input{
14+
padding: 10px;
15+
font-size: 1rem;
16+
border-radius: 5px;
17+
border: 2px solid #ccc;
18+
width: 200px;
19+
text-align: center;
20+
margin: 10px;
21+
}
22+
button{
23+
padding: 10px 20px;
24+
font-size: 1rem;
25+
border-radius: 5px;
26+
border: none;
27+
background-color: #28a745;
28+
color: white;
29+
cursor: pointer;
30+
margin-left: 10px;
31+
transition:all 0.3s ease;
32+
}
33+
button:hover{
34+
background-color: #218838;
35+
transform: scale(1.05);
36+
}
37+
#result{
38+
margin-top: 20px;
39+
font-size: 1.5rem;
40+
color: #333;
41+
}
42+
</style>
43+
</head>
44+
<body>
45+
<h1>Percentage Exercise</h1>
46+
<p>enter a decimal number and click the button to see the percentage:</p>
47+
<input type="number" id="decimal-input" placeholder="Enter a decimal number" step="0.001" min="0" max="1">
48+
<button id="convert-btn">Convert to Percentage</button>
49+
<h2 id="result"></h2>
50+
</body>
51+
<script>
52+
const button = document.getElementById('convert-btn');
53+
const decimalNumber=document.getElementById('decimal-input');
54+
const result=document.getElementById('result');
55+
56+
button.addEventListener('click',()=>{
57+
if(decimalNumber.value > 1 || decimalNumber.value < 0){
58+
result.textContent = "Please enter a decimal number between 0 and 1";
59+
} else {
60+
const percentage = `${decimalNumber.value * 100} %`;
61+
result.textContent = `${percentage}`;
62+
}
63+
64+
})
65+
66+
</script>

0 commit comments

Comments
 (0)