Change the copy block to a btn for clicking

Author: Mutugiii

index.html

@@ -21,23 +21,12 @@ <h1 class="overlay-text">Bienvenido a Planet</h1>
             <div class="text">
                 <img src="assets/logo-coop-white.png" alt="co-op logo Todos Conectadas Logo" class="logo">
                 <img src="assets/logo-white.png" alt="OLE Todos Conectadas Logo" class="logo">
-                <p>Por favor copie el siguiente URL para continuar:</p>
+                <p>Por favor haga clic en el siguiente enlace para continuar:</p>
                 <div class="url-container">
-                    <input type="text" value="http://192.168.39.253" id="url" readonly>
-                    <button onclick="copyURL()">
-                        <img src="assets/clipboard.png" alt="Copy" class="clipboard-icon">
-                    </button>
+                    <a href="http://192.168.39.253" target="_blank" class="url-link">http://192.168.39.253</a>
                 </div>
             </div>
         </div>
     </div>
-    <script>
-        function copyURL() {
-            var urlField = document.getElementById("url");
-            urlField.select();
-            urlField.setSelectionRange(0, 99999);
-            document.execCommand("copy");
-        }
-    </script>
 </body>
 </html>

styles.css

@@ -78,34 +78,19 @@ body, html {
   margin-top: 20px;
 }
 
-input[type="text"] {
-  padding: 10px;
-  border: none;
-  border-radius: 5px;
-  width: 80%;
-  max-width: 300px;
-  text-align: center;
-  margin-right: 10px;
-}
-
-button {
-  padding: 10px;
-  border: none;
+.url-link {
+  padding: 10px 20px;
   border-radius: 5px;
   background-color: #C1FF72;
   color: #035AA6;
-  cursor: pointer;
+  text-decoration: none;
+  font-weight: bold;
 }
 
-button:hover {
+.url-link:hover {
   background-color: #AECCF2;
 }
 
-.clipboard-icon {
-  width: 20px;
-  height: 20px;
-}
-
 @media screen and (max-width: 768px) {
   .overlay-text {
     font-size: 2rem;