From f14ec068325c4afdb13764007baf9e8930deb322 Mon Sep 17 00:00:00 2001
From: Rakesh9100 <roshanrakesh7362@gmail.com>
Date: Sat, 18 Jan 2025 20:23:39 +0530
Subject: [PATCH] Refactored some calculators
---
Calculators/Lease-Calculator/README.md | 2 +-
Calculators/Lease-Calculator/index.html | 15 +-
Calculators/Lease-Calculator/script.js | 8 +-
Calculators/Lease-Calculator/style.css | 130 ++++++++++++---
.../Special-Number-2-Calculator/README.md | 21 ---
.../Special-Number-2-Calculator/index.html | 28 ----
.../Special-Number-2-Calculator/script.js | 33 ----
.../Special-Number-2-Calculator/style.css | 157 ------------------
.../Strong-Number-Calculator/README.md | 2 +-
.../Strong-Number-Calculator/index.html | 36 ++--
.../Strong-Number-Calculator/script.js | 70 +++++++-
.../Strong-Number-Calculator/style.css | 119 +++++++------
calculators.json | 8 +-
13 files changed, 278 insertions(+), 351 deletions(-)
delete mode 100644 Calculators/Special-Number-2-Calculator/README.md
delete mode 100644 Calculators/Special-Number-2-Calculator/index.html
delete mode 100644 Calculators/Special-Number-2-Calculator/script.js
delete mode 100644 Calculators/Special-Number-2-Calculator/style.css
diff --git a/Calculators/Lease-Calculator/README.md b/Calculators/Lease-Calculator/README.md
index b7e1164f5..8d0a7dc94 100644
--- a/Calculators/Lease-Calculator/README.md
+++ b/Calculators/Lease-Calculator/README.md
@@ -23,4 +23,4 @@ A simple and intuitive lease calculator that helps users determine their monthly
## Screenshots :-
-
+
diff --git a/Calculators/Lease-Calculator/index.html b/Calculators/Lease-Calculator/index.html
index be5d82e00..e4d2fe7e1 100644
--- a/Calculators/Lease-Calculator/index.html
+++ b/Calculators/Lease-Calculator/index.html
@@ -33,9 +33,18 @@ <h1>Lease Calculator</h1>
</form>
<div id="results" class="results" style="display: none;">
<h2>Calculation Results</h2>
- <p id="monthlyPayment"></p>
- <p id="totalPayment"></p>
- <p id="totalInterest"></p>
+ <div class="result-item">
+ <span class="result-label">Monthly Payment:</span>
+ <span id="monthlyPayment" class="result-value"></span>
+ </div>
+ <div class="result-item">
+ <span class="result-label">Total Payment:</span>
+ <span id="totalPayment" class="result-value"></span>
+ </div>
+ <div class="result-item">
+ <span class="result-label">Total Interest:</span>
+ <span id="totalInterest" class="result-value"></span>
+ </div>
</div>
<p id="errorMessage" class="error-message" style="display: none;"></p>
</div>
diff --git a/Calculators/Lease-Calculator/script.js b/Calculators/Lease-Calculator/script.js
index 2ac795f6b..5d17b9d54 100644
--- a/Calculators/Lease-Calculator/script.js
+++ b/Calculators/Lease-Calculator/script.js
@@ -1,7 +1,7 @@
function calculateLease() {
const assetValue = parseFloat(document.getElementById('assetValue').value);
const residualValue = parseFloat(document.getElementById('residualValue').value);
- const leaseTerm = parseFloat(document.getElementById('leaseTerm').value) * 12;
+ const leaseTerm = parseFloat(document.getElementById('leaseTerm').value) * 12;
const interestRate = parseFloat(document.getElementById('interestRate').value) / 100 / 12;
const errorMessage = document.getElementById('errorMessage');
@@ -21,9 +21,9 @@ function calculateLease() {
const totalPayment = monthlyPayment * leaseTerm;
const totalInterest = totalPayment - (assetValue - residualValue);
- document.getElementById('monthlyPayment').innerText = `Monthly Payment: $${monthlyPayment.toFixed(2)}`;
- document.getElementById('totalPayment').innerText = `Total Payment: $${totalPayment.toFixed(2)}`;
- document.getElementById('totalInterest').innerText = `Total Interest: $${totalInterest.toFixed(2)}`;
+ document.getElementById('monthlyPayment').innerText = `$${monthlyPayment.toFixed(2)}`;
+ document.getElementById('totalPayment').innerText = `$${totalPayment.toFixed(2)}`;
+ document.getElementById('totalInterest').innerText = `$${totalInterest.toFixed(2)}`;
errorMessage.style.display = "none";
results.style.display = "block";
diff --git a/Calculators/Lease-Calculator/style.css b/Calculators/Lease-Calculator/style.css
index ff0ab38ce..e1968c21d 100644
--- a/Calculators/Lease-Calculator/style.css
+++ b/Calculators/Lease-Calculator/style.css
@@ -1,26 +1,38 @@
+:root {
+ --primary-color: #3498db;
+ --secondary-color: #2ecc71;
+ --background-color: #f1f0ec;
+ --text-color: #34495e;
+ --error-color: #e74c3c;
+}
+
body {
- font-family: Arial, sans-serif;
- background: linear-gradient(135deg, #74b9ff, #a29bfe);
+ font-family: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif;
+ background-color: var(--background-color);
display: flex;
justify-content: center;
align-items: center;
- height: 100vh;
+ min-height: 100vh;
margin: 0;
+ padding: 20px;
+ box-sizing: border-box;
}
.container {
background: white;
- padding: 25px;
- border-radius: 12px;
- box-shadow: 0 4px 15px rgba(0, 0, 0, 0.2);
- max-width: 450px;
+ padding: 30px;
+ border-radius: 15px;
+ box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1);
+ max-width: 500px;
width: 100%;
- animation: fadeIn 1s ease-in-out;
+ animation: fadeIn 0.5s ease-in-out;
}
h1 {
text-align: center;
- color: #2d3436;
+ color: var(--primary-color);
+ margin-bottom: 30px;
+ font-size: 28px;
}
.input-group {
@@ -30,27 +42,30 @@ h1 {
label {
display: block;
margin-bottom: 8px;
- color: #636e72;
+ color: var(--text-color);
+ font-weight: 600;
}
input {
width: 100%;
padding: 12px;
- border: 1px solid #cccccc;
- border-radius: 6px;
+ border: 2px solid #ddd;
+ border-radius: 8px;
font-size: 16px;
transition: all 0.3s ease;
+ box-sizing: border-box;
}
input:focus {
- border-color: #0984e3;
+ border-color: var(--primary-color);
outline: none;
- box-shadow: 0 0 8px rgba(9, 132, 227, 0.3);
+ box-shadow: 0 0 10px rgba(52, 152, 219, 0.2);
}
.btn-group {
display: flex;
- gap: 10px;
+ gap: 15px;
+ margin-top: 30px;
}
button {
@@ -58,37 +73,65 @@ button {
padding: 12px;
font-size: 16px;
border: none;
- border-radius: 6px;
+ border-radius: 8px;
cursor: pointer;
color: white;
- transition: background 0.3s ease;
+ transition: all 0.3s ease;
+ font-weight: 600;
}
.calculate-btn {
- background: #00b894;
+ background: var(--primary-color);
}
.calculate-btn:hover {
- background: #00a37a;
+ background: #2980b9;
}
.reset-btn {
- background: #d63031;
+ background: var(--secondary-color);
}
.reset-btn:hover {
- background: #b52a26;
+ background: #27ae60;
}
-.results,
-.error-message {
- margin-top: 20px;
+.results {
+ margin-top: 30px;
+ background-color: #f8f9fa;
+ padding: 20px;
+ border-radius: 8px;
animation: slideIn 0.5s ease-in-out;
}
+.results h2 {
+ color: var(--primary-color);
+ margin-bottom: 15px;
+ font-size: 22px;
+}
+
+.result-item {
+ display: flex;
+ justify-content: space-between;
+ margin-bottom: 10px;
+}
+
+.result-label {
+ font-weight: 600;
+ color: var(--text-color);
+}
+
+.result-value {
+ font-weight: 700;
+ color: var(--primary-color);
+}
+
.error-message {
- color: #d63031;
+ color: var(--error-color);
font-weight: bold;
+ text-align: center;
+ margin-top: 20px;
+ animation: shake 0.5s ease-in-out;
}
@keyframes fadeIn {
@@ -111,4 +154,41 @@ button {
transform: translateY(0);
opacity: 1;
}
+}
+
+@keyframes shake {
+
+ 0%,
+ 100% {
+ transform: translateX(0);
+ }
+
+ 10%,
+ 30%,
+ 50%,
+ 70%,
+ 90% {
+ transform: translateX(-5px);
+ }
+
+ 20%,
+ 40%,
+ 60%,
+ 80% {
+ transform: translateX(5px);
+ }
+}
+
+@media (max-width: 600px) {
+ .container {
+ padding: 20px;
+ }
+
+ h1 {
+ font-size: 24px;
+ }
+
+ .btn-group {
+ flex-direction: column;
+ }
}
\ No newline at end of file
diff --git a/Calculators/Special-Number-2-Calculator/README.md b/Calculators/Special-Number-2-Calculator/README.md
deleted file mode 100644
index a06491ac4..000000000
--- a/Calculators/Special-Number-2-Calculator/README.md
+++ /dev/null
@@ -1,21 +0,0 @@
-# <p align="center">Special Number-2 Calculator</p>
-
-## Description :-
-
-This Calculator predicts whether the number that is being provided as input by the user is a Special Number or not.
-A "special number" typically refers to a number with unique properties, but the definition can vary. For this example, let's consider a special number to be one whose sum of the factorial of digits equals the number itself.
-For example, 145 is a special number because 1! + 4! + 5! = 145
-
-## Tech Stacks :-
-
-- HTML
-- CSS
-- JavaScript
-
-## Screenshots :-
-
-
-
-
-
-
diff --git a/Calculators/Special-Number-2-Calculator/index.html b/Calculators/Special-Number-2-Calculator/index.html
deleted file mode 100644
index 50216f42a..000000000
--- a/Calculators/Special-Number-2-Calculator/index.html
+++ /dev/null
@@ -1,28 +0,0 @@
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="UTF-8" />
- <meta name="viewport" content="width=device-width, initial-scale=1.0" />
- <link rel="stylesheet" href="style.css" />
- <title>Special Number-2 Calculator</title>
-</head>
-<body>
- <div class="container">
- <h1>Special Number-2 Calculator</h1>
- <form id="specialNumberForm" class="form-group">
- <div class="form-control">
- <label for="number">Enter a Number:</label>
- <input type="number" id="number" min="0" required />
- </div>
- <button type="button" class="btn" onclick="checkSpecialNumber()">
- Check
- </button>
- </form>
- <div id="result" class="result" style="display: none">
- <h2>Result:</h2>
- <p id="resultMessage"></p>
- </div>
- </div>
- <script src="script.js"></script>
-</body>
-</html>
diff --git a/Calculators/Special-Number-2-Calculator/script.js b/Calculators/Special-Number-2-Calculator/script.js
deleted file mode 100644
index 5c44c07a7..000000000
--- a/Calculators/Special-Number-2-Calculator/script.js
+++ /dev/null
@@ -1,33 +0,0 @@
-function factorial(n) {
- if (n === 0 || n === 1) return 1;
- return n * factorial(n - 1);
-}
-
-function checkSpecialNumber() {
- const numberInput = document.getElementById("number");
- const number = numberInput.value;
- const resultElement = document.getElementById("result");
- const resultMessage = document.getElementById("resultMessage");
-
- if (number === "") {
- resultMessage.textContent = "Please enter a number";
- resultMessage.style.color = "orange";
- resultElement.style.display = "block";
- return;
- }
-
- const digits = number.split("");
- let sum = 0;
-
- for (let digit of digits) {
- sum += factorial(parseInt(digit));
- }
-
- if (sum == number) {
- resultMessage.textContent = `${number} is a special number because the sum of the factorial of digits is equal to the number itself!`;
- } else {
- resultMessage.textContent = `${number} is not a special number because the sum of the factorial of digits is not equal to the number itself!`;
- }
-
- resultElement.style.display = "block";
-}
diff --git a/Calculators/Special-Number-2-Calculator/style.css b/Calculators/Special-Number-2-Calculator/style.css
deleted file mode 100644
index 8f774619f..000000000
--- a/Calculators/Special-Number-2-Calculator/style.css
+++ /dev/null
@@ -1,157 +0,0 @@
-body,
-h1,
-h2,
-p,
-form,
-label,
-input,
-button,
-div {
- margin: 0;
- padding: 0;
- box-sizing: border-box;
-}
-
-body {
- font-family: "Arial", sans-serif;
- background: linear-gradient(-45deg, #6a11cb, #236ae4, #ff5f5f, #ffc371);
- background-size: 400% 400%;
- animation: gradientAnimation 15s ease infinite;
- display: flex;
- justify-content: center;
- align-items: center;
- height: 100vh;
- color: #ffffff;
-}
-
-@keyframes gradientAnimation {
- 0% {
- background-position: 0% 50%;
- }
-
- 50% {
- background-position: 100% 50%;
- }
-
- 100% {
- background-position: 0% 50%;
- }
-}
-
-.container {
- background: rgba(255, 255, 255, 0.1);
- padding: 40px;
- box-shadow: 0 4px 30px rgba(0, 0, 0, 0.1);
- border-radius: 10px;
- max-width: 500px;
- width: 100%;
- text-align: center;
- backdrop-filter: blur(10px);
-}
-
-h1 {
- margin-bottom: 20px;
- font-size: 32px;
- color: #ffffff;
-}
-
-.form-group {
- margin-bottom: 20px;
-}
-
-.form-control {
- margin-bottom: 15px;
- text-align: left;
-}
-
-label {
- display: block;
- margin-bottom: 5px;
- color: #e0e0e0;
- font-weight: bold;
-}
-
-input {
- width: 100%;
- padding: 12px;
- border: none;
- border-radius: 5px;
- font-size: 16px;
- margin-bottom: 10px;
- background: rgba(255, 255, 255, 0.2);
- color: #ffffff;
- outline: none;
-}
-
-input::placeholder {
- color: #e0e0e0;
-}
-
-input:focus {
- border: 2px solid #2575fc;
- background: rgba(255, 255, 255, 0.3);
-}
-
-.btn {
- padding: 12px 20px;
- border: none;
- border-radius: 5px;
- font-size: 16px;
- cursor: pointer;
- transition: background-color 0.3s ease;
- background: linear-gradient(-45deg, #ff5f6d, #ffc371, #9911cb, #2575fc);
- background-size: 400% 400%;
- animation: buttonGradientAnimation 10s ease infinite;
- color: #ffffff;
-}
-
-@keyframes buttonGradientAnimation {
- 0% {
- background-position: 0% 50%;
- }
-
- 50% {
- background-position: 100% 50%;
- }
-
- 100% {
- background-position: 0% 50%;
- }
-}
-
-.btn:hover {
- opacity: 0.9;
-}
-
-.result {
- margin-top: 20px;
- padding: 20px;
- background: rgba(0, 0, 0, 0.3);
- border-radius: 10px;
-}
-
-.result h2 {
- font-size: 24px;
- margin-bottom: 10px;
- color: #ffffff;
-}
-
-.result p {
- font-size: 22px;
- color: #ffc371;
-}
-
-@media (max-width: 600px) {
- .container {
- padding: 20px;
- }
-
- h1 {
- font-size: 24px;
- }
-
- .btn {
- padding: 10px 15px;
- font-size: 14px;
- }
-}
diff --git a/Calculators/Strong-Number-Calculator/README.md b/Calculators/Strong-Number-Calculator/README.md
index dea2af7b4..d6b4d7b80 100644
--- a/Calculators/Strong-Number-Calculator/README.md
+++ b/Calculators/Strong-Number-Calculator/README.md
@@ -13,4 +13,4 @@ A Strong number is a number whose sum of the factorial of its digits equals the
## Screenshots :-
-
+
diff --git a/Calculators/Strong-Number-Calculator/index.html b/Calculators/Strong-Number-Calculator/index.html
index 384d6a671..aa2335933 100644
--- a/Calculators/Strong-Number-Calculator/index.html
+++ b/Calculators/Strong-Number-Calculator/index.html
@@ -1,25 +1,27 @@
<!DOCTYPE html>
<html lang="en">
<head>
- <meta charset="UTF-8" />
- <meta name="viewport" content="width=device-width, initial-scale=1.0" />
- <link rel="stylesheet" href="style.css" />
+ <meta charset="UTF-8">
+ <meta name="viewport" content="width=device-width, initial-scale=1.0">
+ <link rel="stylesheet" href="style.css">
<title>Strong Number Calculator</title>
</head>
<body>
- <header>
- <h1>Strong Number Calculator</h1>
- </header>
- <main>
- <div class="container">
- <form name="myform">
- <label for="no">Enter a number to check:</label>
- <input type="number" name="numOfDigits" id="no" required />
- <button type="button" onclick="check()">Check</button>
- </form>
- <div id="strongNumbers"></div>
- </div>
- </main>
+ <div class="calculator-container">
+ <header>
+ <h1>Strong Number Calculator</h1>
+ </header>
+ <main>
+ <div class="calculator">
+ <form id="myform">
+ <label for="no">Enter a number to check:</label>
+ <input type="number" name="numOfDigits" id="no" required>
+ <button type="submit">Check</button>
+ </form>
+ <div id="strongNumbers" class="result"></div>
+ </div>
+ </main>
+ </div>
<script src="script.js"></script>
</body>
-</html>
+</html>
\ No newline at end of file
diff --git a/Calculators/Strong-Number-Calculator/script.js b/Calculators/Strong-Number-Calculator/script.js
index 2bc1e9c34..72e845529 100644
--- a/Calculators/Strong-Number-Calculator/script.js
+++ b/Calculators/Strong-Number-Calculator/script.js
@@ -1,3 +1,42 @@
+function calculateLease() {
+ const assetValue = parseFloat(document.getElementById('assetValue').value);
+ const residualValue = parseFloat(document.getElementById('residualValue').value);
+ const leaseTerm = parseFloat(document.getElementById('leaseTerm').value) * 12;
+ const interestRate = parseFloat(document.getElementById('interestRate').value) / 100 / 12;
+
+ const errorMessage = document.getElementById('errorMessage');
+ const results = document.getElementById('results');
+
+ if (isNaN(assetValue) || isNaN(residualValue) || isNaN(leaseTerm) || isNaN(interestRate)) {
+ errorMessage.innerText = "Please fill in all fields correctly.";
+ errorMessage.style.display = "block";
+ results.style.display = "none";
+ return;
+ }
+
+ const depreciation = (assetValue - residualValue) / leaseTerm;
+ const interest = (assetValue + residualValue) * interestRate / 2;
+
+ const monthlyPayment = depreciation + interest;
+ const totalPayment = monthlyPayment * leaseTerm;
+ const totalInterest = totalPayment - (assetValue - residualValue);
+
+ document.getElementById('monthlyPayment').innerText = `$${monthlyPayment.toFixed(2)}`;
+ document.getElementById('totalPayment').innerText = `$${totalPayment.toFixed(2)}`;
+ document.getElementById('totalInterest').innerText = `$${totalInterest.toFixed(2)}`;
+
+ errorMessage.style.display = "none";
+ results.style.display = "block";
+}
+
+function resetResults() {
+ document.getElementById('results').style.display = 'none';
+ document.getElementById('errorMessage').style.display = 'none';
+ document.getElementById('monthlyPayment').innerText = '';
+ document.getElementById('totalPayment').innerText = '';
+ document.getElementById('totalInterest').innerText = '';
+}
+
document.getElementById('myform').addEventListener('submit', function (event) {
event.preventDefault();
check();
@@ -16,8 +55,10 @@ function factorial(n) {
function check() {
const num = document.getElementById('no').value;
+ const resultElement = document.getElementById("strongNumbers");
+
if (num === "" || num.includes('.') || num < 0) {
- alert("Please enter a valid whole number.");
+ showResult("Please enter a valid whole number.", "error");
return;
}
@@ -32,10 +73,29 @@ function check() {
}
if (sum === numValue) {
- document.getElementById("strongNumbers").innerHTML = `Yes, ${numValue} is a strong number .
- <br/> Explanation: Sum of the factorial of the digits of ${numValue} equals ${numValue} itself`;
+ showResult(`Yes, ${numValue} is a strong number.<br>Explanation: Sum of the factorial of the digits of ${numValue} equals ${numValue} itself.`, "success");
} else {
- document.getElementById("strongNumbers").innerHTML = `No, ${numValue} is not a strong number. <br/>
- Explanation: sum of the factorial of ${numValue} is not equals ${numValue} itself`;
+ showResult(`No, ${numValue} is not a strong number.<br>Explanation: Sum of the factorial of the digits of ${numValue} is not equal to ${numValue} itself.`, "error");
}
}
+
+function showResult(message, type) {
+ const resultElement = document.getElementById("strongNumbers");
+ resultElement.innerHTML = message;
+ resultElement.className = `result ${type}`;
+ resultElement.style.animation = 'none';
+ resultElement.offsetHeight; // Trigger reflow
+ resultElement.style.animation = null;
+ resultElement.style.animation = 'fadeIn 0.5s';
+}
+
+const style = document.createElement('style');
+style.textContent = `
+ @keyframes fadeIn {
+ from { opacity: 0; transform: translateY(-10px); }
+ to { opacity: 1; transform: translateY(0); }
+ }
+ .result.success { color: #4caf50; font-weight: 600; }
+ .result.error { color: #f44336; font-weight: 600; }
+`;
+document.head.appendChild(style);
\ No newline at end of file
diff --git a/Calculators/Strong-Number-Calculator/style.css b/Calculators/Strong-Number-Calculator/style.css
index 889d2b3b7..e78630a71 100644
--- a/Calculators/Strong-Number-Calculator/style.css
+++ b/Calculators/Strong-Number-Calculator/style.css
@@ -1,82 +1,103 @@
+:root {
+ --primary-color: #6a5acd;
+ --secondary-color: #9370db;
+ --background-color: #f0f8ff;
+ --text-color: #333;
+ --result-bg-color: #e6e6fa;
+}
+
body {
- background-color: rgb(6, 0, 67);
+ font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
+ background-color: var(--background-color);
margin: 0;
+ padding: 0;
display: flex;
- flex-direction: column;
- align-items: center;
justify-content: center;
- height: 100vh;
+ align-items: center;
+ min-height: 100vh;
+}
+
+.calculator-container {
+ background-color: white;
+ border-radius: 20px;
+ box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1);
+ padding: 2rem;
+ width: 100%;
+ max-width: 400px;
+}
+
+header {
+ text-align: center;
+ margin-bottom: 2rem;
}
h1 {
- color: #c7c3c3;
- margin-bottom: 40px;
+ color: var(--primary-color);
+ font-size: 2rem;
+ margin: 0;
}
-.container {
+.calculator {
display: flex;
flex-direction: column;
- color: rgb(5, 12, 43);
- font-size: large;
- align-items: center;
- justify-content: center;
- background-color: white;
- border-radius: 30px;
- padding: 100px;
- box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
+ gap: 1.5rem;
}
form {
display: flex;
flex-direction: column;
- align-items: center;
- margin-bottom: 20px;
+ gap: 1rem;
}
label {
- margin-bottom: 20px;
+ font-weight: 600;
+ color: var(--text-color);
}
input {
- padding: 8px;
- margin-bottom: 20px;
- width: 150px;
+ padding: 0.75rem;
+ border: 2px solid var(--secondary-color);
+ border-radius: 8px;
+ font-size: 1rem;
+ transition: border-color 0.3s ease;
+}
+
+input:focus {
+ outline: none;
+ border-color: var(--primary-color);
}
button {
- padding: 10px;
- background-color: #4e45d5;
+ background-color: var(--primary-color);
color: white;
- width: fit-content;
- box-shadow: 5px 5px 7px 0px #0000003f;
- font-size: 18px;
+ border: none;
+ border-radius: 8px;
+ padding: 0.75rem;
+ font-size: 1rem;
cursor: pointer;
- transition: all 0.5s;
- font-weight: 500;
- border: solid 3px transparent;
- position: relative;
- z-index: 1;
+ transition: background-color 0.3s ease;
}
-button::before {
- content: "";
- position: absolute;
- background-color: #ffffff;
- top: 0px;
- left: 0;
- right: 0;
- bottom: 0px;
- z-index: -1;
- transform: scaleX(0);
- transform-origin: left;
- transition: all 0.8s;
+button:hover {
+ background-color: var(--secondary-color);
}
-button:hover::before {
- transform: scaleX(1);
+.result {
+ background-color: var(--result-bg-color);
+ border-radius: 8px;
+ padding: 1rem;
+ font-size: 1rem;
+ line-height: 1.5;
+ color: var(--text-color);
+ text-align: center;
}
-button:hover {
- border: solid 3px #4e45d5;
- color: black;
-}
+@media (max-width: 480px) {
+ .calculator-container {
+ padding: 1.5rem;
+ }
+
+ h1 {
+ font-size: 1.75rem;
+ }
+}
\ No newline at end of file
diff --git a/calculators.json b/calculators.json
index 726fffaf1..c6e65cedf 100644
--- a/calculators.json
+++ b/calculators.json
@@ -2219,12 +2219,6 @@
"link": "./Calculators/Special-Number-Calculator/index.html",
"source": "https://github.com/Rakesh9100/CalcDiverse/tree/main/Calculators/Special-Number-Calculator"
},
- {
- "title": "Special Number-2 Calculator",
- "description": "Checks whether a number is a special number or not.",
- "link": "./Calculators/Special-Number-2-Calculator/index.html",
- "source": "https://github.com/Rakesh9100/CalcDiverse/tree/main/Calculators/Special-Number-2-Calculator"
- },
{
"title": "Speed Calculator",
"description": "This tool allows users to convert speeds between different units.",
@@ -2633,4 +2627,4 @@
"link": "./Calculators/Zodiac-Sign-Calculator/index.html",
"source": "https://github.com/Rakesh9100/CalcDiverse/tree/main/Calculators/Zodiac-Sign-Calculator"
}
-]
+]
\ No newline at end of file