Spaces:
Running
Running
| <html lang="ar" dir="rtl"> | |
| <head> | |
| <meta charset="UTF-8"> | |
| <meta name="viewport" content="width=device-width, initial-scale=1.0"> | |
| <title>سبع أسطر</title> | |
| <style> | |
| *{margin:0;padding:0;box-sizing:border-box;font-family:'Segoe UI',sans-serif} | |
| body{min-height:100vh;display:grid;place-items:center;background:linear-gradient(135deg,#1a1a2e 0%,#16213e 50%,#0f3460 100%);color:#eaeaea} | |
| .card{background:rgba(255,255,255,0.05);backdrop-filter:blur(10px);padding:3rem;border-radius:20px;border:1px solid rgba(255,255,255,0.1);text-align:center;max-width:400px} | |
| h1{font-size:2.5rem;margin-bottom:1rem;background:linear-gradient(90deg,#e94560,#ff6b6b);-webkit-background-clip:text;-webkit-text-fill-color:transparent} | |
| p{color:#a0a0a0;line-height:1.8;font-size:1.1rem} | |
| .counter{font-size:4rem;font-weight:700;color:#e94560;margin:1rem 0;text-shadow:0 0 30px rgba(233,69,96,0.5)} | |
| button{background:linear-gradient(90deg,#e94560,#ff6b6b);border:none;padding:1rem 2.5rem;color:white;font-size:1.1rem;border-radius:50px;cursor:pointer;transition:all 0.3s} | |
| button:hover{transform:translateY(-3px);box-shadow:0 10px 30px rgba(233,69,96,0.4)} | |
| .built-with{position:fixed;top:1rem;left:1rem;font-size:0.75rem;opacity:0.6} | |
| .built-with a{color:#e94560;text-decoration:none} | |
| </style> | |
| </head> | |
| <body> | |
| <div class="card"> | |
| <h1>سبع أسطر فقط!</h1> | |
| <p>هذا التطبيق بسيط وجميل، مبني بـ 7 أسطر من JavaScript</p> | |
| <div class="counter" id="count">0</div> | |
| <button onclick="increment()">اضغط هنا!</button> | |
| </div> | |
| <div class="built-with">Built with <a href="https://huggingface.co/spaces/akhaliq/anycoder" target="_blank">anycoder</a></div> | |
| <script> | |
| let c=0;const increment=()=>{c++;document.getElementById('count').textContent=c;const b=document.querySelector('button');b.style.transform='scale(0.95)';setTimeout(()=>b.style.transform='scale(1)',100)} | |
| </script> | |
| </body> | |
| </html> |