Add files via upload

Author: blindaks

UrlShortener/blindaks/script.js

@@ -0,0 +1,23 @@
+const shortenUrl = async () => {
+    const longUrl = document.getElementById('long-url').value;
+    const response = await fetch(`https://api.shrtco.de/v2/shorten?url=${longUrl}`);
+    const data = await response.json();
+    const shortUrl = data.result.full_short_link;
+  
+    const shortUrlContainer = document.getElementById('short-url-container');
+    const shortUrlLink = document.getElementById('short-url').querySelector('a');
+    shortUrlLink.href = shortUrl;
+    shortUrlLink.textContent = shortUrl;
+    shortUrlContainer.style.display = 'block';
+  
+    const copyBtn = document.getElementById('copy-btn');
+    copyBtn.addEventListener('click', () => {
+      navigator.clipboard.writeText(shortUrl).then(() => {
+        alert('Copied to clipboard!');
+      });
+    });
+  };
+  
+  const shortenBtn = document.getElementById('shorten-btn');
+  shortenBtn.addEventListener('click', shortenUrl);
+  

UrlShortener/blindaks/style.css

@@ -0,0 +1,110 @@
+body {
+    font-family: Arial, sans-serif;
+    padding: 20px;
+    background: #fff;
+
+    display: flex;
+    flex-direction: column;
+    justify-content: center;
+    align-items: center;
+  }
+  html, body {
+    height: 100%;
+}
+  .maincontainer h1{
+    color:#fff;
+    text-align: center;
+  }
+  form label {
+    display: block;
+    margin-bottom: 20px;
+    margin-left: 10px;
+    color: #fff;
+    text-align: center;
+  }
+  
+  form input[type="text"] {
+    width: 90%;
+    padding: 10px;
+    margin:auto;
+    border-radius: 20px;
+    border:2px solid #8f94fb;
+    box-shadow: 0px 0px 11px 4px rgba(0, 0, 0, 0.25);
+  }
+  
+  form button {
+    margin: auto;
+    display: flex;
+    margin-top: 1rem;
+    background-color: #c130ed;
+    color: #fff;
+    border: none;
+    padding: 5px 10px;
+    cursor: pointer;
+    border-radius: 10px;
+    font-size: 22px;
+  }
+  form button:hover{
+    border:2px solid #f23e77;
+  }
+  
+  #short-url-container {
+    margin-top: 20px;
+  }
+  #short-url-container p{
+    text-align: center;
+    color: #c130ed;
+    font-weight: 600;
+  }
+  
+  #short-url {
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    
+  }
+  
+  #short-url a {
+    word-wrap: break-word;
+    margin-right: 10px;
+    font-size: 23px;
+    color: #fff;
+  }
+
+  .maincontainer
+  {
+    width:80%;
+    height: auto;
+    min-height:350px;
+    padding:40px;
+    border-radius: 30px;
+    box-shadow: 0px 0px 11px 4px rgba(0, 0, 0, 0.25);
+    background: #4e54c8;
+    background: -webkit-linear-gradient(to right, #8f94fb, #4e54c8);  
+    background: linear-gradient(to right, #fb8fe4, #f35670);
+    margin: auto;
+  }
+
+  #copy-btn{
+    background-color: #c130ed;
+    color: #fff;
+    border: none;
+    padding: 5px 10px;
+    cursor: pointer;
+    border-radius: 10px;
+    font-size: 22px;
+    margin-top: 20px;
+    margin-left: 490px;
+  }
+  .credit a {
+    text-decoration: none;
+    color: #000;
+    font-weight: 800;
+}
+
+.credit {
+    text-align: center;
+    margin-top: 10px;
+    font-family: Verdana,Geneva,Tahoma,sans-serif;
+}
+