From a5d72661781366a7cd8786474f6c68eb33cc28b3 Mon Sep 17 00:00:00 2001 From: Avdhesh-Varshney <114330097+Avdhesh-Varshney@users.noreply.github.com> Date: Thu, 22 Feb 2024 01:17:36 +0530 Subject: [PATCH 1/4] =?UTF-8?q?Yarn=20Calculator=20=F0=9F=A7=B6?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- Calculators/Yarn-Density-Calculator/README.md | 22 ++++++++ .../Yarn-Density-Calculator/index.html | 51 +++++++++++++++++++ Calculators/Yarn-Density-Calculator/script.js | 45 ++++++++++++++++ Calculators/Yarn-Density-Calculator/style.css | 40 +++++++++++++++ index.html | 14 +++++ 5 files changed, 172 insertions(+) create mode 100644 Calculators/Yarn-Density-Calculator/README.md create mode 100644 Calculators/Yarn-Density-Calculator/index.html create mode 100644 Calculators/Yarn-Density-Calculator/script.js create mode 100644 Calculators/Yarn-Density-Calculator/style.css diff --git a/Calculators/Yarn-Density-Calculator/README.md b/Calculators/Yarn-Density-Calculator/README.md new file mode 100644 index 000000000..778813c6d --- /dev/null +++ b/Calculators/Yarn-Density-Calculator/README.md @@ -0,0 +1,22 @@ +# Yarn Density Calculator + +## Description + +The Yarn Density Calculator is a web-based tool designed to assist users in computing conversion of different unit values based on input parameters related to a material's unit required. + +## Tech Stacks + +- HTML +- CSS +- Bootstrap +- JavaScript + +## Screenshots + +![image](https://github.com/Rakesh9100/CalcDiverse/assets/114330097/c8f9dfa8-818d-46a4-9341-84e9c13b28fc) + + +### Created By + +[Avdhesh Varshney](https://github.com/Avdhesh-Varshney) + diff --git a/Calculators/Yarn-Density-Calculator/index.html b/Calculators/Yarn-Density-Calculator/index.html new file mode 100644 index 000000000..204ac2b32 --- /dev/null +++ b/Calculators/Yarn-Density-Calculator/index.html @@ -0,0 +1,51 @@ + + + + + + + Yarn Density Calculator + + + + + +
+

Yarn Density Calculator

+

Created by Avdhesh Varshney

+ + +
+ From + +
+ + +
+ To + +
+ + +
+ + + + + + \ No newline at end of file diff --git a/Calculators/Yarn-Density-Calculator/script.js b/Calculators/Yarn-Density-Calculator/script.js new file mode 100644 index 000000000..7f3cc988f --- /dev/null +++ b/Calculators/Yarn-Density-Calculator/script.js @@ -0,0 +1,45 @@ +const conversionFactors = { + '1': { + '1': 1, + '2': 590.5412, + '3': 1550.1708, + '4': 885.8119 + }, + '2': { + '1': 590.5412, + '2': 1, + '3': 2.6250, + '4': 1.5000 + }, + '3': { + '1': 1550.1708, + '2': 0.3810, + '3': 1, + '4': 0.5714 + }, + '4': { + '1': 885.8119, + '2': 0.6667, + '3': 1.7500, + '4': 1 + } +}; + +const fromSelect = document.querySelector('#unit1'); +const toSelect = document.querySelector('#unit2'); +const fromInput = document.querySelector('.value1'); +const toInput = document.querySelector('.value2'); +const calculateButton = document.querySelector('button'); + +calculateButton.addEventListener('click', convertYarnDensity); + +function convertYarnDensity() { + const fromValue = parseFloat(fromInput.value); + const fromUnit = fromSelect.value; + const toUnit = toSelect.value; + + const conversionFactor = conversionFactors[fromUnit][toUnit]; + const toValue = fromValue * conversionFactor; + + toInput.value = isNaN(toValue) ? '' : toValue.toFixed(2); +} diff --git a/Calculators/Yarn-Density-Calculator/style.css b/Calculators/Yarn-Density-Calculator/style.css new file mode 100644 index 000000000..136b14877 --- /dev/null +++ b/Calculators/Yarn-Density-Calculator/style.css @@ -0,0 +1,40 @@ +* { + margin: 0; + padding: 0; + overflow: hidden; +} + +body { + background-color: #3e4451; + color: white; +} + +.container { + padding: 3rem 0; + position: absolute; + transform: translate(-50%, -50%); + top: 50%; + left: 50%; + align-items: center; + text-align: center; + background-color: #3f4e6e; + border-radius: 1rem; + max-width: 700px; + display: flex; + flex-direction: column; + justify-content: center; + gap: 1rem; +} + +h1 { + font-size: 2.5rem; +} + +.from, .to { + max-width: 300px; +} + +a { + text-decoration: none; + color: white; +} \ No newline at end of file diff --git a/index.html b/index.html index 3059b24b8..6ab43a4d6 100644 --- a/index.html +++ b/index.html @@ -1836,6 +1836,20 @@

Checks if a number is circular prime and finds circular prime numbers in a r +
+
+

Yarn Density Calculator

+

Convert the linear density of the yarn from unit system to another.

+ +
+
From dcbde12f165c2f594e43c9fb2094534288ca28be Mon Sep 17 00:00:00 2001 From: Rakesh Roshan Date: Fri, 23 Feb 2024 13:53:14 +0530 Subject: [PATCH 2/4] Update README.md --- Calculators/Yarn-Density-Calculator/README.md | 8 +------- 1 file changed, 1 insertion(+), 7 deletions(-) diff --git a/Calculators/Yarn-Density-Calculator/README.md b/Calculators/Yarn-Density-Calculator/README.md index 778813c6d..3d2e2d32a 100644 --- a/Calculators/Yarn-Density-Calculator/README.md +++ b/Calculators/Yarn-Density-Calculator/README.md @@ -1,4 +1,4 @@ -# Yarn Density Calculator +#

Yarn Density Calculator

## Description @@ -14,9 +14,3 @@ The Yarn Density Calculator is a web-based tool designed to assist users in comp ## Screenshots ![image](https://github.com/Rakesh9100/CalcDiverse/assets/114330097/c8f9dfa8-818d-46a4-9341-84e9c13b28fc) - - -### Created By - -[Avdhesh Varshney](https://github.com/Avdhesh-Varshney) - From 2feef0ab26ff9d5ec7e7539be5597b7d40803e9c Mon Sep 17 00:00:00 2001 From: Rakesh Roshan Date: Fri, 23 Feb 2024 13:54:59 +0530 Subject: [PATCH 3/4] Update index.html --- Calculators/Yarn-Density-Calculator/index.html | 3 +-- 1 file changed, 1 insertion(+), 2 deletions(-) diff --git a/Calculators/Yarn-Density-Calculator/index.html b/Calculators/Yarn-Density-Calculator/index.html index 204ac2b32..3916e7f01 100644 --- a/Calculators/Yarn-Density-Calculator/index.html +++ b/Calculators/Yarn-Density-Calculator/index.html @@ -13,7 +13,6 @@

Yarn Density Calculator

-

Created by Avdhesh Varshney