From 35caef110e6689b683aa60a3f3899189a8268c75 Mon Sep 17 00:00:00 2001 From: satyam Date: Sun, 4 Aug 2024 15:39:09 +0530 Subject: [PATCH] Added Normality Calculator --- Calculators/Normality-Calculator/index.html | 48 ++++++++++ Calculators/Normality-Calculator/script.js | 38 ++++++++ Calculators/Normality-Calculator/style.css | 100 ++++++++++++++++++++ index.html | 15 +++ 4 files changed, 201 insertions(+) create mode 100644 Calculators/Normality-Calculator/index.html create mode 100644 Calculators/Normality-Calculator/script.js create mode 100644 Calculators/Normality-Calculator/style.css diff --git a/Calculators/Normality-Calculator/index.html b/Calculators/Normality-Calculator/index.html new file mode 100644 index 000000000..e6f94e1ef --- /dev/null +++ b/Calculators/Normality-Calculator/index.html @@ -0,0 +1,48 @@ + + + + + + + Normality Calculator + + +
+

Normality Calculator

+
+
+ + +
+
+ + + +
+
+ + +
+
+ + + +
+ +
+
+ + grams +
+
+ + + diff --git a/Calculators/Normality-Calculator/script.js b/Calculators/Normality-Calculator/script.js new file mode 100644 index 000000000..6bc50bdcb --- /dev/null +++ b/Calculators/Normality-Calculator/script.js @@ -0,0 +1,38 @@ +function calculateMass() { + const formulaWeight = parseFloat(document.getElementById("formulaWeight").value); + let volume = parseFloat(document.getElementById("finalVolume").value); + const volumeUnit = document.getElementById("volumeUnit").value; + const equivalentWeight = parseFloat(document.getElementById("equivalentWeight").value); + let concentration = parseFloat(document.getElementById("concentration").value); + const concentrationUnit = document.getElementById("concentrationUnit").value; + + if (isNaN(formulaWeight) || isNaN(volume) || isNaN(equivalentWeight) || isNaN(concentration)) { + alert("Please enter valid numbers."); + return; + } + + // Convert volume to liters + switch (volumeUnit) { + case "mL": + volume = volume / 1000; + break; + case "uL": + volume = volume / 1e6; + break; + } + + // Convert concentration to normal + switch (concentrationUnit) { + case "mN": + concentration = concentration / 1000; + break; + case "uN": + concentration = concentration / 1e6; + break; + } + + // Calculate mass + const mass = equivalentWeight * concentration * volume; + document.getElementById("mass").value = mass.toFixed(3); + document.getElementById("result").style.animation = "resultFadeIn 1s ease-in-out"; +} diff --git a/Calculators/Normality-Calculator/style.css b/Calculators/Normality-Calculator/style.css new file mode 100644 index 000000000..1fb526755 --- /dev/null +++ b/Calculators/Normality-Calculator/style.css @@ -0,0 +1,100 @@ +body { + font-family: Arial, sans-serif; + background-color: #e0fae2; + display: flex; + justify-content: center; + align-items: center; + height: 100vh; + margin: 0; + overflow: hidden; + animation: backgroundAnimation 10s infinite alternate; +} + +@keyframes backgroundAnimation { + 0% { background-color: #b3eaf1; } + 50%{ + background-color: #00796b;} + 100% { background-color: #2fb4c5; } +} + +.container { + background: linear-gradient(to bottom right, #ffffff, #c8e6c9); + padding: 20px; + border-radius: 16px; + box-shadow: 0 0 20px rgba(0, 0, 0, 0.2); + width: 90%; + max-width: 400px; + text-align: center; + animation: fadeIn 1s ease-in-out; +} + +@keyframes fadeIn { + from { opacity: 0; } + to { opacity: 1; } +} + +h1 { + margin-bottom: 20px; + color: #00796b; + font-size: 24px; + animation: textPop 1s ease-in-out; +} + +@keyframes textPop { + 0% { transform: scale(0.5); } + 100% { transform: scale(1); } +} + +.form-group { + margin-bottom: 15px; + text-align: left; +} + +label { + display: block; + margin-bottom: 5px; + color: #00796b; +} + +input[type="number"], input[type="text"], select { + width: 100%; + padding: 8px; + margin-bottom: 10px; + border: 1px solid #b0bec5; + border-radius: 4px; + box-sizing: border-box; + transition: border 0.3s; +} + +input[type="number"]:focus, input[type="text"]:focus, select:focus { + border-color: #00796b; + outline: none; +} + +button { + background: #007bff; + color: #fff; + padding: 10px; + border: none; + border-radius: 8px; + cursor: pointer; + transition: background 0.3s, transform 0.3s; +} + +button:hover { + background: #0056b3; + transform: scale(1.05); +} + +#result { + margin-top: 20px; + font-size: 18px; + color: #00796b; + animation: resultFadeIn 1s ease-in-out; +} + +@keyframes resultFadeIn { + from { opacity: 0; } + to { opacity: 1; } +} + diff --git a/index.html b/index.html index 770b7ae8b..21a0f9757 100644 --- a/index.html +++ b/index.html @@ -3011,6 +3011,21 @@

Calculates the mass of a compound needed to achieve a desired molarity in a + +
+
+

Normality Calculator

+

Calculates the mass of a compound needed to achieve a desired Normality in a solution.

+ +
+

Molecular Weight Calculator