Skip to content

E
EL-Captain-Website
Commit afce67c8 authored by Mahmoud Aglan's avatar Mahmoud Aglan
Browse files
Options

Replace all emojis with inline SVG icons across entire website 

Sweep index.html, pricing.html, and pages.css — replace every emoji
(pain cards, trust badges, tool icons, swimming teaser, value strip,
comparison table checks, CSS pseudo-element content) with proper SVG.
Co-Authored-By: 's avatarClaude Opus 4.6 <noreply@anthropic.com>
parent 890c4577
Show whitespace changes
Inline Side-by-side
Showing with 113 additions and 108 deletions
public/css/pages.css
View file @ afce67c8
...@@ -214,22 +214,21 @@ ...@@ -214,22 +214,21 @@
/* Teal checkmark before each item */ /* Teal checkmark before each item */
.feature-list__item::before { .feature-list__item::before {
content: '✓'; content: '';
flex-shrink: 0; flex-shrink: 0;
width: 20px; width: 20px;
height: 20px; height: 20px;
display: grid; display: block;
place-items: center;
font-size: 0.75rem;
font-weight: 800;
color: #ffffff;
background: var(--brand-teal, #14b8a6); background: var(--brand-teal, #14b8a6);
border-radius: 50%; border-radius: 50%;
margin-top: 2px; margin-top: 2px;
line-height: 1; background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' fill='none' stroke='%23ffffff' stroke-width='3' xmlns='http://www.w3.org/2000/svg'%3E%3Cpolyline points='20 6 9 17 4 12'/%3E%3C/svg%3E");
background-size: 12px;
background-position: center;
background-repeat: no-repeat;
} }
/* Variant: custom icon instead of auto-generated ✓ */ /* Variant: custom icon instead of auto-generated checkmark */
.feature-list__item--icon::before { .feature-list__item--icon::before {
display: none; /* icon provided inline */ display: none; /* icon provided inline */
} }
...@@ -499,8 +498,14 @@ ...@@ -499,8 +498,14 @@
} }
.form-error::before { .form-error::before {
content: '⚠'; content: '';
font-size: 0.65rem; display: inline-block;
width: 12px;
height: 12px;
background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M10.29 3.86L1.82 18a2 2 0 0 0 1.71 3h16.94a2 2 0 0 0 1.71-3L13.71 3.86a2 2 0 0 0-3.42 0z'/%3E%3Cline x1='12' y1='9' x2='12' y2='13'/%3E%3Cline x1='12' y1='17' x2='12.01' y2='17'/%3E%3C/svg%3E");
background-size: contain;
background-repeat: no-repeat;
vertical-align: middle;
} }
/* ───────────────────────────────────────────── /* ─────────────────────────────────────────────
...@@ -751,18 +756,18 @@ ...@@ -751,18 +756,18 @@
} }
.pricing-card__feature::before { .pricing-card__feature::before {
content: '✓'; content: '';
flex-shrink: 0; flex-shrink: 0;
width: 18px; width: 18px;
height: 18px; height: 18px;
display: grid; display: block;
place-items: center;
font-size: 0.65rem;
font-weight: 800;
color: #ffffff;
background: var(--brand-teal, #14b8a6); background: var(--brand-teal, #14b8a6);
border-radius: 50%; border-radius: 50%;
margin-top: 2px; margin-top: 2px;
background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' fill='none' stroke='%23ffffff' stroke-width='3' xmlns='http://www.w3.org/2000/svg'%3E%3Cpolyline points='20 6 9 17 4 12'/%3E%3C/svg%3E");
background-size: 10px;
background-position: center;
background-repeat: no-repeat;
} }
/* Disabled feature */ /* Disabled feature */
...@@ -1133,17 +1138,17 @@ ...@@ -1133,17 +1138,17 @@
} }
.grid-feature__list li::before { .grid-feature__list li::before {
content: '✓'; content: '';
flex-shrink: 0; flex-shrink: 0;
width: 1.5rem; width: 1.5rem;
height: 1.5rem; height: 1.5rem;
display: grid; display: block;
place-items: center;
background: oklch(0.93 0.05 170); background: oklch(0.93 0.05 170);
color: oklch(0.40 0.15 170);
border-radius: var(--radius-full); border-radius: var(--radius-full);
font-size: 0.75rem; background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' fill='none' stroke='%23178a5b' stroke-width='3' xmlns='http://www.w3.org/2000/svg'%3E%3Cpolyline points='20 6 9 17 4 12'/%3E%3C/svg%3E");
font-weight: 700; background-size: 12px;
background-position: center;
background-repeat: no-repeat;
} }
/* Lane visualization */ /* Lane visualization */
......
public/index.html
View file @ afce67c8
...@@ -73,7 +73,7 @@ ...@@ -73,7 +73,7 @@
<span class="trust-bar__label">عربي بالكامل</span> <span class="trust-bar__label">عربي بالكامل</span>
</div> </div>
<div class="trust-bar__stat"> <div class="trust-bar__stat">
<span class="trust-bar__number">مبني لمصر 🇪🇬</span> <span class="trust-bar__number">مبني لمصر <svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" style="display:inline-block;vertical-align:middle;"><circle cx="12" cy="12" r="10"/><line x1="2" y1="12" x2="22" y2="12"/><path d="M12 2a15.3 15.3 0 0 1 4 10 15.3 15.3 0 0 1-4 10 15.3 15.3 0 0 1-4-10 15.3 15.3 0 0 1 4-10z"/></svg></span>
<span class="trust-bar__label">للسوق المصري</span> <span class="trust-bar__label">للسوق المصري</span>
</div> </div>
</div> </div>
...@@ -90,56 +90,56 @@ ...@@ -90,56 +90,56 @@
<div class="pain-points__grid"> <div class="pain-points__grid">
<div class="pain-card pain-card--problem" data-reveal="100"> <div class="pain-card pain-card--problem" data-reveal="100">
<span class="pain-card__emoji">😵</span> <span class="pain-card__emoji"><svg width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><circle cx="12" cy="12" r="10"/><path d="M8 15s1.5-2 4-2 4 2 4 2"/><line x1="9" y1="9" x2="9.01" y2="9"/><line x1="15" y1="9" x2="15.01" y2="9"/></svg></span>
<span class="pain-card__label">المشكلة</span> <span class="pain-card__label">المشكلة</span>
<p class="pain-card__text">فوضى الاشتراكات</p> <p class="pain-card__text">فوضى الاشتراكات</p>
<p class="pain-card__detail">اشتراكات متأخرة وغرامات ضائعة لأن لا أحد يتابع مواعيد التجديد يدويًا لمئات المشتركين</p> <p class="pain-card__detail">اشتراكات متأخرة وغرامات ضائعة لأن لا أحد يتابع مواعيد التجديد يدويًا لمئات المشتركين</p>
</div> </div>
<div class="pain-card pain-card--solution" data-reveal="150"> <div class="pain-card pain-card--solution" data-reveal="150">
<span class="pain-card__emoji">✅</span> <span class="pain-card__emoji"><svg width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M22 11.08V12a10 10 0 1 1-5.93-9.14"/><polyline points="22 4 12 14.01 9 11.01"/></svg></span>
<span class="pain-card__label">الحل</span> <span class="pain-card__label">الحل</span>
<p class="pain-card__text">متابعة تلقائية</p> <p class="pain-card__text">متابعة تلقائية</p>
<p class="pain-card__detail">متابعة تلقائية لكل اشتراك بتنبيهات وتجديدات محسوبة بدون تدخل يدوي</p> <p class="pain-card__detail">متابعة تلقائية لكل اشتراك بتنبيهات وتجديدات محسوبة بدون تدخل يدوي</p>
</div> </div>
<div class="pain-card pain-card--problem" data-reveal="200"> <div class="pain-card pain-card--problem" data-reveal="200">
<span class="pain-card__emoji">📊</span> <span class="pain-card__emoji"><svg width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><line x1="18" y1="20" x2="18" y2="10"/><line x1="12" y1="20" x2="12" y2="4"/><line x1="6" y1="20" x2="6" y2="14"/></svg></span>
<span class="pain-card__label">المشكلة</span> <span class="pain-card__label">المشكلة</span>
<p class="pain-card__text">ملفات Excel منفصلة</p> <p class="pain-card__text">ملفات Excel منفصلة</p>
<p class="pain-card__detail">ملفات منفصلة للمشتركين والمالية والأنشطة ولا رابط بينها — وكل ملف نسخة مختلفة</p> <p class="pain-card__detail">ملفات منفصلة للمشتركين والمالية والأنشطة ولا رابط بينها — وكل ملف نسخة مختلفة</p>
</div> </div>
<div class="pain-card pain-card--solution" data-reveal="250"> <div class="pain-card pain-card--solution" data-reveal="250">
<span class="pain-card__emoji">🔗</span> <span class="pain-card__emoji"><svg width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M10 13a5 5 0 0 0 7.54.54l3-3a5 5 0 0 0-7.07-7.07l-1.72 1.71"/><path d="M14 11a5 5 0 0 0-7.54-.54l-3 3a5 5 0 0 0 7.07 7.07l1.71-1.71"/></svg></span>
<span class="pain-card__label">الحل</span> <span class="pain-card__label">الحل</span>
<p class="pain-card__text">نظام واحد متكامل</p> <p class="pain-card__text">نظام واحد متكامل</p>
<p class="pain-card__detail">نظام واحد يربط كل شيء ببعضه — المشترك والمالية والحضور والتقارير في مكان واحد</p> <p class="pain-card__detail">نظام واحد يربط كل شيء ببعضه — المشترك والمالية والحضور والتقارير في مكان واحد</p>
</div> </div>
<div class="pain-card pain-card--problem" data-reveal="300"> <div class="pain-card pain-card--problem" data-reveal="300">
<span class="pain-card__emoji">📋</span> <span class="pain-card__emoji"><svg width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M16 4h2a2 2 0 0 1 2 2v14a2 2 0 0 1-2 2H6a2 2 0 0 1-2-2V6a2 2 0 0 1 2-2h2"/><rect x="8" y="2" width="8" height="4" rx="1"/></svg></span>
<span class="pain-card__label">المشكلة</span> <span class="pain-card__label">المشكلة</span>
<p class="pain-card__text">حضور يدوي</p> <p class="pain-card__text">حضور يدوي</p>
<p class="pain-card__detail">المدربين لا يعرفون من حضر ومن غاب إلا بكشوف ورقية قابلة للتلاعب والضياع</p> <p class="pain-card__detail">المدربين لا يعرفون من حضر ومن غاب إلا بكشوف ورقية قابلة للتلاعب والضياع</p>
</div> </div>
<div class="pain-card pain-card--solution" data-reveal="350"> <div class="pain-card pain-card--solution" data-reveal="350">
<span class="pain-card__emoji">📱</span> <span class="pain-card__emoji"><svg width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><rect x="5" y="2" width="14" height="20" rx="2"/><line x1="12" y1="18" x2="12.01" y2="18"/></svg></span>
<span class="pain-card__label">الحل</span> <span class="pain-card__label">الحل</span>
<p class="pain-card__text">حضور ذكي</p> <p class="pain-card__text">حضور ذكي</p>
<p class="pain-card__detail">تسجيل حضور لحظي من التطبيق مع إشعارات فورية لأولياء الأمور</p> <p class="pain-card__detail">تسجيل حضور لحظي من التطبيق مع إشعارات فورية لأولياء الأمور</p>
</div> </div>
<div class="pain-card pain-card--problem" data-reveal="400"> <div class="pain-card pain-card--problem" data-reveal="400">
<span class="pain-card__emoji">🙈</span> <span class="pain-card__emoji"><svg width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M17.94 17.94A10.07 10.07 0 0 1 12 20c-7 0-11-8-11-8a18.45 18.45 0 0 1 5.06-5.94M9.9 4.24A9.12 9.12 0 0 1 12 4c7 0 11 8 11 8a18.5 18.5 0 0 1-2.16 3.19"/><line x1="1" y1="1" x2="23" y2="23"/></svg></span>
<span class="pain-card__label">المشكلة</span> <span class="pain-card__label">المشكلة</span>
<p class="pain-card__text">لا رؤية مالية</p> <p class="pain-card__text">لا رؤية مالية</p>
<p class="pain-card__detail">لا تعرف أرباحك الحقيقية ولا مصاريفك الفعلية — كل شيء تقديري وغير دقيق</p> <p class="pain-card__detail">لا تعرف أرباحك الحقيقية ولا مصاريفك الفعلية — كل شيء تقديري وغير دقيق</p>
</div> </div>
<div class="pain-card pain-card--solution" data-reveal="450"> <div class="pain-card pain-card--solution" data-reveal="450">
<span class="pain-card__emoji">📈</span> <span class="pain-card__emoji"><svg width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><polyline points="23 6 13.5 15.5 8.5 10.5 1 18"/><polyline points="17 6 23 6 23 12"/></svg></span>
<span class="pain-card__label">الحل</span> <span class="pain-card__label">الحل</span>
<p class="pain-card__text">تقارير مالية شاملة</p> <p class="pain-card__text">تقارير مالية شاملة</p>
<p class="pain-card__detail">محاسبة قيد مزدوج حقيقية مع تقارير لحظية لكل قرش دخل أو خرج</p> <p class="pain-card__detail">محاسبة قيد مزدوج حقيقية مع تقارير لحظية لكل قرش دخل أو خرج</p>
...@@ -159,32 +159,32 @@ ...@@ -159,32 +159,32 @@
<div class="all-in-one__list"> <div class="all-in-one__list">
<div class="all-in-one__item all-in-one__item--old"> <div class="all-in-one__item all-in-one__item--old">
<span class="all-in-one__tool-icon">💬</span> <span class="all-in-one__tool-icon"><svg width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M21 15a2 2 0 0 1-2 2H7l-4 4V5a2 2 0 0 1 2-2h14a2 2 0 0 1 2 2z"/></svg></span>
<span>مجموعات WhatsApp للتواصل</span> <span>مجموعات WhatsApp للتواصل</span>
</div> </div>
<div class="all-in-one__item all-in-one__item--old"> <div class="all-in-one__item all-in-one__item--old">
<span class="all-in-one__tool-icon">📊</span> <span class="all-in-one__tool-icon"><svg width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><line x1="18" y1="20" x2="18" y2="10"/><line x1="12" y1="20" x2="12" y2="4"/><line x1="6" y1="20" x2="6" y2="14"/></svg></span>
<span>ملفات Excel للبيانات</span> <span>ملفات Excel للبيانات</span>
</div> </div>
<div class="all-in-one__item all-in-one__item--old"> <div class="all-in-one__item all-in-one__item--old">
<span class="all-in-one__tool-icon">🧾</span> <span class="all-in-one__tool-icon"><svg width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M14 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8z"/><polyline points="14 2 14 8 20 8"/><line x1="16" y1="13" x2="8" y2="13"/><line x1="16" y1="17" x2="8" y2="17"/></svg></span>
<span>إيصالات ورقية للمدفوعات</span> <span>إيصالات ورقية للمدفوعات</span>
</div> </div>
<div class="all-in-one__item all-in-one__item--old"> <div class="all-in-one__item all-in-one__item--old">
<span class="all-in-one__tool-icon">🧮</span> <span class="all-in-one__tool-icon"><svg width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><rect x="4" y="2" width="16" height="20" rx="2"/><line x1="8" y1="6" x2="16" y2="6"/><line x1="8" y1="10" x2="10" y2="10"/><line x1="14" y1="10" x2="16" y2="10"/><line x1="8" y1="14" x2="10" y2="14"/><line x1="14" y1="14" x2="16" y2="14"/><line x1="8" y1="18" x2="10" y2="18"/><line x1="14" y1="18" x2="16" y2="18"/></svg></span>
<span>برنامج محاسبة منفصل</span> <span>برنامج محاسبة منفصل</span>
</div> </div>
<div class="all-in-one__item all-in-one__item--old"> <div class="all-in-one__item all-in-one__item--old">
<span class="all-in-one__tool-icon">📋</span> <span class="all-in-one__tool-icon"><svg width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M16 4h2a2 2 0 0 1 2 2v14a2 2 0 0 1-2 2H6a2 2 0 0 1-2-2V6a2 2 0 0 1 2-2h2"/><rect x="8" y="2" width="8" height="4" rx="1"/></svg></span>
<span>كشوف حضور يدوية</span> <span>كشوف حضور يدوية</span>
</div> </div>
<div class="all-in-one__arrow">↓</div> <div class="all-in-one__arrow">↓</div>
<div class="all-in-one__item all-in-one__item--new"> <div class="all-in-one__item all-in-one__item--new">
<span class="all-in-one__tool-icon">🏆</span> <span class="all-in-one__tool-icon"><svg width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M6 9H4.5a2.5 2.5 0 0 1 0-5H6"/><path d="M18 9h1.5a2.5 2.5 0 0 0 0-5H18"/><path d="M4 22h16"/><path d="M10 14.66V17c0 .55-.47.98-.97 1.21C7.85 18.75 7 20.24 7 22"/><path d="M14 14.66V17c0 .55.47.98.97 1.21C16.15 18.75 17 20.24 17 22"/><path d="M18 2H6v7a6 6 0 0 0 12 0V2Z"/></svg></span>
<span>El-Captain — نظام واحد لكل شيء</span> <span>El-Captain — نظام واحد لكل شيء</span>
<span class="all-in-one__check">✓</span> <span class="all-in-one__check"><svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="3"><polyline points="20 6 9 17 4 12"/></svg></span>
</div> </div>
</div> </div>
...@@ -420,26 +420,26 @@ ...@@ -420,26 +420,26 @@
<div class="trust-badges" data-reveal> <div class="trust-badges" data-reveal>
<span class="trust-badge"> <span class="trust-badge">
<span class="trust-badge__icon">🔐</span> <span class="trust-badge__icon"><svg width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><rect x="3" y="11" width="18" height="11" rx="2"/><path d="M7 11V7a5 5 0 0 1 10 0v4"/></svg></span>
<span>بيانات مشفرة</span> <span>بيانات مشفرة</span>
</span> </span>
<span class="trust-badge"> <span class="trust-badge">
<span class="trust-badge__icon">💾</span> <span class="trust-badge__icon"><svg width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M19 21H5a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h11l5 5v11a2 2 0 0 1-2 2z"/><polyline points="17 21 17 13 7 13 7 21"/><polyline points="7 3 7 8 15 8"/></svg></span>
<span>نسخ احتياطي يومي</span> <span>نسخ احتياطي يومي</span>
</span> </span>
<span class="trust-badge"> <span class="trust-badge">
<span class="trust-badge__icon">🔑</span> <span class="trust-badge__icon"><svg width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M12 22s8-4 8-10V5l-8-3-8 3v7c0 6 8 10 8 10z"/></svg></span>
<span>صلاحيات دقيقة</span> <span>صلاحيات دقيقة</span>
</span> </span>
<span class="trust-badge"> <span class="trust-badge">
<span class="trust-badge__icon">☁️</span> <span class="trust-badge__icon"><svg width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M18 10h-1.26A8 8 0 1 0 9 20h9a5 5 0 0 0 0-10z"/></svg></span>
<span>سحابي آمن</span> <span>سحابي آمن</span>
</span> </span>
</div> </div>
<div class="trust-badges" style="margin-block-start: var(--space-xl);" data-reveal="200"> <div class="trust-badges" style="margin-block-start: var(--space-xl);" data-reveal="200">
<span class="trust-badge trust-badge--egypt"> <span class="trust-badge trust-badge--egypt">
<span class="trust-badge__icon">🇪🇬</span> <span class="trust-badge__icon"><svg width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><circle cx="12" cy="12" r="10"/><line x1="2" y1="12" x2="22" y2="12"/><path d="M12 2a15.3 15.3 0 0 1 4 10 15.3 15.3 0 0 1-4 10 15.3 15.3 0 0 1-4-10 15.3 15.3 0 0 1 4-10z"/></svg></span>
<span>صُمم في مصر للسوق المصري</span> <span>صُمم في مصر للسوق المصري</span>
</span> </span>
</div> </div>
...@@ -451,7 +451,7 @@ ...@@ -451,7 +451,7 @@
<div class="container"> <div class="container">
<div class="swimming-teaser__inner"> <div class="swimming-teaser__inner">
<div class="swimming-teaser__content"> <div class="swimming-teaser__content">
<span class="swimming-teaser__icon">🏊</span> <span class="swimming-teaser__icon"><svg width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M2 20c.9-.4 1.8-.8 2.8-.8 2 0 3.2 1.6 5.2 1.6s3.2-1.6 5.2-1.6c1 0 1.9.4 2.8.8"/><path d="M2 16c.9-.4 1.8-.8 2.8-.8 2 0 3.2 1.6 5.2 1.6s3.2-1.6 5.2-1.6c1 0 1.9.4 2.8.8"/><circle cx="16" cy="6" r="2"/><path d="M12 12l-2-2-4 4"/></svg></span>
<div> <div>
<p class="swimming-teaser__text">لأكاديميات السباحة: نظام حارات وإيجارات ذكي</p> <p class="swimming-teaser__text">لأكاديميات السباحة: نظام حارات وإيجارات ذكي</p>
<p class="swimming-teaser__sub">إدارة الحارات، حجوزات المسابح، وإيجارات المساحات بنظام متخصص.</p> <p class="swimming-teaser__sub">إدارة الحارات، حجوزات المسابح، وإيجارات المساحات بنظام متخصص.</p>
......
public/pricing.html
View file @ afce67c8
...@@ -591,19 +591,19 @@ ...@@ -591,19 +591,19 @@
<div class="container" data-reveal> <div class="container" data-reveal>
<div class="value-strip"> <div class="value-strip">
<div class="value-strip__item"> <div class="value-strip__item">
<div class="value-strip__icon">🔓</div> <div class="value-strip__icon"><svg width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><rect x="3" y="11" width="18" height="11" rx="2"/><path d="M7 11V7a5 5 0 0 1 9.9-1"/></svg></div>
<div class="value-strip__text">بدون عقود إلزامية</div> <div class="value-strip__text">بدون عقود إلزامية</div>
</div> </div>
<div class="value-strip__item"> <div class="value-strip__item">
<div class="value-strip__icon">💳</div> <div class="value-strip__icon"><svg width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><rect x="1" y="4" width="22" height="16" rx="2"/><line x1="1" y1="10" x2="23" y2="10"/></svg></div>
<div class="value-strip__text">إلغاء في أي وقت</div> <div class="value-strip__text">إلغاء في أي وقت</div>
</div> </div>
<div class="value-strip__item"> <div class="value-strip__item">
<div class="value-strip__icon">🔄</div> <div class="value-strip__icon"><svg width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><polyline points="23 4 23 10 17 10"/><polyline points="1 20 1 14 7 14"/><path d="M3.51 9a9 9 0 0 1 14.85-3.36L23 10M1 14l4.64 4.36A9 9 0 0 0 20.49 15"/></svg></div>
<div class="value-strip__text">ترقية أو تخفيض فوري</div> <div class="value-strip__text">ترقية أو تخفيض فوري</div>
</div> </div>
<div class="value-strip__item"> <div class="value-strip__item">
<div class="value-strip__icon">🛡️</div> <div class="value-strip__icon"><svg width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M12 22s8-4 8-10V5l-8-3-8 3v7c0 6 8 10 8 10z"/></svg></div>
<div class="value-strip__text">ضمان استرداد 30 يوم</div> <div class="value-strip__text">ضمان استرداد 30 يوم</div>
</div> </div>
</div> </div>
...@@ -660,108 +660,108 @@ ...@@ -660,108 +660,108 @@
</tr> </tr>
<tr> <tr>
<td>إدارة المشتركين</td> <td>إدارة المشتركين</td>
<td class="check">✓</td> <td class="check"><svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="3"><polyline points="20 6 9 17 4 12"/></svg></td>
<td class="check">✓</td> <td class="check"><svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="3"><polyline points="20 6 9 17 4 12"/></svg></td>
<td class="featured-col check">✓</td> <td class="featured-col check"><svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="3"><polyline points="20 6 9 17 4 12"/></svg></td>
<td class="check">✓</td> <td class="check"><svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="3"><polyline points="20 6 9 17 4 12"/></svg></td>
</tr> </tr>
<tr> <tr>
<td>الفواتير والمدفوعات</td> <td>الفواتير والمدفوعات</td>
<td class="check">✓</td> <td class="check"><svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="3"><polyline points="20 6 9 17 4 12"/></svg></td>
<td class="check">✓</td> <td class="check"><svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="3"><polyline points="20 6 9 17 4 12"/></svg></td>
<td class="featured-col check">✓</td> <td class="featured-col check"><svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="3"><polyline points="20 6 9 17 4 12"/></svg></td>
<td class="check">✓</td> <td class="check"><svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="3"><polyline points="20 6 9 17 4 12"/></svg></td>
</tr> </tr>
<tr> <tr>
<td>تسجيل الحضور</td> <td>تسجيل الحضور</td>
<td class="check">✓</td> <td class="check"><svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="3"><polyline points="20 6 9 17 4 12"/></svg></td>
<td class="check">✓</td> <td class="check"><svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="3"><polyline points="20 6 9 17 4 12"/></svg></td>
<td class="featured-col check">✓</td> <td class="featured-col check"><svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="3"><polyline points="20 6 9 17 4 12"/></svg></td>
<td class="check">✓</td> <td class="check"><svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="3"><polyline points="20 6 9 17 4 12"/></svg></td>
</tr> </tr>
<tr> <tr>
<td>البرامج والمجموعات</td> <td>البرامج والمجموعات</td>
<td class="cross">—</td> <td class="cross"><svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><line x1="5" y1="12" x2="19" y2="12"/></svg></td>
<td class="check">✓</td> <td class="check"><svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="3"><polyline points="20 6 9 17 4 12"/></svg></td>
<td class="featured-col check">✓</td> <td class="featured-col check"><svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="3"><polyline points="20 6 9 17 4 12"/></svg></td>
<td class="check">✓</td> <td class="check"><svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="3"><polyline points="20 6 9 17 4 12"/></svg></td>
</tr> </tr>
<tr> <tr>
<td>الجدول الأسبوعي</td> <td>الجدول الأسبوعي</td>
<td class="cross">—</td> <td class="cross"><svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><line x1="5" y1="12" x2="19" y2="12"/></svg></td>
<td class="check">✓</td> <td class="check"><svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="3"><polyline points="20 6 9 17 4 12"/></svg></td>
<td class="featured-col check">✓</td> <td class="featured-col check"><svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="3"><polyline points="20 6 9 17 4 12"/></svg></td>
<td class="check">✓</td> <td class="check"><svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="3"><polyline points="20 6 9 17 4 12"/></svg></td>
</tr> </tr>
<tr> <tr>
<td>محرك التسعير الذكي</td> <td>محرك التسعير الذكي</td>
<td class="cross">—</td> <td class="cross"><svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><line x1="5" y1="12" x2="19" y2="12"/></svg></td>
<td class="cross">—</td> <td class="cross"><svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><line x1="5" y1="12" x2="19" y2="12"/></svg></td>
<td class="featured-col check">✓</td> <td class="featured-col check"><svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="3"><polyline points="20 6 9 17 4 12"/></svg></td>
<td class="check">✓</td> <td class="check"><svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="3"><polyline points="20 6 9 17 4 12"/></svg></td>
</tr> </tr>
<tr> <tr>
<td>المنشآت ونظام الحارات</td> <td>المنشآت ونظام الحارات</td>
<td class="cross">—</td> <td class="cross"><svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><line x1="5" y1="12" x2="19" y2="12"/></svg></td>
<td class="cross">—</td> <td class="cross"><svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><line x1="5" y1="12" x2="19" y2="12"/></svg></td>
<td class="featured-col check">✓</td> <td class="featured-col check"><svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="3"><polyline points="20 6 9 17 4 12"/></svg></td>
<td class="check">✓</td> <td class="check"><svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="3"><polyline points="20 6 9 17 4 12"/></svg></td>
</tr> </tr>
<tr> <tr>
<td>المخازن والمنتجات</td> <td>المخازن والمنتجات</td>
<td class="cross">—</td> <td class="cross"><svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><line x1="5" y1="12" x2="19" y2="12"/></svg></td>
<td class="cross">—</td> <td class="cross"><svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><line x1="5" y1="12" x2="19" y2="12"/></svg></td>
<td class="featured-col check">✓</td> <td class="featured-col check"><svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="3"><polyline points="20 6 9 17 4 12"/></svg></td>
<td class="check">✓</td> <td class="check"><svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="3"><polyline points="20 6 9 17 4 12"/></svg></td>
</tr> </tr>
<tr> <tr>
<td>الموارد البشرية والرواتب</td> <td>الموارد البشرية والرواتب</td>
<td class="cross">—</td> <td class="cross"><svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><line x1="5" y1="12" x2="19" y2="12"/></svg></td>
<td class="cross">—</td> <td class="cross"><svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><line x1="5" y1="12" x2="19" y2="12"/></svg></td>
<td class="featured-col check">✓</td> <td class="featured-col check"><svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="3"><polyline points="20 6 9 17 4 12"/></svg></td>
<td class="check">✓</td> <td class="check"><svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="3"><polyline points="20 6 9 17 4 12"/></svg></td>
</tr> </tr>
<tr> <tr>
<td>نقطة البيع (POS)</td> <td>نقطة البيع (POS)</td>
<td class="cross">—</td> <td class="cross"><svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><line x1="5" y1="12" x2="19" y2="12"/></svg></td>
<td class="cross">—</td> <td class="cross"><svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><line x1="5" y1="12" x2="19" y2="12"/></svg></td>
<td class="featured-col check">✓</td> <td class="featured-col check"><svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="3"><polyline points="20 6 9 17 4 12"/></svg></td>
<td class="check">✓</td> <td class="check"><svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="3"><polyline points="20 6 9 17 4 12"/></svg></td>
</tr> </tr>
<tr> <tr>
<td>إشعارات SMS</td> <td>إشعارات SMS</td>
<td class="cross">—</td> <td class="cross"><svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><line x1="5" y1="12" x2="19" y2="12"/></svg></td>
<td class="cross">—</td> <td class="cross"><svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><line x1="5" y1="12" x2="19" y2="12"/></svg></td>
<td class="featured-col check">✓</td> <td class="featured-col check"><svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="3"><polyline points="20 6 9 17 4 12"/></svg></td>
<td class="check">✓</td> <td class="check"><svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="3"><polyline points="20 6 9 17 4 12"/></svg></td>
</tr> </tr>
<tr> <tr>
<td>فروع متعددة</td> <td>فروع متعددة</td>
<td class="cross">—</td> <td class="cross"><svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><line x1="5" y1="12" x2="19" y2="12"/></svg></td>
<td class="cross">—</td> <td class="cross"><svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><line x1="5" y1="12" x2="19" y2="12"/></svg></td>
<td class="cross">—</td> <td class="cross"><svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><line x1="5" y1="12" x2="19" y2="12"/></svg></td>
<td class="check">✓</td> <td class="check"><svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="3"><polyline points="20 6 9 17 4 12"/></svg></td>
</tr> </tr>
<tr> <tr>
<td>تطبيقات موبايل</td> <td>تطبيقات موبايل</td>
<td class="cross">—</td> <td class="cross"><svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><line x1="5" y1="12" x2="19" y2="12"/></svg></td>
<td class="cross">—</td> <td class="cross"><svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><line x1="5" y1="12" x2="19" y2="12"/></svg></td>
<td class="cross">—</td> <td class="cross"><svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><line x1="5" y1="12" x2="19" y2="12"/></svg></td>
<td class="check">✓</td> <td class="check"><svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="3"><polyline points="20 6 9 17 4 12"/></svg></td>
</tr> </tr>
<tr> <tr>
<td>API وتكاملات خارجية</td> <td>API وتكاملات خارجية</td>
<td class="cross">—</td> <td class="cross"><svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><line x1="5" y1="12" x2="19" y2="12"/></svg></td>
<td class="cross">—</td> <td class="cross"><svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><line x1="5" y1="12" x2="19" y2="12"/></svg></td>
<td class="cross">—</td> <td class="cross"><svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><line x1="5" y1="12" x2="19" y2="12"/></svg></td>
<td class="check">✓</td> <td class="check"><svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="3"><polyline points="20 6 9 17 4 12"/></svg></td>
</tr> </tr>
<tr> <tr>
<td>مدير حساب مخصص</td> <td>مدير حساب مخصص</td>
<td class="cross">—</td> <td class="cross"><svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><line x1="5" y1="12" x2="19" y2="12"/></svg></td>
<td class="cross">—</td> <td class="cross"><svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><line x1="5" y1="12" x2="19" y2="12"/></svg></td>
<td class="cross">—</td> <td class="cross"><svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><line x1="5" y1="12" x2="19" y2="12"/></svg></td>
<td class="check">✓</td> <td class="check"><svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="3"><polyline points="20 6 9 17 4 12"/></svg></td>
</tr> </tr>
</tbody> </tbody>
</table> </table>
......
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