Initial SMM panel implementation

2026-08-13 19:05:47 +02:00
commit 7717a674c7
64 changed files with 8626 additions and 0 deletions
@@ -0,0 +1,104 @@
+<!doctype html>
+<html lang="ar" dir="rtl">
+  <head>
+    <meta charset="utf-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1">
+    <title>SMM Panel</title>
+    <link rel="stylesheet" href="/styles.css">
+  </head>
+  <body>
+    <div id="authScreen" class="auth-shell">
+      <section class="auth-panel">
+        <div class="brand-row">
+          <span class="brand-mark" aria-hidden="true"></span>
+          <div>
+            <h1>SMM Panel</h1>
+            <p>إدارة الطلبات والرصيد والخدمات</p>
+          </div>
+        </div>
+
+        <div class="auth-grid">
+          <form id="loginForm" class="surface form-stack">
+            <h2>تسجيل الدخول</h2>
+            <label>البريد الإلكتروني<input name="email" type="email" autocomplete="email" required></label>
+            <label>كلمة المرور<input name="password" type="password" autocomplete="current-password" required></label>
+            <button type="submit">دخول</button>
+          </form>
+
+          <form id="registerForm" class="surface form-stack">
+            <h2>حساب جديد</h2>
+            <label>اسم المستخدم<input name="username" autocomplete="username" required></label>
+            <label>البريد الإلكتروني<input name="email" type="email" autocomplete="email" required></label>
+            <label>كلمة المرور<input name="password" type="password" autocomplete="new-password" minlength="8" required></label>
+            <button type="submit">إنشاء الحساب</button>
+          </form>
+        </div>
+        <div id="authMessage" class="message hidden"></div>
+      </section>
+    </div>
+
+    <div id="appShell" class="app-shell hidden">
+      <aside class="sidebar">
+        <div class="brand-row compact">
+          <span class="brand-mark" aria-hidden="true"></span>
+          <strong>SMM Panel</strong>
+        </div>
+        <nav id="mainNav" class="nav-list"></nav>
+      </aside>
+
+      <main class="main">
+        <header class="topbar">
+          <div>
+            <p id="userLine" class="muted"></p>
+            <h1 id="viewTitle">لوحة المستخدم</h1>
+          </div>
+          <div class="top-actions">
+            <div class="balance-box">
+              <span>الرصيد</span>
+              <strong id="balanceValue">0.0000</strong>
+            </div>
+            <button id="menuButton" type="button" class="secondary icon-button mobile-only" aria-label="فتح القائمة">☰</button>
+            <div id="themePicker" class="theme-picker">
+              <button id="themeButton" type="button" class="theme-trigger" aria-expanded="false" aria-controls="themeMenu">
+                <svg viewBox="0 0 24 24" aria-hidden="true">
+                  <path d="M12 3.5a8.5 8.5 0 0 0 0 17h1.2a2.2 2.2 0 0 0 1.6-3.7 1.25 1.25 0 0 1 .9-2.1H17a4 4 0 0 0 4-4C21 6.7 17 3.5 12 3.5Z"></path>
+                  <circle cx="7.8" cy="11" r="1.2"></circle>
+                  <circle cx="10.8" cy="7.8" r="1.2"></circle>
+                  <circle cx="15" cy="8.2" r="1.2"></circle>
+                </svg>
+                <span>المظهر</span>
+              </button>
+              <div id="themeMenu" class="theme-menu" aria-hidden="true">
+                <div class="theme-menu-head">
+                  <strong>اختر اللون الأساسي</strong>
+                  <button id="themeClose" type="button" class="theme-close" aria-label="إغلاق">×</button>
+                </div>
+                <div class="theme-grid">
+                  <button type="button" class="color-option" data-color="#0f766e" style="--swatch-color:#0f766e" aria-label="تركواز"><span></span><small>تركواز</small></button>
+                  <button type="button" class="color-option" data-color="#2563eb" style="--swatch-color:#2563eb" aria-label="أزرق"><span></span><small>أزرق</small></button>
+                  <button type="button" class="color-option" data-color="#7c3aed" style="--swatch-color:#7c3aed" aria-label="بنفسجي"><span></span><small>بنفسجي</small></button>
+                  <button type="button" class="color-option" data-color="#16a34a" style="--swatch-color:#16a34a" aria-label="أخضر"><span></span><small>أخضر</small></button>
+                  <button type="button" class="color-option" data-color="#ea580c" style="--swatch-color:#ea580c" aria-label="برتقالي"><span></span><small>برتقالي</small></button>
+                  <button type="button" class="color-option" data-color="#db2777" style="--swatch-color:#db2777" aria-label="وردي"><span></span><small>وردي</small></button>
+                </div>
+                <div class="custom-color">
+                  <label>لون مخصص<input id="customColor" type="color" value="#0f766e"></label>
+                  <label>الكود<input id="customHex" dir="ltr" maxlength="7" value="#0f766e" spellcheck="false"></label>
+                  <span id="themePreview" class="theme-preview">معاينة</span>
+                </div>
+              </div>
+            </div>
+            <button id="refreshButton" type="button" class="secondary">تحديث</button>
+            <button id="logoutButton" type="button" class="danger">خروج</button>
+          </div>
+        </header>
+
+        <div id="message" class="message hidden"></div>
+        <section id="view" class="view"></section>
+      </main>
+      <button id="navBackdrop" type="button" class="nav-backdrop hidden" aria-label="إغلاق القائمة"></button>
+    </div>
+
+    <script src="/app.js"></script>
+  </body>
+</html>