Add files via upload

alokverma18 · Sep 4, 2023 · 059e11a · 059e11a
1 parent a0a12c7
commit 059e11a
Showing 1 changed file with 60 additions and 0 deletions.
diff --git a/index.html b/index.html
@@ -0,0 +1,60 @@
+<!DOCTYPE html>
+
+<html>
+
+<head>
+    <meta charset = "UTF-8">
+    <title>Joke</title>
+    <link href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css" rel="stylesheet"
+    integrity="sha384-GLhlTQ8iRABdZLl6O3oVMWSktQOp6b7In1Zl3/Jr59b6EGGoI1aFkw7cmDA6j6gD" crossorigin="anonymous">
+  <script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.bundle.min.js"
+    integrity="sha384-w76AqPfDkMBDXo30jS1Sgez6pr3x5MlQ1ZAGC+nuZB+EYdgRZgiwxhTBTkF7CXvN"
+    crossorigin="anonymous"></script>
+
+
+</head>
+
+<body style="margin: 8% 25%;">
+    <div class="px-4 py-5 my-5 text-center" style=" border-color: rgb(128, 255, 0); border-style:double; ">
+
+        <svg xmlns="http://www.w3.org/2000/svg" width="50" height="75" fill="currentColor" class="bi bi-file-earmark-code" viewBox="0 0 16 16">
+            <path d="M14 4.5V14a2 2 0 0 1-2 2H4a2 2 0 0 1-2-2V2a2 2 0 0 1 2-2h5.5L14 4.5zm-3 0A1.5 1.5 0 0 1 9.5 3V1H4a1 1 0 0 0-1 1v12a1 1 0 0 0 1 1h8a1 1 0 0 0 1-1V4.5h-2z"/>
+            <path d="M8.646 6.646a.5.5 0 0 1 .708 0l2 2a.5.5 0 0 1 0 .708l-2 2a.5.5 0 0 1-.708-.708L10.293 9 8.646 7.354a.5.5 0 0 1 0-.708zm-1.292 0a.5.5 0 0 0-.708 0l-2 2a.5.5 0 0 0 0 .708l2 2a.5.5 0 0 0 .708-.708L5.707 9l1.647-1.646a.5.5 0 0 0 0-.708z"/>
+        </svg>
+        <h1 class="display-5 fw-bold text-body-emphasis">Programming Joke</h1>
+        <div class="col-lg-6 mx-auto" style="margin: 25px auto;">
+            <p class="setup lead mb-4" style="color: orangered; font: 25px Merriweather">*********</p>
+            <p class="delivery lead mb-4" style="color: rgb(0, 34, 255); font: 25px  Merriweather;  font-style: italic;"></p>
+            <div class="d-grid gap-2 d-sm-flex justify-content-sm-center" style="margin: 10px auto;">
+                <button type="button" class="btn btn-outline-dark btn-sm px-4">Another one!</button>
+            </div>
+        </div>
+    </div>
+    <script>
+        const url = 'https://v2.jokeapi.dev/joke/Programming?blacklistFlags=nsfw,racist&type=twopart';
+
+        async function joke(){
+
+            const response = await fetch(url);
+
+            if(response.status==404){
+                document.querySelector(".lead").innerHTML = "AN ERROR OCCURED :(";
+            }else{
+
+                const data = await response.json();
+
+                console.log(data);
+
+                document.querySelector(".setup").innerHTML = data.setup;
+
+                document.querySelector(".delivery").innerHTML = data.delivery;
+
+            }
+        }
+        joke();
+        const btn = document.querySelector('.btn');
+        btn.addEventListener('click',joke);
+    </script>
+</body>
+
+</html>