Added Weight based on Planet by Aryan Khokhar

Rakesh9100 · May 30, 2024 · 82703cd · 82703cd
1 parent a4940de
commit 82703cd
Show file tree

Hide file tree

Showing 6 changed files with 151 additions and 0 deletions.
diff --git a/Calculators/Weight-Converter-Based-on-Planet/README.md b/Calculators/Weight-Converter-Based-on-Planet/README.md
@@ -0,0 +1,15 @@
+# <p align="center">Weight Calculator</p>
+
+## Description :-
+
+Convert Weight of an object to different different Planet
+
+## Tech Stacks :-
+
+- HTML
+- CSS
+- JavaScript
+
+## Screenshots :-
+
+![alt text](image.png)
diff --git a/Calculators/Weight-Converter-Based-on-Planet/image.png b/Calculators/Weight-Converter-Based-on-Planet/image.png
diff --git a/Calculators/Weight-Converter-Based-on-Planet/index.html b/Calculators/Weight-Converter-Based-on-Planet/index.html
@@ -0,0 +1,48 @@
+<!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">
+    <link rel="preconnect" href="https://fonts.googleapis.com">
+    <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
+    <link href="https://fonts.googleapis.com/css2?family=PT+Mono:wght@500&display=swap" rel="stylesheet">
+    <title>Weight Calculator</title>
+</head>
+
+<body>
+    <div class="converter">
+        <div class="converterbox">
+            <label for="Weight-on-earth">Weight of an object on Earth:</label><br>
+            <input type="number" id="Weight-on-earth" name="Weight-on-earth" placeholder="Weight"> 
+            <label for=""></label>
+            <select title="unit" name="unit" id="unit">
+                <option value="kg">Kg</option>
+                <option value="mt">Mt</option>
+                <option value="t">t</option>
+                <option value="g">g</option>
+                <option value="mg">mg</option>
+                <option value="ug">µg</option>
+            </select>
+            <center class="ctr">to</center>
+            <label for="Weight-on-another-planet" id="woap">Weight on different Planet:</label><br>
+            <select title="planet" name="planet" id="planet">
+                <option value="Mercury">Mercury</option>
+                <option value="Venus">Venus</option>
+                <option value="Mars">Mars</option>
+                <option value="Jupiter">Jupiter</option>
+                <option value="Saturn">Saturn</option>
+                <option value="Uranus">Uranus</option>
+                <option value="Neptune">Neptune</option>
+            </select><br>
+            <center><button class="calculate" onclick="Calculate()">Calculate</button></center>
+            <div class="answer"></div>
+        </div>
+
+    </div>
+
+    <script src="script.js"></script>
+</body>
+
+</html>
diff --git a/Calculators/Weight-Converter-Based-on-Planet/script.js b/Calculators/Weight-Converter-Based-on-Planet/script.js
@@ -0,0 +1,23 @@
+
+function Calculate(params) {
+    let weight_on_earth = document.getElementById("Weight-on-earth").value;
+    let unit = document.getElementById("unit").value;
+    let planet = document.getElementById("planet").value;
+    let weight_on_planet;
+    if(planet == "Mercury"){
+        weight_on_planet = weight_on_earth*0.38;
+    } else if(planet == "Venus") {
+        weight_on_planet = weight_on_earth * 0.91;
+    } else if(planet == "Mars") {
+        weight_on_planet = weight_on_earth * 0.38;
+    } else if(planet == "Jupiter") {
+        weight_on_planet = weight_on_earth * 2.34;
+    } else if(planet == "Saturn") {
+        weight_on_planet = weight_on_earth * 1.06;
+    } else if(planet == "Uranus") {
+        weight_on_planet = weight_on_earth * 0.92;
+    } else if(planet == "Neptune") {
+        weight_on_planet = weight_on_earth * 1.19;
+    }
+    document.querySelector(".answer").textContent = "Weight on "+planet+" = "+weight_on_planet+" "+unit;
+}
diff --git a/Calculators/Weight-Converter-Based-on-Planet/style.css b/Calculators/Weight-Converter-Based-on-Planet/style.css
@@ -0,0 +1,51 @@
+body {
+    font-family:'Times New Roman', Times, serif;
+    background: linear-gradient(to bottom, #6c5b7b, #c06c84);
+    margin: 0;
+    padding: 0;
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    height: 100vh;
+}
+
+.converter{
+    height: 50vh;
+    width: 70vh;
+    background-color: #fff;
+    display: flex;
+    justify-content: center;
+    align-items: center;
+}
+.converterbox{
+    height: 50%;
+    width: 50%;
+}
+.converterbox input{
+    margin: 0.7vw 0.7vw 1.5vw 0vw;
+}
+.converterbox .ctr{
+    margin-bottom: 1.5vw;
+}
+
+#planet{
+    width: 162px;
+    margin-top: 0.7vw;
+}
+.converterbox .calculate{
+    margin: 1.7vw 0 1.25vw 0;
+    padding: 0.3rem 0.7rem;
+    background-color: #74025B;
+    border-radius: 5px;
+    border: white 1px solid;
+    color: white;
+}
+.converterbox .calculate:active{
+    opacity: 0.5;
+}
+
+.converterbox .answer{
+    color: green;
+    width: 100%;
+    text-align: center;
+}
diff --git a/index.html b/index.html
@@ -2274,6 +2274,20 @@ <h3>Calculates weight from kgs to pounds and vice-versa.</h3>
                 </div>
             </div>
         </div>
+        <div class="box">
+            <div class="content">
+                <h2>Weight Converter Based on Planet</h2>
+                <h3>Convert weight of an object based on planet</h3>
+                <div class="card-footer">
+                    <a href="./Calculators/Weight-Converter-Based-on-Planet/index.html" target="_blank">
+                        <button>Try Now</button>
+                    </a>
+                    <a href="https://github.com/Rakesh9100/CalcDiverse/tree/main/Calculators/Weight-Converter-Based-on-Planet" title="Source Code" target="_blank">
+                        <img src="./assets/images/github.png" alt="Source Code"></img>
+                    </a>
+                </div>
+            </div>
+        </div>
         <div class="box">
             <div class="content">
                 <h2>Word Count Calculator</h2>