Weekend-Vibes · nurmandev · Jun 18, 2022 · Jun 18, 2022 · Jun 18, 2022 · Jun 19, 2022
diff --git a/IMG-20220618-WA0002.jpg b/IMG-20220618-WA0002.jpg
diff --git a/app.js b/app.js
diff --git a/index.html b/index.html
@@ -1,10 +1,38 @@
 <!DOCTYPE html>
 <html lang="en">
-  <head>
-    <meta charset="UTF-8" />
-    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
-    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-    <title>BMI Calculator</title>
-  </head>
-  <body></body>
-</html>
+<head>
+    <meta charset="UTF-8">
+    <meta http-equiv="X-UA-Compatible" content="IE=edge">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>Degree To Radient</title>
+    <link rel="stylesheet" href="style.css">
+</head>
+<body>
+
+  <h1>Degree Covert to Radians</h1>
+
+  <div class="container">
+    <label for="degree">Degrees</label>
+    <input type="number" name="degrees" id="degree" class="input" placeholder="   Degree">
+
+    <br>
+    <label for="radians">Radians</label>
+    <input type="number" name="radient"  id="radians" class="input" placeholder="   Radians">
+  </div>
+
+
+  <script>
+    const degreeInput = document.getElementById("degree");
+    console.log(degreeInput);
+
+    function covertToRadiens() {
+        const degreeValue = document.getElementById("degree").value;
+        let radientValue = degreeValue * (3.14 / 180);
+        document.getElementById("radians").value = radientValue;
+    }
+
+    degreeInput.addEventListener("input", covertToRadiens);
+  </script>
+
+</body>
+</html>
diff --git a/style.css b/style.css
@@ -0,0 +1,32 @@
+body{
+    padding: 0;
+    margin: 0;
+    box-sizing: border-box;
+    text-align: center;
+    font-family: sans-serif;
+}
+
+.container{
+    width: 35%;
+    height: 40vh;
+    background-color: dodgerblue;
+    margin: 10px auto;
+    padding: 1rem;
+    border-radius: 10px;
+}
+.container input{
+    width: 80%;
+    height: 30px;
+    margin: 10px;
+    border-radius: 5px;
+    outline: none;
+    border: 1px solid #333;
+    font-family: sans-serif;
+}
+label{
+    align-items: flex-start;
+    justify-content: start;
+    color: #fff;
+    font-family: sans-serif;
+    font-size: 20px;
+}
diff --git a/styles.css b/styles.css