Spaces:
No application file
No application file
| <html lang="pt-BR"> | |
| <head> | |
| <meta charset="UTF-8"> | |
| <meta name="viewport" content="width=device-width, initial-scale=1.0"> | |
| <title>Convite Exclusivo</title> | |
| <style> | |
| body { | |
| font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif; | |
| background-color: #f0f2f5; | |
| display: flex; | |
| flex-direction: column; | |
| align-items: center; | |
| justify-content: center; | |
| min-height: 100vh; | |
| margin: 0; | |
| padding: 20px; | |
| box-sizing: border-box; | |
| } | |
| .card { | |
| background: white; | |
| padding: 30px 20px; | |
| border-radius: 20px; | |
| box-shadow: 0 10px 25px rgba(0,0,0,0.1); | |
| max-width: 400px; | |
| width: 100%; | |
| text-align: center; | |
| transition: all 0.3s ease; | |
| } | |
| h1 { | |
| color: #222; | |
| font-size: 24px; | |
| margin-bottom: 10px; | |
| margin-top: 0; | |
| } | |
| .highlight-text { | |
| color: #555; | |
| font-size: 16px; | |
| line-height: 1.5; | |
| margin-bottom: 25px; | |
| } | |
| .paraiso { | |
| color: #0088cc; | |
| font-weight: bold; | |
| } | |
| .input-group { | |
| background: #f1f3f4; | |
| padding: 10px; | |
| border-radius: 12px; | |
| display: flex; | |
| align-items: center; | |
| margin-bottom: 20px; | |
| border: 1px solid #ddd; | |
| } | |
| .link-input { | |
| border: none; | |
| background: transparent; | |
| width: 100%; | |
| font-size: 14px; | |
| color: #333; | |
| outline: none; | |
| text-align: center; | |
| font-family: monospace; | |
| } | |
| .btn-copy { | |
| background-color: #222; /* Botão preto para destaque */ | |
| color: white; | |
| border: none; | |
| padding: 14px 0; | |
| width: 100%; | |
| border-radius: 50px; | |
| font-size: 16px; | |
| font-weight: bold; | |
| cursor: pointer; | |
| transition: transform 0.1s; | |
| box-shadow: 0 4px 10px rgba(0,0,0,0.2); | |
| } | |
| .btn-copy:active { | |
| transform: scale(0.98); | |
| } | |
| /* Área oculta inicialmente */ | |
| #hidden-area { | |
| display: none; /* Começa invisível */ | |
| margin-top: 25px; | |
| border-top: 1px solid #eee; | |
| padding-top: 20px; | |
| animation: fadeIn 0.5s ease; | |
| } | |
| .btn-telegram { | |
| background-color: #0088cc; /* Azul Telegram */ | |
| color: white; | |
| padding: 12px 30px; | |
| text-decoration: none; | |
| display: inline-block; | |
| font-size: 15px; | |
| border-radius: 50px; | |
| font-weight: bold; | |
| box-shadow: 0 4px 6px rgba(0,136,204,0.3); | |
| width: 80%; | |
| } | |
| @keyframes fadeIn { | |
| from { opacity: 0; transform: translateY(10px); } | |
| to { opacity: 1; transform: translateY(0); } | |
| } | |
| </style> | |
| <script> | |
| function copyLink() { | |
| // 1. Copia o link | |
| var copyText = document.getElementById("linkInvite"); | |
| copyText.select(); | |
| copyText.setSelectionRange(0, 99999); /* Mobile */ | |
| navigator.clipboard.writeText(copyText.value).then(function() { | |
| // 2. Feedback visual no botão | |
| var btn = document.getElementById("btnCopy"); | |
| btn.innerText = "LINK COPIADO! ✅"; | |
| btn.style.backgroundColor = "#28a745"; // Verde | |
| // 3. Mostra o botão de redirecionamento | |
| document.getElementById("hidden-area").style.display = "block"; | |
| }); | |
| } | |
| function forceRedirect() { | |
| // Tenta abrir direto | |
| window.location.href = "tg://join?invite=TWlRtRbUBds5YWQx"; | |
| // Fallback para web | |
| setTimeout(function() { | |
| window.location.href = "https://t.me/+TWlRtRbUBds5YWQx"; | |
| }, 2000); | |
| } | |
| </script> | |
| </head> | |
| <body> | |
| <div class="card"> | |
| <h1>🔒 Acesso Restrito</h1> | |
| <p class="highlight-text"> | |
| Copie o link abaixo e cole no seu navegador ou Telegram para <span class="paraiso">conhecer o paraíso 🔞</span> | |
| </p> | |
| <div class="input-group"> | |
| <input type="text" class="link-input" value="https://t.me/+TWlRtRbUBds5YWQx" id="linkInvite" readonly> | |
| </div> | |
| <button class="btn-copy" id="btnCopy" onclick="copyLink()">COPIAR LINK</button> | |
| <div id="hidden-area"> | |
| <p style="font-size: 13px; color: #888; margin-bottom: 15px;">Link copiado? Tente o atalho abaixo:</p> | |
| <a href="javascript:void(0)" onclick="forceRedirect()" class="btn-telegram">ENTRAR POR AQUI 🚀</a> | |
| </div> | |
| </div> | |
| </body> | |
| </html> |