| | <!DOCTYPE html> |
| | <html lang="ar" dir="rtl"> |
| | <head> |
| | <meta charset="UTF-8"> |
| | <meta name="viewport" content="width=device-width, initial-scale=1.0"> |
| | <title>قطع غيار - منصة قطع غيار السيارات الأولى</title> |
| | <link href="https://cdn.tailwindcss.com" rel="stylesheet"> |
| | <link href="https://unpkg.com/aos@2.3.1/dist/aos.css" rel="stylesheet"> |
| | <script src="https://unpkg.com/feather-icons"></script> |
| | <script src="https://cdn.jsdelivr.net/npm/vanta@latest/dist/vanta.globe.min.js"></script> |
| | <style> |
| | @import url('https://fonts.googleapis.com/css2?family=Tajawal:wght@300;400;500;700&display=swap'); |
| | body { font-family: 'Tajawal', sans-serif; } |
| | .hero-bg { background: linear-gradient(135deg, #0c4a6e 0%, #0284c7 100%); } |
| | .feature-card { transition: all 0.3s ease; } |
| | .feature-card:hover { transform: translateY(-5px); box-shadow: 0 10px 25px rgba(0,0,0,0.1); } |
| | .car-pattern { background-image: url("data:image/svg+xml,%3Csvg width='100' height='100' viewBox='0 0 100 100' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M11 18c3.866 0 7-3.134 7-7s-3.134-7-7-7-7 3.134-7 7 3.134 7 7 7zm48 25c3.866 0 7-3.134 7-7s-3.134-7-7-7-7 3.134-7 7 3.134 7 7 7zm-43-7c1.657 0 3-1.343 3-3s-1.343-3-3-3-3 1.343-3 3 1.343 3 3 3zm63 31c1.657 0 3-1.343 3-3s-1.343-3-3-3-3 1.343-3 3 1.343 3 3 3zM34 90c1.657 0 3-1.343 3-3s-1.343-3-3-3-3 1.343-3 3 1.343 3 3 3zm56-76c1.657 0 3-1.343 3-3s-1.343-3-3-3-3 1.343-3 3 1.343 3 3 3zM12 86c2.21 0 4-1.79 4-4s-1.79-4-4-4-4 1.79-4 4 1.79 4 4 4zm28-65c2.21 0 4-1.79 4-4s-1.79-4-4-4-4 1.79-4 4 1.79 4 4 4zm23-11c2.76 0 5-2.24 5-5s-2.24-5-5-5-5 2.24-5 5 2.24 5 5 5zm-6 60c2.21 0 4-1.79 4-4s-1.79-4-4-4-4 1.79-4 4 1.79 4 4 4zm29 22c2.76 0 5-2.24 5-5s-2.24-5-5-5-5 2.24-5 5 2.24 5 5 5zM32 63c2.76 0 5-2.24 5-5s-2.24-5-5-5-5 2.24-5 5 2.24 5 5 5zm57-13c2.76 0 5-2.24 5-5s-2.24-5-5-5-5 2.24-5 5 2.24 5 5 5zm-9-21c1.105 0 2-.895 2-2s-.895-2-2-2-2 .895-2 2 .895 2 2 2zM60 91c1.105 0 2-.895 2-2s-.895-2-2-2-2 .895-2 2 .895 2 2 2zM35 41c1.105 0 2-.895 2-2s-.895-2-2-2-2 .895-2 2 .895 2 2 2zM12 60c1.105 0 2-.895 2-2s-.895-2-2-2-2 .895-2 2 .895 2 2 2z' fill='%230284c7' fill-opacity='0.05' fill-rule='evenodd'/%3E%3C/svg%3E"); } |
| | </style> |
| | </head> |
| | <body class="bg-gray-50"> |
| | |
| | <div id="hero" class="hero-bg text-white"> |
| | <div class="container mx-auto px-4 py-16 md:py-28"> |
| | <div class="grid grid-cols-1 md:grid-cols-2 gap-10 items-center"> |
| | <div data-aos="fade-right"> |
| | <h1 class="text-4xl md:text-6xl font-bold mb-4">توصيل قطع غيار السيارة في أسرع وقت</h1> |
| | <p class="text-xl mb-8 opacity-90">منصة واحدة تجمع الموردين والعملاء لتبسيط شراء قطع غيار السيارات بالجملة والتجزئة</p> |
| | <div class="flex flex-wrap gap-4"> |
| | <button class="bg-orange-500 hover:bg-orange-600 text-white font-bold py-3 px-8 rounded-full text-lg transition duration-300">أبدأ البيع الآن</button> |
| | <button class="bg-white text-blue-900 hover:bg-blue-100 font-bold py-3 px-8 rounded-full text-lg border border-blue-200 transition duration-300">تصفح القطع</button> |
| | </div> |
| | </div> |
| | <div data-aos="fade-left" class="relative"> |
| | <div class="relative z-10"> |
| | <div class="bg-white rounded-xl shadow-xl p-6 transform rotate-3"> |
| | <div class="flex items-center mb-4"> |
| | <div class="flex-shrink-0 h-14 w-14 rounded-full bg-blue-100 flex items-center justify-center"> |
| | <i data-feather="user" class="text-blue-600"></i> |
| | </div> |
| | <div class="mr-3"> |
| | <p class="font-bold">محمد الورشة</p> |
| | <p class="text-gray-500 text-sm">ميكانيكي - الرياض</p> |
| | </div> |
| | </div> |
| | <div class="bg-gray-100 rounded-lg p-4 mb-4"> |
| | <p class="text-blue-900 font-medium">تويوتا كامري 2015 - حساس الأكسجين</p> |
| | <div class="flex items-center mt-2"> |
| | <span class="bg-green-100 text-green-800 text-xs px-2 py-1 rounded-full">تم التوصيل</span> |
| | <span class="text-gray-500 text-sm mr-2">الرياض - 35 دقيقة</span> |
| | </div> |
| | </div> |
| | <div class="flex items-center justify-between"> |
| | <p class="font-bold text-blue-900">275 ريال</p> |
| | <div class="flex"> |
| | <i data-feather="star" class="text-yellow-400 fill-current"></i> |
| | <i data-feather="star" class="text-yellow-400 fill-current"></i> |
| | <i data-feather="star" class="text-yellow-400 fill-current"></i> |
| | <i data-feather="star" class="text-yellow-400 fill-current"></i> |
| | <i data-feather="star" class="text-gray-300"></i> |
| | </div> |
| | </div> |
| | </div> |
| | <div class="absolute -bottom-4 -left-4 bg-white rounded-xl shadow-xl p-6 transform -rotate-2 w-10/12"> |
| | <div class="flex items-center"> |
| | <i data-feather="map-pin" class="text-blue-600 mr-2"></i> |
| | <span class="text-blue-900 font-medium">علي حسين</span> |
| | <span class="bg-blue-100 text-blue-800 text-xs px-2 py-1 rounded-full mr-2">بائع</span> |
| | </div> |
| | <p class="text-gray-500 text-sm mt-2">مستودع 123 - قطع غيار تويوتا</p> |
| | <div class="mt-4"> |
| | <p class="text-gray-500 text-sm">طلب جديد:</p> |
| | <p class="font-medium">6 قطع لمحرك كامري 2020</p> |
| | </div> |
| | </div> |
| | </div> |
| | </div> |
| | </div> |
| | </div> |
| | </div> |
| |
|
| | |
| | <div class="py-12 bg-white"> |
| | <div class="container mx-auto px-4"> |
| | <h2 class="text-2xl font-bold text-center mb-12">أبرز العلامات التجارية</h2> |
| | <div class="grid grid-cols-2 md:grid-cols-4 lg:grid-cols-6 gap-8"> |
| | <div class="flex flex-col items-center p-4"> |
| | <div class="bg-gray-200 border-2 border-dashed rounded-xl w-16 h-16" /> |
| | <span class="mt-3 font-medium">تويوتا</span> |
| | </div> |
| | <div class="flex flex-col items-center p-4"> |
| | <div class="bg-gray-200 border-2 border-dashed rounded-xl w-16 h-16" /> |
| | <span class="mt-3 font-medium">نيسان</span> |
| | </div> |
| | <div class="flex flex-col items-center p-4"> |
| | <div class="bg-gray-200 border-2 border-dashed rounded-xl w-16 h-16" /> |
| | <span class="mt-3 font-medium">هيونداي</span> |
| | </div> |
| | <div class="flex flex-col items-center p-4"> |
| | <div class="bg-gray-200 border-2 border-dashed rounded-xl w-16 h-16" /> |
| | <span class="mt-3 font-medium">مرسيدس</span> |
| | </div> |
| | <div class="flex flex-col items-center p-4"> |
| | <div class="bg-gray-200 border-2 border-dashed rounded-xl w-16 h-16" /> |
| | <span class="mt-3 font-medium">BMW</span> |
| | </div> |
| | <div class="flex flex-col items-center p-4"> |
| | <div class="bg-gray-200 border-2 border-dashed rounded-xl w-16 h-16" /> |
| | <span class="mt-3 font-medium">شيفروليه</span> |
| | </div> |
| | </div> |
| | </div> |
| | </div> |
| |
|
| | |
| | <div class="py-20 bg-blue-50 car-pattern"> |
| | <div class="container mx-auto px-4"> |
| | <div class="text-center mb-16"> |
| | <h2 class="text-3xl font-bold text-blue-900">خدماتنا المميزة</h2> |
| | <p class="text-blue-700 max-w-2xl mx-auto mt-4">منصة قطع غيار توفر كل ما تحتاجه في مكان واحد</p> |
| | </div> |
| | |
| | <div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-4 gap-8"> |
| | <div data-aos="zoom-in" class="feature-card bg-white rounded-xl shadow-md overflow-hidden"> |
| | <div class="p-6"> |
| | <div class="w-16 h-16 rounded-full bg-blue-100 flex items-center justify-center mb-6"> |
| | <i data-feather="search" class="text-blue-600 w-8 h-8"></i> |
| | </div> |
| | <h3 class="text-xl font-bold mb-3 text-blue-900">بحث متقدم</h3> |
| | <p class="text-gray-600">ابحث برقم القطعة، الماركة، الموديل أو الوصف. استخدم فلاتر متقدمة للعثور على ما تريده بالضبط</p> |
| | </div> |
| | </div> |
| | |
| | <div data-aos="zoom-in" data-aos-delay="150" class="feature-card bg-white rounded-xl shadow-md overflow-hidden"> |
| | <div class="p-6"> |
| | <div class="w-16 h-16 rounded-full bg-blue-100 flex items-center justify-center mb-6"> |
| | <i data-feather="shopping-cart" class="text-blue-600 w-8 h-8"></i> |
| | </div> |
| | <h3 class="text-xl font-bold mb-3 text-blue-900">سلة متعددة الموردين</h3> |
| | <p class="text-gray-600">أضف منتجات من عدة بائعين في سلة واحدة وادفع دفعة واحدة فقط مع توصيل موحد</p> |
| | </div> |
| | </div> |
| | |
| | <div data-aos="zoom-in" data-aos-delay="300" class="feature-card bg-white rounded-xl shadow-md overflow-hidden"> |
| | <div class="p-6"> |
| | <div class="w-16 h-16 rounded-full bg-blue-100 flex items-center justify-center mb-6"> |
| | <i data-feather="truck" class="text-blue-600 w-8 h-8"></i> |
| | </div> |
| | <h3 class="text-xl font-bold mb-3 text-blue-900">توصيل سريع</h3> |
| | <p class="text-gray-600">خدمة التوصيل السريع خلال 60 دقيقة في المدن الكبرى مع تتبع حي لموقع الموظف</p> |
| | </div> |
| | </div> |
| | |
| | <div data-aos="zoom-in" data-aos-delay="450" class="feature-card bg-white rounded-xl shadow-md overflow-hidden"> |
| | <div class="p-6"> |
| | <div class="w-16 h-16 rounded-full bg-blue-100 flex items-center justify-center mb-6"> |
| | <i data-feather="file-text" class="text-blue-600 w-8 h-8"></i> |
| | </div> |
| | <h3 class="text-xl font-bold mb-3 text-blue-900">طلب عرض سعر</h3> |
| | <p class="text-gray-600">احصل على عروض أسعار من مزودين متعددين لقطع الغيار غير المتوفرة بالسوق</p> |
| | </div> |
| | </div> |
| | </div> |
| | |
| | <div class="mt-16 text-center"> |
| | <button class="bg-blue-700 hover:bg-blue-800 text-white font-medium py-3 px-8 rounded-lg transition duration-300 flex items-center justify-center mx-auto"> |
| | اكتشف جميع الميزات |
| | <i data-feather="arrow-left" class="mr-2"></i> |
| | </button> |
| | </div> |
| | </div> |
| | </div> |
| |
|
| | |
| | <div class="py-20 bg-white"> |
| | <div class="container mx-auto px-4"> |
| | <h2 class="text-3xl font-bold text-center mb-16">كيف يعمل التطبيق؟</h2> |
| | |
| | <div class="flex flex-col lg:flex-row"> |
| | |
| | <div class="lg:w-1/2 mb-16 lg:mb-0 lg:pr-16"> |
| | <div class="bg-blue-50 p-6 rounded-lg mb-8"> |
| | <div class="flex items-center mb-4"> |
| | <div class="w-10 h-10 rounded-full bg-blue-700 text-white flex items-center justify-center font-bold">1</div> |
| | <h3 class="text-xl font-bold mr-3 text-blue-900">للمشتري</h3> |
| | </div> |
| | <p class="text-gray-600 mb-4">سجل حساب جديد كمشتري في خطوات بسيطة</p> |
| | <div class="flex"> |
| | <span class="inline-block bg-green-500 rounded-full px-3 py-1 text-sm font-semibold text-white mr-2">ورشة</span> |
| | <span class="inline-block bg-green-500 rounded-full px-3 py-1 text-sm font-semibold text-white mr-2">ميكانيكي</span> |
| | <span class="inline-block bg-green-500 rounded-full px-3 py-1 text-sm font-semibold text-white">فرد</span> |
| | </div> |
| | </div> |
| | |
| | <div class="flex mb-8"> |
| | <div class="w-10 h-10 rounded-full bg-blue-700 text-white flex items-center justify-center font-bold flex-shrink-0">2</div> |
| | <div class="mr-3"> |
| | <h4 class="font-bold text-blue-900 mb-2">ابحث أو تصفح القطع</h4> |
| | <p class="text-gray-600">استخدم محرك البحث المتقدم أو تصفح الأقسام حسب نوع السيارة</p> |
| | </div> |
| | </div> |
| | |
| | <div class="flex mb-8"> |
| | <div class="w-10 h-10 rounded-full bg-blue-700 text-white flex items-center justify-center font-bold flex-shrink-0">3</div> |
| | <div class="mr-3"> |
| | <h4 class="font-bold text-blue-900 mb-2">أطلب القطع</h4> |
| | <p class="text-gray-600">أضف القطع لسلة مشترياتك واختر خيار التوصيل المفضل</p> |
| | </div> |
| | </div> |
| | |
| | <div class="flex"> |
| | <div class="w-10 h-10 rounded-full bg-blue-700 text-white flex items-center justify-center font-bold flex-shrink-0">4</div> |
| | <div class="mr-3"> |
| | <h4 class="font-bold text-blue-900 mb-2">تتبع واستلم طلبك</h4> |
| | <p class="text-gray-600">تتبع طلبك على الخريطة واستلم القطع مع دفع نقداً عند الاستلام</p> |
| | </div> |
| | </div> |
| | </div> |
| | |
| | |
| | <div class="lg:w-1/2 lg:pl-16"> |
| | <div class="bg-orange-50 p-6 rounded-lg mb-8"> |
| | <div class="flex items-center mb-4"> |
| | <div class="w-10 h-10 rounded-full bg-orange-600 text-white flex items-center justify-center font-bold">1</div> |
| | <h3 class="text-xl font-bold mr-3 text-orange-900">للبائع</h3> |
| | </div> |
| | <p class="text-gray-600 mb-4">سجل حساب جديد كبائع من خلال تقديم وثائق المتجر</p> |
| | <div class="flex"> |
| | <span class="inline-block bg-orange-500 rounded-full px-3 py-1 text-sm font-semibold text-white mr-2">مستورد</span> |
| | <span class="inline-block bg-orange-500 rounded-full px-3 py-1 text-sm font-semibold text-white">تاجر جملة</span> |
| | </div> |
| | </div> |
| | |
| | <div class="flex mb-8"> |
| | <div class="w-10 h-10 rounded-full bg-orange-600 text-white flex items-center justify-center font-bold flex-shrink-0">2</div> |
| | <div class="mr-3"> |
| | <h4 class="font-bold text-orange-900 mb-2">أضف المنتجات</h4> |
| | <p class="text-gray-600">أضف قطع الغيار مع كافة التفاصيل وصور عالية الجودة</p> |
| | </div> |
| | </div> |
| | |
| | <div class="flex mb-8"> |
| | <div class="w-10 h-10 rounded-full bg-orange-600 text-white flex items-center justify-center font-bold flex-shrink-0">3</div> |
| | <div class="mr-3"> |
| | <h4 class="font-bold text-orange-900 mb-2">ادفع المخزون</h4> |
| | <p class="text-gray-600">استقبل الطلبات وصدرها وتتبع إدارة المخزون بشكل آلي</p> |
| | </div> |
| | </div> |
| | |
| | <div class="flex"> |
| | <div class="w-10 h-10 rounded-full bg-orange-600 text-white flex items-center justify-center font-bold flex-shrink-0">4</div> |
| | <div class="mr-3"> |
| | <h4 class="font-bold text-orange-900 mb-2">وسع عملك</h4> |
| | <p class="text-gray-600">احصل على تقييمات وتوسع قاعدة عملائك وبيع الجملة</p> |
| | </div> |
| | </div> |
| | </div> |
| | </div> |
| | </div> |
| | </div> |
| |
|
| | |
| | <div class="py-20 bg-gradient-to-r from-blue-900 to-blue-700 text-white"> |
| | <div class="container mx-auto px-4"> |
| | <div class="grid grid-cols-1 md:grid-cols-2 gap-10 items-center"> |
| | <div data-aos="fade-right"> |
| | <h2 class="text-3xl font-bold mb-6">حمّل تطبيق قطع غيار الآن</h2> |
| | <p class="mb-8 opacity-90">استمتع بتجربة شراء وبيع قطع غيار السيارات من خلال تطبيقنا الأسرع والأسهل للاستخدام</p> |
| | |
| | <div class="grid grid-cols-2 gap-4 max-w-md"> |
| | <a href="#" class="bg-black hover:bg-gray-900 py-3 px-4 rounded-lg flex items-center justify-center transition duration-300"> |
| | <div class="mr-3"> |
| | <i data-feather="smartphone" class="w-5 h-5"></i> |
| | </div> |
| | <div> |
| | <div class="text-xs opacity-80">تحميل من</div> |
| | <div class="font-semibold">Apple Store</div> |
| | </div> |
| | </a> |
| | <a href="#" class="bg-black hover:bg-gray-900 py-3 px-4 rounded-lg flex items-center justify-center transition duration-300"> |
| | <div class="mr-3"> |
| | <i data-feather="smartphone" class="w-5 h-5"></i> |
| | </div> |
| | <div> |
| | <div class="text-xs opacity-80">تحميل من</div> |
| | <div class="font-semibold">Google Play</div> |
| | </div> |
| | </a> |
| | </div> |
| | </div> |
| | |
| | <div data-aos="fade-left" class="flex justify-center"> |
| | <div class="relative"> |
| | <div class="absolute top-0 -right-10 w-80 h-96 bg-blue-800 rounded-3xl opacity-50 z-0"></div> |
| | <div class="w-64 bg-white text-gray-800 rounded-2xl shadow-xl z-10 relative p-4"> |
| | <div class="flex items-center justify-between mb-4"> |
| | <div class="text-lg font-bold text-blue-900">قطع غيار</div> |
| | <div class="text-xs text-gray-500">٢:٤٠ م</div> |
| | </div> |
| | |
| | <div class="space-y-4"> |
| | <div class="bg-blue-50 rounded-lg p-3"> |
| | <div class="flex items-center"> |
| | <div class="bg-gray-300 border-2 border-dashed rounded-xl w-16 h-16" /> |
| | <div class="mr-3"> |
| | <div class="font-medium">حساس الأكسجين تويوتا</div> |
| | <div class="text-sm text-green-600">متوفر بالتوصيل</div> |
| | <div class="text-sm">275 ريال</div> |
| | </div> |
| | </div> |
| | </div> |
| | |
| | <div class="bg-blue-50 rounded-lg p-3"> |
| | <div class="flex"> |
| | <div class="mr-3"> |
| | <div class="font-medium">سعيد محمد</div> |
| | <div class="text-xs text-gray-500">الرياض - 12 دقيقة</div> |
| | </div> |
| | <div class="ml-auto"> |
| | <i data-feather="map-pin" class="text-blue-600"></i> |
| | </div> |
| | </div> |
| | <div class="h-2 bg-gray-200 rounded-full mt-2 overflow-hidden"> |
| | <div class="h-full bg-blue-600 rounded-full" style="width: 70%"></div> |
| | </div> |
| | </div> |
| | </div> |
| | |
| | <div class="flex justify-around mt-6 pt-4 border-t border-gray-200"> |
| | <button class="text-gray-500"> |
| | <i data-feather="home"></i> |
| | </button> |
| | <button class="text-blue-600"> |
| | <i data-feather="shopping-bag"></i> |
| | </button> |
| | <button class="text-gray-500"> |
| | <i data-feather="map"></i> |
| | </button> |
| | <button class="text-gray-500"> |
| | <i data-feather="user"></i> |
| | </button> |
| | </div> |
| | </div> |
| | </div> |
| | </div> |
| | </div> |
| | </div> |
| | </div> |
| |
|
| | |
| | <footer class="bg-blue-900 text-white pt-16 pb-8"> |
| | <div class="container mx-auto px-4"> |
| | <div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-4 gap-8 mb-12"> |
| | <div> |
| | <h3 class="text-2xl font-bold mb-4">قطع غيار</h3> |
| | <p class="mb-4 opacity-80">المنصة الأولى لبيع وشراء قطع غيار السيارات بالوطن العربي</p> |
| | <div class="flex space-x-4"> |
| | <a href="#" class="bg-blue-800 hover:bg-blue-700 rounded-full p-2 transition"> |
| | <i data-feather="facebook" class="w-5 h-5"></i> |
| | </a> |
| | <a href="#" class="bg-blue-800 hover:bg-blue-700 rounded-full p-2 transition"> |
| | <i data-feather="twitter" class="w-5 h-5"></i> |
| | </a> |
| | <a href="#" class="bg-blue-800 hover:bg-blue-700 rounded-full p-2 transition"> |
| | <i data-feather="instagram" class="w-5 h-5"></i> |
| | </a> |
| | <a href="#" class="bg-blue-800 hover:bg-blue-700 rounded-full p-2 transition"> |
| | <i data-feather="linkedin" class="w-5 h-5"></i> |
| | </a> |
| | </div> |
| | </div> |
| | |
| | <div> |
| | <h4 class="text-lg font-bold mb-4">روابط سريعة</h4> |
| | <ul class="space-y-3"> |
| | <li><a href="#" class="opacity-80 hover:opacity-100 transition">الصفحة الرئيسية</a></li> |
| | <li><a href="#" class="opacity-80 hover:opacity-100 transition">كيف يعمل</a></li> |
| | <li><a href="#" class="opacity-80 hover:opacity-100 transition">تسجيل بائع</a></li> |
| | <li><a href="#" class="opacity-80 hover:opacity-100 transition">تسجيل مشتري</a></li> |
| | <li><a href="#" class="opacity-80 hover:opacity-100 transition">طلب دعم</a></li> |
| | </ul> |
| | </div> |
| | |
| | <div> |
| | <h4 class="text-lg font-bold mb-4">المنتجات</h4> |
| | <ul class="space-y-3"> |
| | <li><a href="#" class="opacity-80 hover:opacity-100 transition">المحرك</a></li> |
| | <li><a href="#" class="opacity-80 hover:opacity-100 transition">نظام الكهرباء</a></li> |
| | <li><a href="#" class="opacity-80 hover:opacity-100 transition">نظام التبريد</a></li> |
| | <li><a href="#" class="opacity-80 hover:opacity-100 transition">نظام الفرامل</a></li> |
| | <li><a href="#" class="opacity-80 hover:opacity-100 transition">العجلات والإطارات</a></li> |
| | </ul> |
| | </div> |
| | |
| | <div> |
| | <h4 class="text-lg font-bold mb-4">اتصل بنا</h4> |
| | <ul class="space-y-3"> |
| | <li class="flex items-center opacity-80"> |
| | <i data-feather="mail" class="w-4 h-4 mr-2"></i> |
| | <span>info@qitaa.com</span> |
| | </li> |
| | <li class="flex items-center opacity-80"> |
| | <i data-feather="phone" class="w-4 h-4 mr-2"></i> |
| | <span>+966 11 123 4567</span> |
| | </li> |
| | <li class="flex items-center opacity-80"> |
| | <i data-feather="map-pin" class="w-4 h-4 mr-2"></i> |
| | <span>الرياض، المملكة العربية السعودية</span> |
| | </li> |
| | </ul> |
| | </div> |
| | </div> |
| | |
| | <div class="pt-8 border-t border-blue-800"> |
| | <div class="flex flex-col md:flex-row justify-between items-center"> |
| | <p class="opacity-80 mb-4 md:mb-0">© 2023 تطبيق قطع غيار. جميع الحقوق محفوظة.</p> |
| | <div class="flex space-x-6"> |
| | <a href="#" class="opacity-80 hover:opacity-100 transition">الشروط والأحكام</a> |
| | <a href="#" class="opacity-80 hover:opacity-100 transition">سياسة الخصوصية</a> |
| | </div> |
| | </div> |
| | </div> |
| | </div> |
| | </footer> |
| |
|
| | <script> |
| | feather.replace(); |
| | AOS.init({ |
| | duration: 1000, |
| | offset: 120, |
| | easing: 'ease', |
| | once: true |
| | }); |
| | |
| | |
| | VANTA.GLOBE({ |
| | el: "#hero", |
| | mouseControls: true, |
| | touchControls: true, |
| | gyroControls: false, |
| | minHeight: 200.00, |
| | minWidth: 200.00, |
| | scale: 1.00, |
| | scaleMobile: 1.00, |
| | color: 0x5d9aff, |
| | color2: 0xd4efff, |
| | size: 0.7, |
| | backgroundColor: 0x0c4a6e |
| | }); |
| | </script> |
| | <script src="https://unpkg.com/aos@2.3.1/dist/aos.js"></script> |
| | </body> |
| | </html> |
| |
|
