39108-vm/app/public/tournaments.html
2026-03-11 07:15:45 +00:00

75 lines
7.3 KiB
HTML

<!DOCTYPE html>
<html lang="ar" dir="rtl">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>البطولات - GAMEHUS</title>
<link rel="icon" type="image/svg+xml" href="favicon.svg">
<script src="https://cdn.tailwindcss.com"></script>
<link href="https://cdn.jsdelivr.net/npm/@fortawesome/fontawesome-free@6.4.0/css/all.min.css" rel="stylesheet">
<link href="static/style.css" rel="stylesheet">
</head>
<body>
<nav class="nav-bar fixed top-0 left-0 right-0 z-50">
<div class="max-w-7xl mx-auto px-4 flex items-center justify-between h-16">
<div class="flex items-center gap-3">
<a href="index.html" class="flex items-center gap-2 no-underline"><div class="logo-icon">🎱</div><span class="logo-text">GAMEHUS</span></a>
<div class="hidden md:flex items-center gap-1 ml-6"><a href="index.html" class="nav-link">الرئيسية</a><a href="games.html" class="nav-link">الألعاب</a><a href="top.html" class="nav-link">المتصدرون</a><a href="chat.html" class="nav-link">الدردشة</a></div>
</div>
<div class="flex items-center gap-2"><div class="online-badge"><span class="online-dot"></span><span id="online-count">8,432</span> متصل</div><a href="login.html" class="btn-outline-sm">دخول</a><a href="register.html" class="btn-primary-sm">تسجيل</a><button class="md:hidden mobile-toggle p-2"><svg class="w-6 h-6" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4 6h16M4 12h16m-7 6h7"></path></svg></button></div>
</div>
</nav>
<div id="mobile-menu" class="mobile-menu"><a href="index.html" class="block nav-link">الرئيسية</a><a href="games.html" class="block nav-link">الألعاب</a><a href="top.html" class="block nav-link">المتصدرون</a><a href="chat.html" class="block nav-link">الدردشة</a></div>
<div style="padding-top:64px;">
<div class="max-w-6xl mx-auto px-4 py-12">
<div class="text-center mb-12">
<h1 style="font-size:2.5rem;font-weight:900;color:#fff;margin-bottom:8px;">🏆 البطولات والمسابقات</h1>
<p style="color:#6b7280;">انضم إلى البطولات ونافس على الجوائز</p>
</div>
<div class="grid grid-cols-3 gap-4 mb-12">
<div style="text-align:center;padding:20px;background:rgba(255,255,255,0.03);border:1px solid rgba(255,255,255,0.07);border-radius:12px;"><div style="font-size:1.8rem;">🏆</div><div style="font-size:1.6rem;font-weight:900;color:#ffd700;">4</div><div style="font-size:.8rem;color:#6b7280;">بطولات نشطة</div></div>
<div style="text-align:center;padding:20px;background:rgba(255,255,255,0.03);border:1px solid rgba(255,255,255,0.07);border-radius:12px;"><div style="font-size:1.8rem;">👥</div><div style="font-size:1.6rem;font-weight:900;color:#ffd700;">1,240</div><div style="font-size:.8rem;color:#6b7280;">مشارك هذا الشهر</div></div>
<div style="text-align:center;padding:20px;background:rgba(255,255,255,0.03);border:1px solid rgba(255,255,255,0.07);border-radius:12px;"><div style="font-size:1.8rem;">💰</div><div style="font-size:1.6rem;font-weight:900;color:#ffd700;">43,000</div><div style="font-size:.8rem;color:#6b7280;">إجمالي الجوائز</div></div>
</div>
<div id="tournaments-grid" class="grid grid-cols-1 md:grid-cols-2 gap-6"></div>
</div>
</div>
<footer class="footer mt-16">
<div class="max-w-7xl mx-auto px-4 py-12">
<div class="grid grid-cols-1 md:grid-cols-4 gap-8">
<div><div class="flex items-center gap-2 mb-4"><span class="text-2xl">🎱</span><span class="text-xl font-bold text-white">GAMEHUS</span></div><p class="text-gray-400 text-sm">العب بلياردو وشطرنج مجانًا مع لاعبين من حول العالم.</p></div>
<div><h4 class="text-white font-semibold mb-3">الألعاب</h4><ul class="space-y-2 text-sm text-gray-400"><li><a href="games.html">8-Ball Pool</a></li><li><a href="games.html">9-Ball Pool</a></li><li><a href="games.html">الشطرنج</a></li></ul></div>
<div><h4 class="text-white font-semibold mb-3">المجتمع</h4><ul class="space-y-2 text-sm text-gray-400"><li><a href="top.html">المتصدرون</a></li><li><a href="chat.html">الدردشة</a></li><li><a href="tournaments.html">البطولات</a></li></ul></div>
<div><h4 class="text-white font-semibold mb-3">الحساب</h4><ul class="space-y-2 text-sm text-gray-400"><li><a href="register.html">إنشاء حساب</a></li><li><a href="login.html">تسجيل الدخول</a></li><li><a href="profile.html">الملف الشخصي</a></li></ul></div>
</div>
<div class="border-t border-gray-800 mt-8 pt-6 text-center text-gray-500 text-sm">© 2026 GAMEHUS - جميع الحقوق محفوظة</div>
</div>
</footer>
<script>
const tournaments = [
{ name: "بطولة رمضان للبلياردو", game: "🎱 8-Ball", date: "15 مارس", prize: "10,000 نقطة", players: "64/128", status: "مفتوح للتسجيل", color: "#22c55e" },
{ name: "كأس الشطرنج الأسبوعي", game: "♟️ الشطرنج", date: "12 مارس", prize: "5,000 نقطة", players: "48/64", status: "جارٍ التسجيل", color: "#f59e0b" },
{ name: "بطولة 9-Ball الكبرى", game: "🎱 9-Ball", date: "20 مارس", prize: "8,000 نقطة", players: "32/64", status: "مفتوح للتسجيل", color: "#22c55e" },
{ name: "دوري الداما الشهري", game: "🔴 الداما", date: "18 مارس", prize: "3,000 نقطة", players: "16/32", status: "قريبًا", color: "#6b7280" }
];
document.getElementById("tournaments-grid").innerHTML = tournaments.map((t) => `
<div class="card p-6">
<div style="display:flex;align-items:flex-start;justify-content:space-between;margin-bottom:12px;">
<div><h3 style="font-weight:800;color:#fff;font-size:1.05rem;margin-bottom:4px;">${t.name}</h3><span style="font-size:.85rem;color:#9ca3af;">${t.game}</span></div>
<span style="font-size:.75rem;font-weight:700;padding:4px 12px;border-radius:20px;background:rgba(255,255,255,.06);color:${t.color};">${t.status}</span>
</div>
<div class="grid grid-cols-3 gap-3 mb-4">
<div style="text-align:center;padding:10px;background:rgba(255,215,0,.08);border-radius:8px;"><div style="font-size:.75rem;color:#6b7280;">الجائزة</div><div style="font-weight:700;color:#ffd700;font-size:.9rem;">🏆 ${t.prize}</div></div>
<div style="text-align:center;padding:10px;background:rgba(255,255,255,.03);border-radius:8px;"><div style="font-size:.75rem;color:#6b7280;">المشاركون</div><div style="font-weight:700;color:#e2e8f0;font-size:.9rem;">👥 ${t.players}</div></div>
<div style="text-align:center;padding:10px;background:rgba(255,255,255,.03);border-radius:8px;"><div style="font-size:.75rem;color:#6b7280;">التاريخ</div><div style="font-weight:700;color:#e2e8f0;font-size:.9rem;">📅 ${t.date}</div></div>
</div>
<a href="register.html" class="btn-primary" style="display:block;text-align:center;padding:10px;">✅ سجّل في البطولة</a>
</div>`).join("");
</script>
<script src="static/script.js"></script>
</body>
</html>