Spaces:
Running
Running
| <html lang="en" dir="rtl"> | |
| <head> | |
| <meta charset="UTF-8"> | |
| <meta name="viewport" content="width=device-width, initial-scale=1.0"> | |
| <title>Wasm</title> | |
| <script src="https://cdn.tailwindcss.com"></script> | |
| <script src="https://cdn.jsdelivr.net/npm/feather-icons/dist/feather.min.js"></script> | |
| <script src="https://unpkg.com/feather-icons"></script> | |
| <style> | |
| @import url('https://fonts.googleapis.com/css2?family=Tajawal:wght@400;500;700&display=swap'); | |
| body { | |
| font-family: 'Tajawal', sans-serif; | |
| } | |
| .light-mint { | |
| background-color: #d4f1e6; | |
| } | |
| .text-mint { | |
| color: #1abc9c; | |
| } | |
| </style> | |
| </head> | |
| <body class="light-mint min-h-screen flex flex-col"> | |
| <!-- Header --> | |
| <header class="bg-white shadow-sm py-4 px-6"> | |
| <div class="container mx-auto flex justify-between items-center"> | |
| <h1 class="text-2xl font-bold text-mint">Wasm</h1> | |
| <nav> | |
| <ul class="flex space-x-6 space-x-reverse"> | |
| <li><a href="#" class="hover:text-mint transition">الرئيسية</a></li> | |
| <li><a href="#" class="hover:text-mint transition">حول</a></li> | |
| <li><a href="#" class="hover:text-mint transition">اتصل بنا</a></li> | |
| </ul> | |
| </nav> | |
| </div> | |
| </header> | |
| <!-- Main Content --> | |
| <main class="flex-grow flex items-center justify-center"> | |
| <div class="text-center"> | |
| <i data-feather="cpu" class="w-16 h-16 mx-auto text-mint mb-4"></i> | |
| <h2 class="text-3xl font-bold text-gray-800 mb-2">مرحبًا بكم في Wasm</h2> | |
| <p class="text-gray-600 max-w-md mx-auto">موقع مخصص لتقنية WebAssembly</p> | |
| </div> | |
| </main> | |
| <!-- Footer --> | |
| <footer class="bg-white py-6 px-4 shadow-inner"> | |
| <div class="container mx-auto text-center"> | |
| <p class="text-gray-600">© 2023 Wasm. جميع الحقوق محفوظة.</p> | |
| <div class="flex justify-center space-x-4 space-x-reverse mt-3"> | |
| <a href="#" class="text-mint hover:opacity-80"><i data-feather="twitter"></i></a> | |
| <a href="#" class="text-mint hover:opacity-80"><i data-feather="github"></i></a> | |
| <a href="#" class="text-mint hover:opacity-80"><i data-feather="linkedin"></i></a> | |
| </div> | |
| </div> | |
| </footer> | |
| <script> | |
| feather.replace(); | |
| </script> | |
| </body> | |
| </html> | |