sahandghavidel · imrozkhan205 · Sep 15, 2024
diff --git a/projects/guess-number/index.html b/projects/guess-number/index.html
@@ -0,0 +1,12 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>Document</title>
+    <script src="script.js"defer ></script>
+</head>
+<body>
+
+</body>
+</html>
diff --git a/projects/guess-number/script.js b/projects/guess-number/script.js
@@ -0,0 +1,33 @@
+const minNum = 50;
+const maxNum = 100; 
+
+const answer = Math.floor(Math.random()*(maxNum-minNum+1))+minNum
+// console.log(answer);
+
+let attempt = 0;
+let guess;
+let running  = true;
+while (running){
+    guess = window.prompt(`Guess a number between ${minNum} and ${maxNum}`)
+    guess = Number(guess);
+    if(isNaN(guess)){
+        window.alert("Please enter a valid number")
+    }
+    else if(guess<minNum || guess > maxNum){
+        window.alert("Please enter a valid number");
+    }
+    else{
+        attempt ++;
+        if(guess<answer){
+            window.alert("Low!! Try again");
+        }
+        else if (guess>answer){
+            window.alert("High!! Try again");
+        }
+        else{
+            window.alert(`Correct the answer was ${answer} and it took you ${attempt}`)
+            running = false;
+        }
+    }
+
+}
diff --git a/projects/guess-number/styles.css b/projects/guess-number/styles.css
diff --git a/projects/temperature-conversion/index.html b/projects/temperature-conversion/index.html
@@ -0,0 +1,28 @@
+<!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="styles.css">
+    <title>Temperature conversion</title>
+</head>
+<body>
+    <form>
+        <h1>
+            Temperature conversion
+        </h1>
+        <input type="number" id="textBox" value="0"><br>
+<div class="radio">
+        <input type="radio" id="toFahrenheit" name="unit">
+        <label for="toFahrenheit" >Celcius --> Fahrenheit</label></br>
+
+        <input type="radio" id="toCelcius" name="unit">
+        <label for="toCelcius" >Fahrenheit --> Celcius</label><br>
+</div>
+        <button type="button" onclick="convert()" >Submit</button>
+        <p id="result"></p>
+    </form>
+<script src="script.js" ></script>
+
+</body>
+</html>
diff --git a/projects/temperature-conversion/script.js b/projects/temperature-conversion/script.js
@@ -0,0 +1,21 @@
+const textBox = document.getElementById("textBox");
+const toFahrenheit = document.getElementById("toFahrenheit");
+const toCelcius = document.getElementById("toCelcius");
+const result = document.getElementById("result");
+let temp;
+
+function convert(){
+    if(toFahrenheit.checked){
+        temp = Number(textBox.value);
+        temp = temp * 9 / 5 + 32;
+        result.textContent = temp.toFixed(1)+ "F"
+        }
+    else if(toCelcius.checked){
+        temp = Number(textBox.value);
+        temp = (temp-32) * (5/9);
+        result.textContent = temp.toFixed(1)+ "C"
+    }
+    else{
+        result.textContent  = "Select a unit";
+    }
+}
diff --git a/projects/temperature-conversion/styles.css b/projects/temperature-conversion/styles.css
@@ -0,0 +1,53 @@
+body{
+    font-family: system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
+    background: linear-gradient(to left, lightblue, lightpink, lightgreen );
+    margin-top: 50px;
+
+}
+h1{
+    color: black;
+}
+form{
+    box-shadow: 0px 10px 10px 6px rgb(74, 71, 71);
+    text-align: center;
+    max-width: 300px;
+    margin: auto;
+    padding: 25px;   
+}
+#textBox{
+    font-family: system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
+    font-weight: bold;
+    height: 30px;
+    width: 100px;
+    text-align: center;
+    font-size: 2em;
+    border: 1.5px solid rgb(113, 108, 108);
+    margin-bottom: 20px;
+    color: rgb(82, 80, 80);
+    border-radius: 10px;
+}
+.radio{
+    font-family: system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
+    font-size: 15px;
+    font-weight: bold;
+    padding: .2rem;
+}
+button{
+    font-family: system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
+    padding: 0.4rem;
+    margin-top: 15px;
+    font-weight: bold;
+    border-radius: 10px;
+    border-color: rgb(160, 152, 152);
+    border-width: 1px;
+}
+button:hover{
+    background-color: rgb(206, 206, 205);
+    transition: 0.2s ease;
+}
+#result{
+    color: black;
+    font-family: system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
+    font-weight: bold;
+    font-size: 20px;
+}