diff --git a/Calculators/Moles-to-Gram-Calculator/README.md b/Calculators/Moles-Grams-Calculator/README.md similarity index 51% rename from Calculators/Moles-to-Gram-Calculator/README.md rename to Calculators/Moles-Grams-Calculator/README.md index 1c8cbb0e3..3f22e43e5 100644 --- a/Calculators/Moles-to-Gram-Calculator/README.md +++ b/Calculators/Moles-Grams-Calculator/README.md @@ -1,6 +1,6 @@ -# Moles and Grams Calculator +#

Moles Grams Calculator

-## Overview +## Description :- This project is a web-based calculator that allows users to: @@ -8,43 +8,20 @@ This project is a web-based calculator that allows users to: - Convert **Grams to Moles**. - Switch between calculation modes seamlessly. -## Features +## Tech Stacks :- + +- HTML +- CSS +- JavaScript + +## Features :- - **Dynamic Mode Switching**: Toggle between "Moles to Grams" and "Grams to Moles" calculations. - **Responsive Design**: User-friendly interface that works on all screen sizes. - **Real-Time Results**: Instant calculation results based on input values. - **Background Styling**: Beautiful background image to enhance user experience. -## Project Structure - -``` -moles-grams-switch-calculator/ -├── index.html # HTML structure of the calculator -├── style.css # Styling for the calculator -├── script.js # JavaScript functionality for calculations and toggle -├── README.md # Project documentation -└── assets/ - └── background.jpg # Background image for the calculator -``` - -## Setup and Usage - -1. **Clone the Repository**: - - ```bash - git clone - ``` - -2. **Navigate to the Directory**: - - ```bash - cd moles-grams-switch-calculator - ``` - -3. **Open the Application**: - Open `index.html` in your browser to use the calculator. - -## How to Use +## How to Use :- 1. **Default Mode (Moles to Grams)**: @@ -60,30 +37,24 @@ moles-grams-switch-calculator/ 3. **Clear Inputs**: - Switch modes or refresh the page to clear inputs. -## Example Calculations - -### Moles to Grams +## Example Calculations :- +### Moles to Grams: - **Input**: - Moles: `2` - Molar Mass: `18` - **Output**: - `2 moles × 18 g/mol = 36 grams` -### Grams to Moles - +### Grams to Moles: - **Input**: - Grams: `36` - Molar Mass: `18` - **Output**: - `36 grams ÷ 18 g/mol = 2 moles` -## Technologies Used - -- **HTML**: For creating the structure. -- **CSS**: For styling the calculator. -- **JavaScript**: For implementing the functionality. +## Screenshots :- -## License +![image](https://github.com/user-attachments/assets/08771d4d-0c7e-487d-8f21-67fc977d3ab1) -This project is open-source and available under the MIT License. +![image](https://github.com/user-attachments/assets/550079ed-4989-4a89-9d8b-13d5b4dc8cfc) diff --git a/Calculators/Moles-to-Gram-Calculator/assests/background.jpg b/Calculators/Moles-Grams-Calculator/assets/background.jpg similarity index 100% rename from Calculators/Moles-to-Gram-Calculator/assests/background.jpg rename to Calculators/Moles-Grams-Calculator/assets/background.jpg diff --git a/Calculators/Moles-Grams-Calculator/index.html b/Calculators/Moles-Grams-Calculator/index.html new file mode 100644 index 000000000..f1c3570fd --- /dev/null +++ b/Calculators/Moles-Grams-Calculator/index.html @@ -0,0 +1,32 @@ + + + + + + + + Moles Grams Calculator + + + +
+

Moles to Grams Calculator

+ + + + + + + + +
+ + +
+ + + + + \ No newline at end of file diff --git a/Calculators/Moles-to-Gram-Calculator/script.js b/Calculators/Moles-Grams-Calculator/script.js similarity index 96% rename from Calculators/Moles-to-Gram-Calculator/script.js rename to Calculators/Moles-Grams-Calculator/script.js index 1b57a4855..e172d31aa 100644 --- a/Calculators/Moles-to-Gram-Calculator/script.js +++ b/Calculators/Moles-Grams-Calculator/script.js @@ -12,7 +12,7 @@ function calculate() { let result; if (mode === 'moles-to-grams') { result = input1 * input2; // Moles to grams - document.getElementById('result').innerText = `${input1} moles × ${input2} g/mol = ${result.toFixed(2)} grams`; + document.getElementById('result').innerText = `${input1} moles x ${input2} g/mol = ${result.toFixed(2)} grams`; } else { result = input1 / input2; // Grams to moles document.getElementById('result').innerText = `${input1} grams ÷ ${input2} g/mol = ${result.toFixed(2)} moles`; @@ -39,4 +39,4 @@ function toggleMode() { document.getElementById('result').innerText = ''; document.getElementById('input1').value = ''; document.getElementById('input2').value = ''; -} +} \ No newline at end of file diff --git a/Calculators/Moles-to-Gram-Calculator/style.css b/Calculators/Moles-Grams-Calculator/style.css similarity index 90% rename from Calculators/Moles-to-Gram-Calculator/style.css rename to Calculators/Moles-Grams-Calculator/style.css index cfb153107..c7ad65ea8 100644 --- a/Calculators/Moles-to-Gram-Calculator/style.css +++ b/Calculators/Moles-Grams-Calculator/style.css @@ -1,13 +1,14 @@ body { font-family: Arial, sans-serif; - background-image: url('/Calculators/Moles-to-Gram-Calculator/assests/background.jpg'); + background-image: url('assets/background.jpg'); background-size: cover; margin: 0; padding: 0; display: flex; justify-content: center; align-items: center; - height: 100vh; + height: 100%; + min-height: 100vh; } .calculator { @@ -67,4 +68,4 @@ button:hover { font-size: 18px; font-weight: bold; color: #333; -} +} \ No newline at end of file diff --git a/Calculators/Moles-to-Gram-Calculator/index.html b/Calculators/Moles-to-Gram-Calculator/index.html deleted file mode 100644 index 2b8109dc3..000000000 --- a/Calculators/Moles-to-Gram-Calculator/index.html +++ /dev/null @@ -1,26 +0,0 @@ - - - - - - Moles and Grams Calculator - - - -
-

Moles to Grams Calculator

- - - - - - - -
- -
- - - diff --git a/calculators.json b/calculators.json index 4aa96dbc5..81c716ccf 100644 --- a/calculators.json +++ b/calculators.json @@ -1512,11 +1512,11 @@ "source": "https://github.com/Rakesh9100/CalcDiverse/tree/main/Calculators/Molecular-Weight-Calculator" }, { - "title": "Moles-to-Gram-Calculator", - "description": "A calculator to convert between moles and grams using the molar mass of a substance. This includes: \n1. **Moles to Grams** conversion: Moles * Molar Mass = Grams \n2. **Grams to Moles** conversion: Grams / Molar Mass = Moles. \nThe user interface will allow easy input of mass and molar mass with an option to switch between calculations.", - "link": "./Calculators/Moles-to-Gram-Calculator/index.html", - "source": "https://github.com/Rakesh9100/CalcDiverse/tree/main/Calculators/Moles-to-Gram-Calculator" - }, + "title": "Moles Grams Calculator", + "description": "Converts between moles and grams using the molar mass of a substance.", + "link": "./Calculators/Moles-Grams-Calculator/index.html", + "source": "https://github.com/Rakesh9100/CalcDiverse/tree/main/Calculators/Moles-Grams-Calculator" + }, { "title": "Momentum Calculator", "description": "Calculates the momentum of the body using its mass and velocity.",