Skip to content
Closed
Show file tree
Hide file tree
Changes from all commits
Commits
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
58 changes: 29 additions & 29 deletions index.html
Original file line number Diff line number Diff line change
@@ -1,32 +1,32 @@
<!DOCTYPE html>
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>All-in-One Tools</title>
<link rel="stylesheet" href="css/style.css">
</head>
<body>
<header>
<h1>All-in-One Tools</h1>
<p>A collection of useful tools, all in one place.</p>
</header>
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>All-in-One Tools</title>
<link rel="stylesheet" href="css/style.css" />
</head>
<body>
<header>
<h1>All-in-One Tools</h1>
<p>A collection of useful tools, all in one place.</p>
</header>

<main class="tool-grid">
<div class="tool-card">
<h2>Unit Converter</h2>
<p>Convert between common units (length, weight, temperature).</p>
<a href="tools/converter.html" class="btn">Open</a>
</div>
<div class="tool-card">
<h2>Calculator</h2>
<p>Perform quick calculations.</p>
<a href="tools/calculator.html" class="btn">Open</a>
</div>
</main>
<main class="tool-grid">
<div class="tool-card">
<h2>Unit Converter</h2>
<p>Convert between common units (length, weight, temperature).</p>
<a href="tools/converter.html" class="btn">Open</a>
</div>
<div class="tool-card">
<h2>Calculator</h2>
<p>Perform quick calculations.</p>
<a href="tools/calculator.html" class="btn">Open</a>
</div>
</main>

<footer>
<p>Made with ❤️ by LCS</p>
</footer>
</body>
</html>
<footer>
<p>Made with ❤️ by LCS</p>
</footer>
</body>
</html>
6 changes: 3 additions & 3 deletions tools/converter.css
Original file line number Diff line number Diff line change
Expand Up @@ -4,7 +4,7 @@
background: white;
padding: 1.5rem;
border-radius: 12px;
box-shadow: 0 4px 8px rgba(0,0,0,0.1);
box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
}

.converter-box {
Expand All @@ -17,7 +17,7 @@
font-weight: bold;
}

.converter-box input,
.converter-box input,
.converter-box select {
width: 100%;
padding: 0.6rem;
Expand All @@ -29,4 +29,4 @@
.converter-box h2 {
text-align: center;
color: #4f46e5;
}
}
72 changes: 36 additions & 36 deletions tools/converter.html
Original file line number Diff line number Diff line change
@@ -1,42 +1,42 @@
<!DOCTYPE html>
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Unit Converter</title>
<link rel="stylesheet" href="../css/style.css">
<link rel="stylesheet" href="converter.css">
</head>
<body>
<header>
<h1>Unit Converter</h1>
<a href="../index.html" class="btn">← Back</a>
</header>
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Unit Converter</title>
<link rel="stylesheet" href="../css/style.css" />
<link rel="stylesheet" href="converter.css" />
</head>
<body>
<header>
<h1>Unit Converter</h1>
<a href="../index.html" class="btn">← Back</a>
</header>

<main class="converter-container">
<div class="converter-box">
<label for="type">Conversion Type:</label>
<select id="type">
<option value="length">Length (m ↔ km)</option>
<option value="weight">Weight (kg ↔ g)</option>
<option value="temperature">Temperature (°C ↔ °F)</option>
</select>
</div>
<main class="converter-container">
<div class="converter-box">
<label for="type">Conversion Type:</label>
<select id="type">
<option value="length">Length (m ↔ km)</option>
<option value="weight">Weight (kg ↔ g)</option>
<option value="temperature">Temperature (°C ↔ °F)</option>
</select>
</div>

<div class="converter-box">
<label for="inputValue">Input Value:</label>
<input type="number" id="inputValue" placeholder="Enter value">
</div>
<div class="converter-box">
<label for="inputValue">Input Value:</label>
<input type="number" id="inputValue" placeholder="Enter value" />
</div>

<div class="converter-box">
<button id="convertBtn" class="btn">Convert</button>
</div>
<div class="converter-box">
<button id="convertBtn" class="btn">Convert</button>
</div>

<div class="converter-box">
<h2>Result: <span id="result">-</span></h2>
</div>
</main>
<div class="converter-box">
<h2>Result: <span id="result">-</span></h2>
</div>
</main>

<script src="converter.js"></script>
</body>
</html>
<script src="converter.js"></script>
</body>
</html>
18 changes: 10 additions & 8 deletions tools/converter.js
Original file line number Diff line number Diff line change
Expand Up @@ -17,26 +17,28 @@ convertBtn.addEventListener("click", () => {
switch (type) {
case "length":
// meters <-> kilometers
result = value >= 1000
? `${(value / 1000).toFixed(2)} km`
: `${(value * 1000).toFixed(2)} m`;
result =
value >= 1000
? `${(value / 1000).toFixed(2)} km`
: `${(value * 1000).toFixed(2)} m`;
break;

case "weight":
// kilograms <-> grams
result = value >= 1
? `${(value * 1000).toFixed(2)} g`
: `${(value / 1000).toFixed(2)} kg`;
result =
value >= 1
? `${(value * 1000).toFixed(2)} g`
: `${(value / 1000).toFixed(2)} kg`;
break;

case "temperature":
// Celsius <-> Fahrenheit
result = `${value} °C = ${(value * 9/5 + 32).toFixed(2)} °F`;
result = `${value} °C = ${((value * 9) / 5 + 32).toFixed(2)} °F`;
break;

default:
result = "Unsupported conversion";
}

resultSpan.textContent = result;
});
});