Final commit

app.js

@@ -55,7 +55,17 @@ button.addEventListener("click", () => {
   </div>
   </div>
   </center>
+  <div class="sound"></div>
+  <iframe width="0" height="0" src="https://www.youtube.com/embed/k4VivDkES2s?rel=0&amp;autoplay=1" allow='autoplay' </iframe>
+  
 `
+let song = document.querySelector(".sound");
+setInterval(()=>{
+  song.innerHTML = `
+  <iframe width="0" height="0" src="https://www.youtube.com/embed/k4VivDkES2s?rel=0&amp;autoplay=1" allow='autoplay' </iframe>
+  `
+  console.log("chal gya")
+},62000)
 
     let name = document.querySelector(".name");
     console.log(window.location.host)
@@ -75,17 +85,19 @@ button.addEventListener("click", () => {
 
       name.textContent = finalyRes;
     }
-
-
-
+    console.log(name.textContent)
+    let getError = `http://${window.location.host} http://${window.location.host}`
+    console.log(getError)
+    if (name.textContent == getError) {
+      name.textContent = 'Inter Name'
+    };
     let buttonSet = document.getElementById("but-name");
     let input = document.querySelector(".name-inter");
     buttonSet && buttonSet.addEventListener('click', (event) => {
       event.preventDefault();
       let name = document.querySelector(".name");
       var searchParams = new URLSearchParams(input.value.trim());
       if (input.value.trim()) {
-
         history.pushState({}, '', '?' + searchParams.toString())
         input.value = ""
         let name = document.querySelector(".name");
@@ -107,6 +119,14 @@ button.addEventListener("click", () => {
         }
         input.style.display = "none";
         buttonSet.style.display = "none"
+        document.querySelector(".maim-con").innerHTML = `
+        <a class="sent-watts" href="https://api.whatsapp.com/send?text=Check%20out%20this%20link%20${encodeURIComponent(window.location.href.trim())}" target="_blank">
+<div class="watssBtn">
+<img height="30px" src="./images/wp.svg"/>
+<span>Click here to Share on WhatsApp</span> 
+<img height="30px" src="./images/wp.svg"/>
+</a>
+`
 
       }
       else {
@@ -118,3 +138,5 @@ button.addEventListener("click", () => {
 
   }, 2000)
 })
+// console.log(window.location.search)
+// console.log(encodeURIComponent(window.location.href.trim()))

index.html

@@ -28,6 +28,7 @@
   </div>
 <div id="wellcom" style="display: none;"></div>
 
+<!-- <iframe width="560" height="315" src="https://www.youtube.com/embed/EiMX1G8pnYA" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share" allowfullscreen></iframe> -->
 
 
   <script src="app.js"></script>

style.css

@@ -58,9 +58,6 @@
 .left-side {
     left: 0% !important;
     position: fixed !important;
-
-    /* flex-direction: column; */
-
 }
 
 .left-side-images>img {
@@ -77,7 +74,7 @@
     display: flex;
     justify-content: center;
     align-items: center;
-    margin-bottom: 15px;
+    margin-bottom: 45px;
     margin-top: 20px;
 }
 
@@ -110,7 +107,7 @@
     font-family: arial black;
     font-size: 20px;
     background-image:
-        linear-gradient(to right, red, orange, yellow, green, blue, indigo, violet, red);
+        linear-gradient(to right, green, orange, yellow, green, blue, indigo, violet, red);
     -webkit-background-clip: text;
     -webkit-text-fill-color: transparent;
     animation: rainbow-animation 200s linear infinite;
@@ -159,16 +156,24 @@
     opacity: 0.5;
 }
 
-/* @media screen and (max-width: 1021px) {
-    .card{
-        width: 355px;
-    }
+.watssBtn {
+    width: 90%;
+    background-color: #34af23;
+    padding: 8px;
+    border-radius: 9px;
+    cursor: pointer;
 }
-@media screen and (max-width: 464px) {
-    .card{
-        width: 100% !important;
-        height: 100% !important;
-        margin: unset;
-        position: absolute !important;
-    }
-} */
+
+.watssBtn:active {
+    opacity: 0.5;
+}
+
+.watssBtn>span {
+    color: #fff;
+    font-size: small;
+}
+
+.sent-watts {
+    color: #fff;
+    text-decoration: none;
+}