Skip to content

C
Clubphp
Commit ff106889 authored by Mahmoud Aglan's avatar Mahmoud Aglan
Browse files
Options

design(proposal): replace all emoji with an inline SVG icon set 

Emoji render as platform-specific colour cartoons (Apple/Windows/Android
each differ) which reads informal in a document going to a club board, and
they cannot inherit brand colour. Replaced every one with a 33-symbol
inline SVG sprite: 24x24, stroke-based, currentColor, sized in em so each
existing icon slot keeps its own scale.

Removed: swimmer, bell, receipt, credit card, mobile, bank, football,
martial-arts, tennis, cartwheel, page, lock, floppy, plug, envelope, gear,
up/down arrows, and the EG regional-indicator flag pair.

Also converted the geometric glyphs sitting in icon slots (fisheye,
diamonds, house, quadrant-circle, square-fill, clock) plus the list
check/x/arrow marks, so the icon layer is uniformly SVG rather than a mix
of text glyphs and emoji. A source scan for emoji ranges now returns clean.

Sprite is hidden with position/width/height rather than display:none,
which can break <use> resolution in some engines.

Fixes an unrelated pre-existing contrast bug found while verifying: .card
h4 is declared after .dark h4 at equal specificity, so the three cards in
the dark flow section rendered navy-on-navy. Added .dark .card h4.
Co-Authored-By: 's avatarClaude Opus 5 (1M context) <noreply@anthropic.com>
parent 783a14e6
Hide whitespace changes
Inline Side-by-side
Showing with 164 additions and 105 deletions
Proposal/sayd-mobile/css/styles.css
View file @ ff106889
......@@ -629,3 +629,26 @@ footer > *{ position:relative; z-index:1; }
@media (prefers-reduced-motion:reduce){
.reveal{ opacity:1; transform:none; transition:none; }
}
/* ================= ICONS =================
Inline SVG sprite replaces emoji: emoji render differently per platform
(and as full-colour cartoons on some), which reads informal in a board
document. Icons inherit colour via currentColor and scale from the
container's font-size, so every existing icon slot keeps its own sizing. */
.ico-sprite{ position:absolute; width:0; height:0; overflow:hidden; }
.ico{
width:1em; height:1em; display:inline-block; vertical-align:-.14em;
fill:none; stroke:currentColor; stroke-width:1.7;
stroke-linecap:round; stroke-linejoin:round; flex-shrink:0;
}
.card-ico .ico{ width:1.35em; height:1.35em; }
.sport-ico .ico{ width:1.15em; height:1.15em; }
.drop .ic .ico{ width:1em; height:1em; stroke-width:1.4; }
.dl .ico{ width:1.25em; height:1.25em; }
.tab i, .side .si i{ display:inline-flex; align-items:center; }
.tick .ico{ width:12px; height:12px; stroke-width:2.6; }
.steps .b .ico{ width:11px; height:11px; stroke-width:2.8; }
/* .card h4 is declared after .dark h4 at equal specificity, so cards placed
inside a .dark section inherited navy-on-navy headings. Raise specificity. */
.dark .card h4{ color:#fff; }
Proposal/sayd-mobile/index.html
View file @ ff106889
......@@ -14,6 +14,42 @@
</head>
<body>
<!-- Inline icon sprite: replaces emoji, which render inconsistently across
platforms and read informal in a board document. currentColor + em sizing
so each icon inherits its container colour and scale. -->
<svg class="ico-sprite" aria-hidden="true" focusable="false"><defs>
<symbol id="i-members" viewBox="0 0 24 24"><circle cx="9.2" cy="8" r="3.2"/><path d="M3.2 20c0-3.3 2.7-5.2 6-5.2s6 1.9 6 5.2"/><path d="M16.2 5.3a3.2 3.2 0 0 1 0 5.9"/><path d="M18.2 14.4c1.9.6 2.9 2.1 2.9 4.2"/></symbol>
<symbol id="i-activity" viewBox="0 0 24 24"><path d="M4 9v6M7.2 6.8v10.4M16.8 6.8v10.4M20 9v6M7.2 12h9.6"/></symbol>
<symbol id="i-gate" viewBox="0 0 24 24"><rect x="3.5" y="3.5" width="7" height="7" rx="1.3"/><rect x="13.5" y="3.5" width="7" height="7" rx="1.3"/><rect x="3.5" y="13.5" width="7" height="7" rx="1.3"/><path d="M13.5 14.2h3v3h-3zM19.4 14.2h1.1M13.5 20.4h3M19.6 18.6v1.8"/></symbol>
<symbol id="i-bell" viewBox="0 0 24 24"><path d="M6.2 9.4a5.8 5.8 0 0 1 11.6 0c0 3.9 1.5 5.4 1.5 5.4H4.7s1.5-1.5 1.5-5.4Z"/><path d="M10 18.1a2.2 2.2 0 0 0 4 0"/></symbol>
<symbol id="i-mail" viewBox="0 0 24 24"><rect x="2.8" y="5.4" width="18.4" height="13.2" rx="2.2"/><path d="m3.8 7.1 7.3 5.3a1.6 1.6 0 0 0 1.8 0l7.3-5.3"/></symbol>
<symbol id="i-receipt" viewBox="0 0 24 24"><path d="M6 3.6h12v16.8l-2.4-1.6-2.4 1.6-2.4-1.6-2.4 1.6Z"/><path d="M9.4 8.6h5.2M9.4 12.6h5.2"/></symbol>
<symbol id="i-home" viewBox="0 0 24 24"><path d="M3.8 10.4 12 3.8l8.2 6.6"/><path d="M6 9.6V20.2h12V9.6"/><path d="M9.9 20.2v-5h4.2v5"/></symbol>
<symbol id="i-user" viewBox="0 0 24 24"><circle cx="12" cy="8" r="3.6"/><path d="M4.6 20.2c0-3.9 3.4-6 7.4-6s7.4 2.1 7.4 6"/></symbol>
<symbol id="i-card" viewBox="0 0 24 24"><rect x="2.6" y="5" width="18.8" height="14" rx="2.4"/><path d="M2.6 9.8h18.8"/><path d="M6.2 14.6h3.6"/></symbol>
<symbol id="i-wallet" viewBox="0 0 24 24"><rect x="6.6" y="2.6" width="10.8" height="18.8" rx="2.4"/><path d="M10.6 5.7h2.8M11 18.4h2"/></symbol>
<symbol id="i-bank" viewBox="0 0 24 24"><path d="M3.6 9.6 12 4.2l8.4 5.4"/><path d="M5.8 10.8v6.8M10 10.8v6.8M14 10.8v6.8M18.2 10.8v6.8"/><path d="M3.6 20.2h16.8"/></symbol>
<symbol id="i-swim" viewBox="0 0 24 24"><circle cx="15.6" cy="6.4" r="2"/><path d="M4.6 13.2 9.2 10l4 3.1"/><path d="M2.6 17.9c1.7 0 1.7 1.5 3.5 1.5s1.7-1.5 3.5-1.5 1.7 1.5 3.5 1.5 1.7-1.5 3.5-1.5 1.7 1.5 3.4 1.5"/></symbol>
<symbol id="i-football" viewBox="0 0 24 24"><circle cx="12" cy="12" r="8.4"/><path d="m12 7.6 3.5 2.5-1.3 4.1H9.8l-1.3-4.1Z"/><path d="M12 3.6v4M19.6 9.7l-3.8.4M17 18.9l-2.8-4.7M7 18.9l2.8-4.7M4.4 9.7l3.8.4"/></symbol>
<symbol id="i-karate" viewBox="0 0 24 24"><path d="M3.2 9.4h17.6v4H3.2z"/><path d="m10 13.6-1.4 6.2 3.4-2.2 3.4 2.2-1.4-6.2"/></symbol>
<symbol id="i-tennis" viewBox="0 0 24 24"><circle cx="12" cy="12" r="8.4"/><path d="M6.1 5.6c2.5 2 3.8 4.6 3.8 7.9 0 1.6-.3 3.2-1 4.7"/><path d="M17.9 5.6c-2.5 2-3.8 4.6-3.8 7.9 0 1.6.3 3.2 1 4.7"/></symbol>
<symbol id="i-gym" viewBox="0 0 24 24"><circle cx="12" cy="4.8" r="2.1"/><path d="M12 7.3v6.3"/><path d="m6.6 9.6 5.4 1.6 5.4-1.6"/><path d="m9.1 20.4 2.9-6.8 2.9 6.8"/></symbol>
<symbol id="i-dashboard" viewBox="0 0 24 24"><rect x="3.2" y="3.5" width="7.4" height="7" rx="1.4"/><rect x="13.4" y="3.5" width="7.4" height="4" rx="1.4"/><rect x="13.4" y="10.4" width="7.4" height="10.1" rx="1.4"/><rect x="3.2" y="13.5" width="7.4" height="7" rx="1.4"/></symbol>
<symbol id="i-upload" viewBox="0 0 24 24"><path d="M12 16.2V4.4"/><path d="m7.6 8.8 4.4-4.4 4.4 4.4"/><path d="M4.6 15v3.4a2 2 0 0 0 2 2h10.8a2 2 0 0 0 2-2V15"/></symbol>
<symbol id="i-download" viewBox="0 0 24 24"><path d="M12 4.4v11.8"/><path d="m7.6 11.8 4.4 4.4 4.4-4.4"/><path d="M4.6 15v3.4a2 2 0 0 0 2 2h10.8a2 2 0 0 0 2-2V15"/></symbol>
<symbol id="i-clock" viewBox="0 0 24 24"><circle cx="12" cy="12" r="8.4"/><path d="M12 6.9v5.4l3.4 2"/></symbol>
<symbol id="i-settings" viewBox="0 0 24 24"><path d="M3.6 7.4h9.6M18.4 7.4h2M3.6 16.6h2M10.8 16.6h9.6"/><circle cx="15.6" cy="7.4" r="2.2"/><circle cx="8" cy="16.6" r="2.2"/></symbol>
<symbol id="i-file" viewBox="0 0 24 24"><path d="M13.6 3.6H7a2 2 0 0 0-2 2v12.8a2 2 0 0 0 2 2h10a2 2 0 0 0 2-2V9Z"/><path d="M13.6 3.6V9H19"/></symbol>
<symbol id="i-shield" viewBox="0 0 24 24"><path d="M12 3.4 5.2 6v5.4c0 4.2 2.9 7.5 6.8 9.2 3.9-1.7 6.8-5 6.8-9.2V6Z"/><path d="m9.3 12.1 1.9 1.9 3.5-3.9"/></symbol>
<symbol id="i-database" viewBox="0 0 24 24"><ellipse cx="12" cy="6.2" rx="7.4" ry="2.9"/><path d="M4.6 6.2v11.6c0 1.6 3.3 2.9 7.4 2.9s7.4-1.3 7.4-2.9V6.2"/><path d="M4.6 12c0 1.6 3.3 2.9 7.4 2.9s7.4-1.3 7.4-2.9"/></symbol>
<symbol id="i-plug" viewBox="0 0 24 24"><path d="M9 3.6v5M15 3.6v5"/><path d="M6.6 8.6h10.8v2.9a5.4 5.4 0 0 1-10.8 0Z"/><path d="M12 16.9v3.5"/></symbol>
<symbol id="i-refresh" viewBox="0 0 24 24"><path d="M20.1 12a8.1 8.1 0 1 1-2.6-6"/><path d="M20.3 4.3v4.4h-4.4"/></symbol>
<symbol id="i-plus" viewBox="0 0 24 24"><circle cx="12" cy="12" r="8.4"/><path d="M12 8.3v7.4M8.3 12h7.4"/></symbol>
<symbol id="i-layers" viewBox="0 0 24 24"><path d="m12 3.4 8.4 4.3L12 12 3.6 7.7Z"/><path d="m3.6 12 8.4 4.3L20.4 12"/><path d="m3.6 16.3 8.4 4.3 8.4-4.3"/></symbol>
<symbol id="i-note" viewBox="0 0 24 24"><path d="m12 3.6 2.6 5.8 5.8 2.6-5.8 2.6L12 20.4l-2.6-5.8L3.6 12l5.8-2.6Z"/></symbol>
<symbol id="i-flag-eg" viewBox="0 0 24 24"><rect x="2.5" y="6.5" width="19" height="3.7" fill="#CE1126" stroke="none"/><rect x="2.5" y="10.2" width="19" height="3.6" fill="#F5F5F5" stroke="none"/><rect x="2.5" y="13.8" width="19" height="3.7" fill="#0B0B0B" stroke="none"/><rect x="2.5" y="6.5" width="19" height="11" rx="1.4" fill="none" stroke="currentColor" stroke-opacity=".45" stroke-width="1"/></symbol>
<symbol id="i-check" viewBox="0 0 24 24"><path d="m5 12.5 4.6 4.5L19 7.5"/></symbol><symbol id="i-x" viewBox="0 0 24 24"><path d="M6.5 6.5l11 11M17.5 6.5l-11 11"/></symbol><symbol id="i-arrow" viewBox="0 0 24 24"><path d="M19 12H5"/><path d="m11 6-6 6 6 6"/></symbol></defs></svg>
<!-- ============ NAV ============ -->
<nav class="nav" id="nav">
<div class="nav-in">
......@@ -132,7 +168,7 @@
<div class="grid g3 reveal" style="margin-top:36px;">
<div class="card">
<div class="card-ico">◉</div>
<div class="card-ico"><svg class="ico"><use href="#i-members"/></svg></div>
<h4>١ &mdash; العضوية والاشتراكات</h4>
<p>
تجديد العضوية السنوي وأقساطه. يرى العضو رصيده ومستحقاته شهرًا بشهر،
......@@ -140,7 +176,7 @@
</p>
</div>
<div class="card">
<div class="card-ico mint">◈</div>
<div class="card-ico mint"><svg class="ico"><use href="#i-activity"/></svg></div>
<h4>٢ &mdash; الأنشطة الرياضية</h4>
<p>
كتالوج معلن بأسعار كل نشاط، اشتراك مباشر من التطبيق، فاتورة شهرية،
......@@ -148,7 +184,7 @@
</p>
</div>
<div class="card">
<div class="card-ico sky">▣</div>
<div class="card-ico sky"><svg class="ico"><use href="#i-gate"/></svg></div>
<h4>٣ &mdash; البوابة والدعوات</h4>
<p>
كود QR شخصي متجدد لدخول العضو، رصيد دعوات شهري حسب نوع العضوية،
......@@ -161,38 +197,38 @@
<div>
<h3 style="color:var(--navy); font-size:1.1rem; margin-bottom:12px;">داخل نطاق المرحلة الأولى</h3>
<ul class="scope-list">
<li><span class="tick">✓</span><span>تطبيق موبايل أصلي للأعضاء &mdash; iOS و Android، عربي بالكامل RTL</span></li>
<li><span class="tick">✓</span><span>دخول برقم الموبايل + كود تحقق OTP (بدون كلمات مرور)</span></li>
<li><span class="tick">✓</span><span>بطاقة عضوية رقمية وحالة سريان الاشتراك</span></li>
<li><span class="tick">✓</span><span>كشف المستحقات: تجديد سنوي، أقساط، غرامات، فواتير أنشطة</span></li>
<li><span class="tick">✓</span><span>سداد إلكتروني بالبطاقة والمحافظ الإلكترونية + إيصال فوري</span></li>
<li><span class="tick">✓</span><span>كتالوج الأنشطة الرياضية بالأسعار والفئات السنية والسعة</span></li>
<li><span class="tick">✓</span><span>الاشتراك في نشاط وربطه بأحد الأبناء</span></li>
<li><span class="tick">✓</span><span>جدول التدريب الأسبوعي لكل مشترك</span></li>
<li><span class="tick">✓</span><span>QR دخول متجدد + شاشة مسح على البوابة</span></li>
<li><span class="tick">✓</span><span>رصيد الدعوات، إصدار دعوة، وشراء دعوات إضافية</span></li>
<li><span class="tick">✓</span><span>إشعارات تذكير بالاستحقاق قبل موعده وبعده</span></li>
<li><span class="tick">✓</span><span>بوابة إدارة ويب: رفع البيانات، الأعضاء، المستحقات، التسعير، التقارير</span></li>
<li><span class="tick">✓</span><span>ستة قوالب Excel/CSV جاهزة لرفع كل بيانات النادي</span></li>
<li><span class="tick">✓</span><span>النشر على App Store و Google Play باسم النادي</span></li>
<li><span class="tick"><svg class="ico"><use href="#i-check"/></svg></span><span>تطبيق موبايل أصلي للأعضاء &mdash; iOS و Android، عربي بالكامل RTL</span></li>
<li><span class="tick"><svg class="ico"><use href="#i-check"/></svg></span><span>دخول برقم الموبايل + كود تحقق OTP (بدون كلمات مرور)</span></li>
<li><span class="tick"><svg class="ico"><use href="#i-check"/></svg></span><span>بطاقة عضوية رقمية وحالة سريان الاشتراك</span></li>
<li><span class="tick"><svg class="ico"><use href="#i-check"/></svg></span><span>كشف المستحقات: تجديد سنوي، أقساط، غرامات، فواتير أنشطة</span></li>
<li><span class="tick"><svg class="ico"><use href="#i-check"/></svg></span><span>سداد إلكتروني بالبطاقة والمحافظ الإلكترونية + إيصال فوري</span></li>
<li><span class="tick"><svg class="ico"><use href="#i-check"/></svg></span><span>كتالوج الأنشطة الرياضية بالأسعار والفئات السنية والسعة</span></li>
<li><span class="tick"><svg class="ico"><use href="#i-check"/></svg></span><span>الاشتراك في نشاط وربطه بأحد الأبناء</span></li>
<li><span class="tick"><svg class="ico"><use href="#i-check"/></svg></span><span>جدول التدريب الأسبوعي لكل مشترك</span></li>
<li><span class="tick"><svg class="ico"><use href="#i-check"/></svg></span><span>QR دخول متجدد + شاشة مسح على البوابة</span></li>
<li><span class="tick"><svg class="ico"><use href="#i-check"/></svg></span><span>رصيد الدعوات، إصدار دعوة، وشراء دعوات إضافية</span></li>
<li><span class="tick"><svg class="ico"><use href="#i-check"/></svg></span><span>إشعارات تذكير بالاستحقاق قبل موعده وبعده</span></li>
<li><span class="tick"><svg class="ico"><use href="#i-check"/></svg></span><span>بوابة إدارة ويب: رفع البيانات، الأعضاء، المستحقات، التسعير، التقارير</span></li>
<li><span class="tick"><svg class="ico"><use href="#i-check"/></svg></span><span>ستة قوالب Excel/CSV جاهزة لرفع كل بيانات النادي</span></li>
<li><span class="tick"><svg class="ico"><use href="#i-check"/></svg></span><span>النشر على App Store و Google Play باسم النادي</span></li>
</ul>
</div>
<div>
<h3 style="color:var(--txt-3); font-size:1.1rem; margin-bottom:12px;">خارج النطاق &mdash; مؤجَّل للمرحلة الثانية</h3>
<ul class="scope-list">
<li><span class="tick later">→</span><span>حجز الملاعب والكورتات وحمامات السباحة</span></li>
<li><span class="tick later">→</span><span>محفظة إلكترونية ورصيد داخلي</span></li>
<li><span class="tick later">→</span><span>المطاعم والكافيتريات والطلب من التطبيق</span></li>
<li><span class="tick later">→</span><span>القرى والشاليهات والحجوزات الموسمية</span></li>
<li><span class="tick later">→</span><span>الشكاوى والطلبات والدعم الفني</span></li>
<li><span class="tick later">→</span><span>الأخبار والفعاليات والبطولات</span></li>
<li><span class="tick later">→</span><span>العيادة الطبية والكشف الرياضي</span></li>
<li><span class="tick later">→</span><span>الإنجازات وتقييم اللاعبين</span></li>
<li><span class="tick no">✕</span><span>نظام ERP محاسبي كامل (دفتر عام وميزانيات وأصول)</span></li>
<li><span class="tick no">✕</span><span>الموارد البشرية والرواتب والحضور</span></li>
<li><span class="tick no">✕</span><span>المخازن والمشتريات وأذون الاستلام</span></li>
<li><span class="tick no">✕</span><span>نقاط البيع داخل النادي</span></li>
<li><span class="tick no">✕</span><span>إدارة الموظفين والصلاحيات المعقدة</span></li>
<li><span class="tick later"><svg class="ico"><use href="#i-arrow"/></svg></span><span>حجز الملاعب والكورتات وحمامات السباحة</span></li>
<li><span class="tick later"><svg class="ico"><use href="#i-arrow"/></svg></span><span>محفظة إلكترونية ورصيد داخلي</span></li>
<li><span class="tick later"><svg class="ico"><use href="#i-arrow"/></svg></span><span>المطاعم والكافيتريات والطلب من التطبيق</span></li>
<li><span class="tick later"><svg class="ico"><use href="#i-arrow"/></svg></span><span>القرى والشاليهات والحجوزات الموسمية</span></li>
<li><span class="tick later"><svg class="ico"><use href="#i-arrow"/></svg></span><span>الشكاوى والطلبات والدعم الفني</span></li>
<li><span class="tick later"><svg class="ico"><use href="#i-arrow"/></svg></span><span>الأخبار والفعاليات والبطولات</span></li>
<li><span class="tick later"><svg class="ico"><use href="#i-arrow"/></svg></span><span>العيادة الطبية والكشف الرياضي</span></li>
<li><span class="tick later"><svg class="ico"><use href="#i-arrow"/></svg></span><span>الإنجازات وتقييم اللاعبين</span></li>
<li><span class="tick no"><svg class="ico"><use href="#i-x"/></svg></span><span>نظام ERP محاسبي كامل (دفتر عام وميزانيات وأصول)</span></li>
<li><span class="tick no"><svg class="ico"><use href="#i-x"/></svg></span><span>الموارد البشرية والرواتب والحضور</span></li>
<li><span class="tick no"><svg class="ico"><use href="#i-x"/></svg></span><span>المخازن والمشتريات وأذون الاستلام</span></li>
<li><span class="tick no"><svg class="ico"><use href="#i-x"/></svg></span><span>نقاط البيع داخل النادي</span></li>
<li><span class="tick no"><svg class="ico"><use href="#i-x"/></svg></span><span>إدارة الموظفين والصلاحيات المعقدة</span></li>
</ul>
</div>
</div>
......@@ -242,7 +278,7 @@
أدخل رقم الموبايل المسجَّل في بيانات عضويتك<br>وسيصلك كود تحقق برسالة قصيرة
</p>
<div style="width:100%;background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.15);border-radius:14px;padding:13px 16px;margin:24px 0 6px;display:flex;align-items:center;gap:10px;direction:ltr;">
<span style="font-size:.86rem;color:#C7D8EE;">🇪🇬 +20</span>
<span style="font-size:.86rem;color:#C7D8EE;display:inline-flex;align-items:center;gap:6px;"><svg class="ico"><use href="#i-flag-eg"/></svg> +20</span>
<span style="width:1px;height:20px;background:rgba(255,255,255,.18);"></span>
<span style="font-size:.95rem;font-weight:700;letter-spacing:.06em;">100 123 4567</span>
</div>
......@@ -269,7 +305,7 @@
<div class="sm">صباح الخير</div>
<h3>محمد أحمد سيد</h3>
</div>
<div style="position:relative;font-size:1.2rem;">🔔<span style="position:absolute;top:-2px;right:-4px;width:8px;height:8px;background:var(--rose);border-radius:50%;"></span></div>
<div style="position:relative;font-size:1.2rem;"><svg class="ico"><use href="#i-bell"/></svg><span style="position:absolute;top:-2px;right:-4px;width:8px;height:8px;background:var(--rose);border-radius:50%;"></span></div>
</div>
</div>
......@@ -295,16 +331,16 @@
<div style="display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin:0 16px 14px;">
<div style="background:#fff;border:1px solid var(--line);border-radius:13px;padding:12px 4px;text-align:center;">
<div style="font-size:1.2rem;">▣</div><div style="font-size:.62rem;font-weight:700;color:var(--txt-2);margin-top:4px;">كود الدخول</div>
<div style="font-size:1.2rem;"><svg class="ico"><use href="#i-gate"/></svg></div><div style="font-size:.62rem;font-weight:700;color:var(--txt-2);margin-top:4px;">كود الدخول</div>
</div>
<div style="background:#fff;border:1px solid var(--line);border-radius:13px;padding:12px 4px;text-align:center;">
<div style="font-size:1.2rem;">✉</div><div style="font-size:.62rem;font-weight:700;color:var(--txt-2);margin-top:4px;">الدعوات</div>
<div style="font-size:1.2rem;"><svg class="ico"><use href="#i-mail"/></svg></div><div style="font-size:.62rem;font-weight:700;color:var(--txt-2);margin-top:4px;">الدعوات</div>
</div>
<div style="background:#fff;border:1px solid var(--line);border-radius:13px;padding:12px 4px;text-align:center;">
<div style="font-size:1.2rem;">◈</div><div style="font-size:.62rem;font-weight:700;color:var(--txt-2);margin-top:4px;">الأنشطة</div>
<div style="font-size:1.2rem;"><svg class="ico"><use href="#i-activity"/></svg></div><div style="font-size:.62rem;font-weight:700;color:var(--txt-2);margin-top:4px;">الأنشطة</div>
</div>
<div style="background:#fff;border:1px solid var(--line);border-radius:13px;padding:12px 4px;text-align:center;">
<div style="font-size:1.2rem;">🧾</div><div style="font-size:.62rem;font-weight:700;color:var(--txt-2);margin-top:4px;">الإيصالات</div>
<div style="font-size:1.2rem;"><svg class="ico"><use href="#i-receipt"/></svg></div><div style="font-size:.62rem;font-weight:700;color:var(--txt-2);margin-top:4px;">الإيصالات</div>
</div>
</div>
......@@ -325,10 +361,10 @@
</div>
</div>
<div class="tabbar">
<div class="tab on"><i>⌂</i>الرئيسية</div>
<div class="tab"><i>◈</i>الأنشطة</div>
<div class="tab"><i>▣</i>الدخول</div>
<div class="tab"><i>◔</i>حسابي</div>
<div class="tab on"><i><svg class="ico"><use href="#i-home"/></svg></i>الرئيسية</div>
<div class="tab"><i><svg class="ico"><use href="#i-activity"/></svg></i>الأنشطة</div>
<div class="tab"><i><svg class="ico"><use href="#i-gate"/></svg></i>الدخول</div>
<div class="tab"><i><svg class="ico"><use href="#i-user"/></svg></i>حسابي</div>
</div>
</div>
......@@ -374,8 +410,8 @@
</div>
</div>
<div class="tabbar">
<div class="tab on"><i>⌂</i>الرئيسية</div><div class="tab"><i>◈</i>الأنشطة</div>
<div class="tab"><i>▣</i>الدخول</div><div class="tab"><i>◔</i>حسابي</div>
<div class="tab on"><i><svg class="ico"><use href="#i-home"/></svg></i>الرئيسية</div><div class="tab"><i><svg class="ico"><use href="#i-activity"/></svg></i>الأنشطة</div>
<div class="tab"><i><svg class="ico"><use href="#i-gate"/></svg></i>الدخول</div><div class="tab"><i><svg class="ico"><use href="#i-user"/></svg></i>حسابي</div>
</div>
</div>
......@@ -400,21 +436,21 @@
<div style="margin:0 16px 10px;font-size:.78rem;font-weight:700;color:var(--txt-2);">اختر وسيلة الدفع</div>
<div class="mcard" style="border:1.5px solid var(--gold);display:flex;align-items:center;gap:12px;">
<div class="sport-ico" style="background:var(--gold-dim);">💳</div>
<div class="sport-ico" style="background:var(--gold-dim);"><svg class="ico"><use href="#i-card"/></svg></div>
<div><div style="font-weight:700;font-size:.85rem;">بطاقة بنكية</div><div style="font-size:.7rem;color:var(--txt-3);">Visa &bull; Mastercard &bull; Meeza</div></div>
<div style="margin-inline-start:auto;width:20px;height:20px;border-radius:50%;background:var(--gold);color:#fff;display:grid;place-items:center;font-size:.65rem;">✓</div>
<div style="margin-inline-start:auto;width:20px;height:20px;border-radius:50%;background:var(--gold);color:#fff;display:grid;place-items:center;font-size:.65rem;"><svg class="ico" style="width:11px;height:11px;stroke-width:2.8"><use href="#i-check"/></svg></div>
</div>
<div class="mcard" style="display:flex;align-items:center;gap:12px;">
<div class="sport-ico">📱</div>
<div class="sport-ico"><svg class="ico"><use href="#i-wallet"/></svg></div>
<div><div style="font-weight:700;font-size:.85rem;">محفظة إلكترونية</div><div style="font-size:.7rem;color:var(--txt-3);">فودافون كاش &bull; إنستاباي</div></div>
</div>
<div class="mcard" style="display:flex;align-items:center;gap:12px;">
<div class="sport-ico">🏛</div>
<div class="sport-ico"><svg class="ico"><use href="#i-bank"/></svg></div>
<div><div style="font-weight:700;font-size:.85rem;">الدفع في خزنة النادي</div><div style="font-size:.7rem;color:var(--txt-3);">يصدر كود سداد يقدَّم للخزنة</div></div>
</div>
<div style="margin:14px 16px 0;background:var(--mint-dim);border-radius:12px;padding:12px 14px;font-size:.73rem;color:#0E8C60;line-height:1.75;">
✓ بمجرد نجاح العملية يُحدَّث رصيدك فورًا، ويصلك إيصال إلكتروني، ويُسجَّل التحصيل في تقرير الخزنة.
<svg class="ico"><use href="#i-check"/></svg> بمجرد نجاح العملية يُحدَّث رصيدك فورًا، ويصلك إيصال إلكتروني، ويُسجَّل التحصيل في تقرير الخزنة.
</div>
<div style="margin:16px;"><div class="mbtn">ادفع <span class="num">2,750</span> ج.م</div></div>
......@@ -455,10 +491,10 @@
</div>
</div>
<div class="tabbar" style="background:#0A1A33;border-top-color:rgba(255,255,255,.1);">
<div class="tab" style="color:#6F87A8;"><i>⌂</i>الرئيسية</div>
<div class="tab" style="color:#6F87A8;"><i>◈</i>الأنشطة</div>
<div class="tab on" style="color:var(--gold-2);"><i>▣</i>الدخول</div>
<div class="tab" style="color:#6F87A8;"><i>◔</i>حسابي</div>
<div class="tab" style="color:#6F87A8;"><i><svg class="ico"><use href="#i-home"/></svg></i>الرئيسية</div>
<div class="tab" style="color:#6F87A8;"><i><svg class="ico"><use href="#i-activity"/></svg></i>الأنشطة</div>
<div class="tab on" style="color:var(--gold-2);"><i><svg class="ico"><use href="#i-gate"/></svg></i>الدخول</div>
<div class="tab" style="color:#6F87A8;"><i><svg class="ico"><use href="#i-user"/></svg></i>حسابي</div>
</div>
</div>
......@@ -504,8 +540,8 @@
</div>
</div>
<div class="tabbar">
<div class="tab"><i>⌂</i>الرئيسية</div><div class="tab"><i>◈</i>الأنشطة</div>
<div class="tab on"><i>▣</i>الدخول</div><div class="tab"><i>◔</i>حسابي</div>
<div class="tab"><i><svg class="ico"><use href="#i-home"/></svg></i>الرئيسية</div><div class="tab"><i><svg class="ico"><use href="#i-activity"/></svg></i>الأنشطة</div>
<div class="tab on"><i><svg class="ico"><use href="#i-gate"/></svg></i>الدخول</div><div class="tab"><i><svg class="ico"><use href="#i-user"/></svg></i>حسابي</div>
</div>
</div>
......@@ -520,32 +556,32 @@
<div class="seg"><button class="on">الكل</button><button>سباحة</button><button>كرة</button><button>فردي</button></div>
<div class="sport-item">
<div class="sport-ico" style="background:rgba(62,140,224,.12);">🏊</div>
<div class="sport-ico" style="background:rgba(62,140,224,.12);"><svg class="ico"><use href="#i-swim"/></svg></div>
<div><div class="nm">سباحة مبتدئين</div><div class="ds">٦ - ٩ سنوات &bull; <span class="num">12</span> حصة/شهر</div></div>
<div class="pr"><b class="num">900</b><span>ج.م / شهر</span></div>
</div>
<div class="sport-item">
<div class="sport-ico" style="background:rgba(62,140,224,.12);">🏊</div>
<div class="sport-ico" style="background:rgba(62,140,224,.12);"><svg class="ico"><use href="#i-swim"/></svg></div>
<div><div class="nm">سباحة متقدم</div><div class="ds">١٠ - ١٤ سنة &bull; <span class="num">16</span> حصة/شهر</div></div>
<div class="pr"><b class="num">1,200</b><span>ج.م / شهر</span></div>
</div>
<div class="sport-item">
<div class="sport-ico" style="background:var(--mint-dim);">⚽</div>
<div class="sport-ico" style="background:var(--mint-dim);"><svg class="ico"><use href="#i-football"/></svg></div>
<div><div class="nm">كرة القدم &mdash; الموهبة</div><div class="ds">٨ - ١١ سنة &bull; <span class="num">12</span> حصة/شهر</div></div>
<div class="pr"><b class="num">1,100</b><span>ج.م / شهر</span></div>
</div>
<div class="sport-item">
<div class="sport-ico" style="background:var(--rose-dim);">🥋</div>
<div class="sport-ico" style="background:var(--rose-dim);"><svg class="ico"><use href="#i-karate"/></svg></div>
<div><div class="nm">كاراتيه مبتدئين</div><div class="ds">٦ - ١٢ سنة &bull; <span class="num">8</span> حصص/شهر</div></div>
<div class="pr"><b class="num">700</b><span>ج.م / شهر</span></div>
</div>
<div class="sport-item" style="opacity:.6;">
<div class="sport-ico" style="background:var(--gold-dim);">🎾</div>
<div class="sport-ico" style="background:var(--gold-dim);"><svg class="ico"><use href="#i-tennis"/></svg></div>
<div><div class="nm">تنس أرضي &mdash; أطفال</div><div class="ds"><span class="chip due">اكتمل العدد &mdash; قائمة انتظار</span></div></div>
<div class="pr"><b class="num">1,400</b><span>ج.م / شهر</span></div>
</div>
<div class="sport-item">
<div class="sport-ico" style="background:rgba(201,162,39,.12);">🤸</div>
<div class="sport-ico" style="background:rgba(201,162,39,.12);"><svg class="ico"><use href="#i-gym"/></svg></div>
<div><div class="nm">جمباز فني &mdash; سيدات</div><div class="ds">١٢ - ١٨ سنة &bull; <span class="num">12</span> حصة/شهر</div></div>
<div class="pr"><b class="num">1,000</b><span>ج.م / شهر</span></div>
</div>
......@@ -555,8 +591,8 @@
</div>
</div>
<div class="tabbar">
<div class="tab"><i>⌂</i>الرئيسية</div><div class="tab on"><i>◈</i>الأنشطة</div>
<div class="tab"><i>▣</i>الدخول</div><div class="tab"><i>◔</i>حسابي</div>
<div class="tab"><i><svg class="ico"><use href="#i-home"/></svg></i>الرئيسية</div><div class="tab on"><i><svg class="ico"><use href="#i-activity"/></svg></i>الأنشطة</div>
<div class="tab"><i><svg class="ico"><use href="#i-gate"/></svg></i>الدخول</div><div class="tab"><i><svg class="ico"><use href="#i-user"/></svg></i>حسابي</div>
</div>
</div>
......@@ -573,7 +609,7 @@
</div>
<div class="mcard" style="display:flex;gap:12px;align-items:center;">
<div class="sport-ico" style="background:rgba(62,140,224,.12);">🏊</div>
<div class="sport-ico" style="background:rgba(62,140,224,.12);"><svg class="ico"><use href="#i-swim"/></svg></div>
<div style="flex:1;">
<div style="font-weight:700;font-size:.85rem;">مجموعة أ &mdash; صباحي</div>
<div style="font-size:.7rem;color:var(--txt-3);">كابتن هشام صلاح &bull; حمام السباحة الأولمبي</div>
......@@ -604,8 +640,8 @@
</div>
</div>
<div class="tabbar">
<div class="tab"><i>⌂</i>الرئيسية</div><div class="tab on"><i>◈</i>الأنشطة</div>
<div class="tab"><i>▣</i>الدخول</div><div class="tab"><i>◔</i>حسابي</div>
<div class="tab"><i><svg class="ico"><use href="#i-home"/></svg></i>الرئيسية</div><div class="tab on"><i><svg class="ico"><use href="#i-activity"/></svg></i>الأنشطة</div>
<div class="tab"><i><svg class="ico"><use href="#i-gate"/></svg></i>الدخول</div><div class="tab"><i><svg class="ico"><use href="#i-user"/></svg></i>حسابي</div>
</div>
</div>
......@@ -652,15 +688,15 @@
<div class="side-b">
<img src="assets/club-logo.png" alt=""><span>نادي الصيد<br>بوابة الإدارة</span>
</div>
<div class="si on" data-jump="dash"><i>▤</i> لوحة التحصيل</div>
<div class="si" data-jump="import"><i>⬆</i> رفع البيانات</div>
<div class="si" data-jump="members"><i>◉</i> الأعضاء والمستحقات</div>
<div class="si" data-jump="catalog"><i>◈</i> تسعير الأنشطة</div>
<div class="si" data-jump="invites"><i>✉</i> سياسة الدعوات</div>
<div class="si" data-jump="sched"><i>◷</i> جداول المدربين</div>
<div class="si"><i>🧾</i> الإيصالات</div>
<div class="si"><i>🔔</i> الإشعارات</div>
<div class="si"><i>⚙</i> الإعدادات</div>
<div class="si on" data-jump="dash"><i><svg class="ico"><use href="#i-dashboard"/></svg></i> لوحة التحصيل</div>
<div class="si" data-jump="import"><i><svg class="ico"><use href="#i-upload"/></svg></i> رفع البيانات</div>
<div class="si" data-jump="members"><i><svg class="ico"><use href="#i-members"/></svg></i> الأعضاء والمستحقات</div>
<div class="si" data-jump="catalog"><i><svg class="ico"><use href="#i-activity"/></svg></i> تسعير الأنشطة</div>
<div class="si" data-jump="invites"><i><svg class="ico"><use href="#i-mail"/></svg></i> سياسة الدعوات</div>
<div class="si" data-jump="sched"><i><svg class="ico"><use href="#i-clock"/></svg></i> جداول المدربين</div>
<div class="si"><i><svg class="ico"><use href="#i-receipt"/></svg></i> الإيصالات</div>
<div class="si"><i><svg class="ico"><use href="#i-bell"/></svg></i> الإشعارات</div>
<div class="si"><i><svg class="ico"><use href="#i-settings"/></svg></i> الإعدادات</div>
</aside>
<main class="pmain">
......@@ -723,9 +759,9 @@
</div>
<div class="steps">
<div class="step done"><span class="b">✓</span> اختيار القالب</div>
<div class="step done"><span class="b"><svg class="ico"><use href="#i-check"/></svg></span> اختيار القالب</div>
<div class="step-line done"></div>
<div class="step done"><span class="b">✓</span> رفع الملف</div>
<div class="step done"><span class="b"><svg class="ico"><use href="#i-check"/></svg></span> رفع الملف</div>
<div class="step-line done"></div>
<div class="step now"><span class="b">٣</span> مطابقة الأعمدة</div>
<div class="step-line"></div>
......@@ -904,7 +940,7 @@
<div class="grid g2" style="gap:18px;align-items:start;">
<div>
<div class="drop" style="margin-bottom:14px;">
<div class="ic">📄</div>
<div class="ic"><svg class="ico"><use href="#i-file"/></svg></div>
<h4>اسحب ملف الجدول هنا أو اضغط للاختيار</h4>
<p>training_schedule.csv أو .xlsx &mdash; حتى 5 ميجابايت</p>
<div style="margin-top:14px;"><span class="pbtn">اختر ملفًا</span></div>
......@@ -981,42 +1017,42 @@
<div class="tmpl-h"><div class="fi">CSV</div><div><h4>١ &mdash; الأعضاء</h4><p>القاعدة التي يقوم عليها كل شيء</p></div></div>
<div class="tmpl-b">
<div class="cols"><span>كود العضوية</span><span>الاسم</span><span>الرقم القومي</span><span>الموبايل</span><span>نوع العضوية</span><span>الحالة</span><span>تاريخ الانضمام</span><span>تاريخ الانتهاء</span></div>
<a class="dl" href="templates/01_members.csv" download>⬇ تحميل القالب</a>
<a class="dl" href="templates/01_members.csv" download><svg class="ico"><use href="#i-download"/></svg> تحميل القالب</a>
</div>
</div>
<div class="tmpl">
<div class="tmpl-h"><div class="fi">CSV</div><div><h4>٢ &mdash; المستحقات</h4><p>التجديدات والأقساط والغرامات</p></div></div>
<div class="tmpl-b">
<div class="cols"><span>كود العضوية</span><span>نوع المستحق</span><span>الوصف</span><span>عن شهر</span><span>المبلغ</span><span>تاريخ الاستحقاق</span><span>الحالة</span></div>
<a class="dl" href="templates/02_dues.csv" download>⬇ تحميل القالب</a>
<a class="dl" href="templates/02_dues.csv" download><svg class="ico"><use href="#i-download"/></svg> تحميل القالب</a>
</div>
</div>
<div class="tmpl">
<div class="tmpl-h"><div class="fi">CSV</div><div><h4>٣ &mdash; كتالوج الأنشطة</h4><p>ما يظهر للعضو بالأسعار</p></div></div>
<div class="tmpl-b">
<div class="cols"><span>كود النشاط</span><span>الاسم</span><span>الفئة السنية</span><span>حصص/شهر</span><span>الاشتراك الشهري</span><span>رسوم الانضمام</span><span>السعة</span><span>المدرب</span></div>
<a class="dl" href="templates/03_sports_catalog.csv" download>⬇ تحميل القالب</a>
<a class="dl" href="templates/03_sports_catalog.csv" download><svg class="ico"><use href="#i-download"/></svg> تحميل القالب</a>
</div>
</div>
<div class="tmpl">
<div class="tmpl-h"><div class="fi">CSV</div><div><h4>٤ &mdash; المشتركون في الأنشطة</h4><p>الاشتراكات القائمة حاليًا</p></div></div>
<div class="tmpl-b">
<div class="cols"><span>كود العضوية</span><span>اسم اللاعب</span><span>كود النشاط</span><span>المجموعة</span><span>تاريخ البدء</span><span>الاشتراك</span><span>الحالة</span></div>
<a class="dl" href="templates/04_activity_subscriptions.csv" download>⬇ تحميل القالب</a>
<a class="dl" href="templates/04_activity_subscriptions.csv" download><svg class="ico"><use href="#i-download"/></svg> تحميل القالب</a>
</div>
</div>
<div class="tmpl">
<div class="tmpl-h"><div class="fi">CSV</div><div><h4>٥ &mdash; سياسة الدعوات</h4><p>سطر واحد لكل نوع عضوية</p></div></div>
<div class="tmpl-b">
<div class="cols"><span>نوع العضوية</span><span>دعوات مجانية</span><span>سعر الإضافية</span><span>حد الشراء</span><span>دعوة طفل</span><span>الصلاحية</span></div>
<a class="dl" href="templates/05_invitations_policy.csv" download>⬇ تحميل القالب</a>
<a class="dl" href="templates/05_invitations_policy.csv" download><svg class="ico"><use href="#i-download"/></svg> تحميل القالب</a>
</div>
</div>
<div class="tmpl">
<div class="tmpl-h"><div class="fi">CSV</div><div><h4>٦ &mdash; جداول التدريب</h4><p>يملأه كل مدرب لمجموعته</p></div></div>
<div class="tmpl-b">
<div class="cols"><span>كود النشاط</span><span>المجموعة</span><span>اليوم</span><span>من</span><span>إلى</span><span>المكان</span><span>المدرب</span><span>ملاحظات</span></div>
<a class="dl" href="templates/06_training_schedule.csv" download>⬇ تحميل القالب</a>
<a class="dl" href="templates/06_training_schedule.csv" download><svg class="ico"><use href="#i-download"/></svg> تحميل القالب</a>
</div>
</div>
</div>
......@@ -1053,15 +1089,15 @@
<div class="grid g3 reveal" style="margin-top:22px;">
<div class="card" style="background:rgba(255,255,255,.04);border-color:rgba(255,255,255,.1);">
<div class="card-ico sky">🔐</div><h4>أمان البيانات</h4>
<div class="card-ico sky"><svg class="ico"><use href="#i-shield"/></svg></div><h4>أمان البيانات</h4>
<p style="color:#A9BBD4;">تشفير كامل للاتصال، دخول العضو بـ OTP بلا كلمات مرور، صلاحيات محددة لموظفي البوابة، وسجل مراجعة لكل تعديل.</p>
</div>
<div class="card" style="background:rgba(255,255,255,.04);border-color:rgba(255,255,255,.1);">
<div class="card-ico mint">💾</div><h4>ملكية البيانات</h4>
<div class="card-ico mint"><svg class="ico"><use href="#i-database"/></svg></div><h4>ملكية البيانات</h4>
<p style="color:#A9BBD4;">بيانات النادي ملك النادي. تصدير كامل بصيغة Excel في أي وقت وبضغطة واحدة، بلا احتجاز ولا رسوم خروج.</p>
</div>
<div class="card" style="background:rgba(255,255,255,.04);border-color:rgba(255,255,255,.1);">
<div class="card-ico">🔌</div><h4>قابلية التوسع</h4>
<div class="card-ico"><svg class="ico"><use href="#i-plug"/></svg></div><h4>قابلية التوسع</h4>
<p style="color:#A9BBD4;">النظام مبني بواجهة برمجية (API) موثقة، فأي نظام محاسبي أو ERP مستقبلي يتصل به مباشرة دون إعادة بناء.</p>
</div>
</div>
......@@ -1095,14 +1131,14 @@
<div style="background:#fff;border:1px solid var(--line);border-radius:var(--r-m);padding:24px;margin-bottom:18px;">
<h4 style="color:var(--navy);margin-bottom:14px;">ما نحتاجه منكم</h4>
<ul class="scope-list" style="font-size:.88rem;">
<li><span class="tick">✓</span><span>ملف الأعضاء الحالي بأي صيغة متاحة (Excel أو تصدير من نظامكم)</span></li>
<li><span class="tick">✓</span><span>قائمة أنواع العضوية وقيمة التجديد لكل نوع</span></li>
<li><span class="tick">✓</span><span>قائمة الأنشطة الرياضية وأسعارها المعتمدة</span></li>
<li><span class="tick">✓</span><span>سياسة الدعوات المعتمدة من المجلس</span></li>
<li><span class="tick">✓</span><span>حساب تاجر لدى بوابة دفع باسم النادي (نرشدكم في فتحه)</span></li>
<li><span class="tick">✓</span><span>حسابا مطوّر باسم النادي على App Store و Google Play</span></li>
<li><span class="tick">✓</span><span>حساب استضافة سحابية وحساب مزوّد رسائل SMS لأكواد التحقق</span></li>
<li><span class="tick">✓</span><span>مسؤول تواصل واحد من النادي طوال المشروع</span></li>
<li><span class="tick"><svg class="ico"><use href="#i-check"/></svg></span><span>ملف الأعضاء الحالي بأي صيغة متاحة (Excel أو تصدير من نظامكم)</span></li>
<li><span class="tick"><svg class="ico"><use href="#i-check"/></svg></span><span>قائمة أنواع العضوية وقيمة التجديد لكل نوع</span></li>
<li><span class="tick"><svg class="ico"><use href="#i-check"/></svg></span><span>قائمة الأنشطة الرياضية وأسعارها المعتمدة</span></li>
<li><span class="tick"><svg class="ico"><use href="#i-check"/></svg></span><span>سياسة الدعوات المعتمدة من المجلس</span></li>
<li><span class="tick"><svg class="ico"><use href="#i-check"/></svg></span><span>حساب تاجر لدى بوابة دفع باسم النادي (نرشدكم في فتحه)</span></li>
<li><span class="tick"><svg class="ico"><use href="#i-check"/></svg></span><span>حسابا مطوّر باسم النادي على App Store و Google Play</span></li>
<li><span class="tick"><svg class="ico"><use href="#i-check"/></svg></span><span>حساب استضافة سحابية وحساب مزوّد رسائل SMS لأكواد التحقق</span></li>
<li><span class="tick"><svg class="ico"><use href="#i-check"/></svg></span><span>مسؤول تواصل واحد من النادي طوال المشروع</span></li>
</ul>
</div>
<div class="note">
......@@ -1181,13 +1217,13 @@
<div style="background:#fff;border:1px solid var(--line);border-radius:var(--r-m);padding:20px;margin-top:16px;">
<h4 style="color:var(--navy);font-size:.96rem;margin-bottom:10px;">مشمول في السعر بلا رسوم إضافية</h4>
<ul class="scope-list" style="font-size:.85rem;">
<li><span class="tick">✓</span><span>تسليم الكود المصدري كاملًا للنادي</span></li>
<li><span class="tick">✓</span><span>نشر التطبيق على المتجرين تحت حسابات النادي</span></li>
<li><span class="tick">✓</span><span>عدد غير محدود من الأعضاء والمستخدمين &mdash; لا رسوم لكل مستخدم</span></li>
<li><span class="tick">✓</span><span>يوما تدريب حضوري + أدلة استخدام بالعربية</span></li>
<li><span class="tick">✓</span><span>تصحيح أي خلل يظهر في التشغيل التجريبي قبل الإطلاق</span></li>
<li><span class="tick">✓</span><span>تصدير كامل لبياناتكم في أي وقت</span></li>
<li><span class="tick">✓</span><span>واجهة برمجية (API) موثقة للربط المستقبلي</span></li>
<li><span class="tick"><svg class="ico"><use href="#i-check"/></svg></span><span>تسليم الكود المصدري كاملًا للنادي</span></li>
<li><span class="tick"><svg class="ico"><use href="#i-check"/></svg></span><span>نشر التطبيق على المتجرين تحت حسابات النادي</span></li>
<li><span class="tick"><svg class="ico"><use href="#i-check"/></svg></span><span>عدد غير محدود من الأعضاء والمستخدمين &mdash; لا رسوم لكل مستخدم</span></li>
<li><span class="tick"><svg class="ico"><use href="#i-check"/></svg></span><span>يوما تدريب حضوري + أدلة استخدام بالعربية</span></li>
<li><span class="tick"><svg class="ico"><use href="#i-check"/></svg></span><span>تصحيح أي خلل يظهر في التشغيل التجريبي قبل الإطلاق</span></li>
<li><span class="tick"><svg class="ico"><use href="#i-check"/></svg></span><span>تصدير كامل لبياناتكم في أي وقت</span></li>
<li><span class="tick"><svg class="ico"><use href="#i-check"/></svg></span><span>واجهة برمجية (API) موثقة للربط المستقبلي</span></li>
</ul>
<div style="margin-top:14px;padding-top:14px;border-top:1px dashed var(--line-2);font-size:.82rem;color:var(--txt-2);line-height:1.85;">
<b style="color:var(--navy);">غير مشمول:</b> هذا العرض للتنفيذ والتسليم فقط. الدعم الفني والصيانة والاستضافة والتطوير بعد الإطلاق غير مشمولة، وتُسعَّر على حدة إن طلبها النادي لاحقًا.
......@@ -1197,11 +1233,11 @@
</div>
<div class="grid g3 reveal" style="margin-top:34px;">
<div class="card"><div class="card-ico mint">↺</div><h4>عائد الاستثمار</h4>
<div class="card"><div class="card-ico mint"><svg class="ico"><use href="#i-refresh"/></svg></div><h4>عائد الاستثمار</h4>
<p>يكفي أن ترتفع نسبة التحصيل في موعده ٢٠٪ عمّا هي عليه اليوم، حتى تتجاوز الزيادةُ السنوية في المُحصَّل قيمةَ المشروع كاملةً خلال أقل من شهرين من التشغيل.</p></div>
<div class="card"><div class="card-ico">⊕</div><h4>خصم التوقيع المبكر</h4>
<div class="card"><div class="card-ico"><svg class="ico"><use href="#i-plus"/></svg></div><h4>خصم التوقيع المبكر</h4>
<p>عند التوقيع خلال ٣٠ يومًا من تاريخ العرض: خصم <b class="num">5%</b> من الإجمالي &mdash; أي <span class="num">45,000</span> ج.م تُخصم من الدفعة الأخيرة.</p></div>
<div class="card"><div class="card-ico sky">→</div><h4>المرحلة الثانية</h4>
<div class="card"><div class="card-ico sky"><svg class="ico"><use href="#i-layers"/></svg></div><h4>المرحلة الثانية</h4>
<p>الحجوزات والمحفظة والمطاعم والقرى والشكاوى والأخبار &mdash; تُسعَّر على حدة عند طلبها، وتُبنى فوق النظام نفسه دون هدم ولا إعادة بناء.</p></div>
</div>
</div>
......
Proposal/sayd-mobile/js/app.js
View file @ ff106889
......@@ -93,11 +93,11 @@
if (!n || !noteBox) return;
noteBox.innerHTML =
'<div class="card" style="border-color:var(--line-2);">' +
'<div class="card-ico">◆</div>' +
'<div class="card-ico"><svg class="ico"><use href="#i-note"/></svg></div>' +
'<h4>' + n.t + '</h4>' +
'<p>' + n.p + '</p>' +
'<ul class="scope-list" style="margin-top:14px;">' +
n.b.map(function (x) { return '<li><span class="tick">✓</span><span>' + x + '</span></li>'; }).join('') +
n.b.map(function (x) { return '<li><span class="tick"><svg class="ico"><use href="#i-check"/></svg></span><span>' + x + '</span></li>'; }).join('') +
'</ul>' +
'</div>';
}
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment