Spaces:
Running
Running
انشئ Giedo Group يقوم بإدارة 3شركات في مصر يعمل علي اضافه 1GIEDO Digital Mall اكبر مول الكتروني في مصر يعمل علي اضافه التجار والبايعين الي المول الالكتروني الذين يريدون بيع منتجات لهم واضافه هذا صفحه خاصه لكل تاجر له صفحه داش بورد خاصه له يعرض 2 Giedo Digital Marketing اكبر شركه دعاية واعلان وتسويق وتجارة الكترونيه وبها اعلانات مبوبة وجميع خدمات سوشيال ميديا ودعاية عاليه الجوده واريد ان تربط كل هذا بإدارة صفحه داش بورد خاصه لي تقوم بإدارة الإدارة
Browse files- digital-mall.html +287 -0
- giedo-group.html +114 -28
- index.html +16 -16
- vendor-dashboard.html +513 -0
digital-mall.html
ADDED
|
@@ -0,0 +1,287 @@
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
| 1 |
+
<!DOCTYPE html>
|
| 2 |
+
<html lang="en">
|
| 3 |
+
<head>
|
| 4 |
+
<meta charset="UTF-8">
|
| 5 |
+
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
| 6 |
+
<title>GIEDO Digital Mall - Egypt's Largest E-Marketplace</title>
|
| 7 |
+
<script src="https://cdn.tailwindcss.com"></script>
|
| 8 |
+
<script src="https://unpkg.com/feather-icons"></script>
|
| 9 |
+
<style>
|
| 10 |
+
.gradient-text {
|
| 11 |
+
background: linear-gradient(90deg, #3b82f6, #8b5cf6, #ec4899);
|
| 12 |
+
-webkit-background-clip: text;
|
| 13 |
+
background-clip: text;
|
| 14 |
+
color: transparent;
|
| 15 |
+
}
|
| 16 |
+
.card-hover {
|
| 17 |
+
transition: all 0.3s ease;
|
| 18 |
+
}
|
| 19 |
+
.card-hover:hover {
|
| 20 |
+
transform: translateY(-5px);
|
| 21 |
+
box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04);
|
| 22 |
+
}
|
| 23 |
+
.vendor-card {
|
| 24 |
+
background: linear-gradient(135deg, rgba(59, 130, 246, 0.1), rgba(139, 92, 246, 0.1));
|
| 25 |
+
}
|
| 26 |
+
</style>
|
| 27 |
+
</head>
|
| 28 |
+
<body class="min-h-screen bg-gradient-to-br from-gray-900 to-gray-800 text-white overflow-x-hidden">
|
| 29 |
+
<header class="relative z-10">
|
| 30 |
+
<nav class="container mx-auto px-6 py-6 flex justify-between items-center">
|
| 31 |
+
<a href="index.html" class="text-2xl font-bold gradient-text">GIEDO Digital Mall</a>
|
| 32 |
+
<div class="hidden md:flex space-x-8">
|
| 33 |
+
<a href="giedo-group.html" class="hover:text-purple-300 transition-colors">Home</a>
|
| 34 |
+
<a href="#" class="hover:text-purple-300 transition-colors">Categories</a>
|
| 35 |
+
<a href="#" class="hover:text-purple-300 transition-colors">Vendors</a>
|
| 36 |
+
<a href="vendor-dashboard.html" class="hover:text-purple-300 transition-colors">Vendor Dashboard</a>
|
| 37 |
+
</div>
|
| 38 |
+
<div class="flex items-center space-x-4">
|
| 39 |
+
<button class="p-2 rounded-full bg-gray-800 hover:bg-gray-700">
|
| 40 |
+
<i data-feather="shopping-cart"></i>
|
| 41 |
+
</button>
|
| 42 |
+
<button class="p-2 rounded-full bg-gray-800 hover:bg-gray-700">
|
| 43 |
+
<i data-feather="user"></i>
|
| 44 |
+
</button>
|
| 45 |
+
<button class="md:hidden">
|
| 46 |
+
<i data-feather="menu"></i>
|
| 47 |
+
</button>
|
| 48 |
+
</div>
|
| 49 |
+
</nav>
|
| 50 |
+
</header>
|
| 51 |
+
|
| 52 |
+
<main class="relative z-10 container mx-auto px-6 py-8">
|
| 53 |
+
<!-- Hero Section -->
|
| 54 |
+
<section class="relative rounded-2xl overflow-hidden mb-12">
|
| 55 |
+
<div class="absolute inset-0 bg-gradient-to-r from-purple-900/70 to-blue-900/70"></div>
|
| 56 |
+
<img src="http://static.photos/retail/1200x630/1" alt="Digital Mall" class="w-full h-96 object-cover">
|
| 57 |
+
<div class="absolute inset-0 flex flex-col justify-center px-12">
|
| 58 |
+
<h1 class="text-4xl md:text-5xl font-bold mb-4">Egypt's Largest Electronic Marketplace</h1>
|
| 59 |
+
<p class="text-xl text-gray-300 mb-8 max-w-2xl">Connect with thousands of vendors and discover millions of products across all categories</p>
|
| 60 |
+
<div class="flex flex-col sm:flex-row gap-4">
|
| 61 |
+
<a href="vendor-registration.html" class="px-8 py-3 bg-gradient-to-r from-purple-600 to-blue-500 rounded-full font-semibold hover:opacity-90 transition-opacity text-center">
|
| 62 |
+
Become a Vendor
|
| 63 |
+
</a>
|
| 64 |
+
<a href="#featured" class="px-8 py-3 border border-gray-600 rounded-full font-semibold hover:bg-gray-800 transition-colors text-center">
|
| 65 |
+
Browse Products
|
| 66 |
+
</a>
|
| 67 |
+
</div>
|
| 68 |
+
</div>
|
| 69 |
+
</section>
|
| 70 |
+
|
| 71 |
+
<!-- Categories Section -->
|
| 72 |
+
<section class="mb-16">
|
| 73 |
+
<h2 class="text-3xl font-bold mb-8 gradient-text">Shop by Category</h2>
|
| 74 |
+
<div class="grid grid-cols-2 md:grid-cols-4 lg:grid-cols-6 gap-4">
|
| 75 |
+
<a href="#" class="bg-gray-800/50 rounded-lg p-4 text-center card-hover">
|
| 76 |
+
<div class="w-16 h-16 bg-purple-600/20 rounded-full flex items-center justify-center mx-auto mb-3">
|
| 77 |
+
<i data-feather="smartphone" class="text-purple-400"></i>
|
| 78 |
+
</div>
|
| 79 |
+
<h3 class="font-medium">Electronics</h3>
|
| 80 |
+
</a>
|
| 81 |
+
<a href="#" class="bg-gray-800/50 rounded-lg p-4 text-center card-hover">
|
| 82 |
+
<div class="w-16 h-16 bg-blue-600/20 rounded-full flex items-center justify-center mx-auto mb-3">
|
| 83 |
+
<i data-feather="tshirt" class="text-blue-400"></i>
|
| 84 |
+
</div>
|
| 85 |
+
<h3 class="font-medium">Fashion</h3>
|
| 86 |
+
</a>
|
| 87 |
+
<a href="#" class="bg-gray-800/50 rounded-lg p-4 text-center card-hover">
|
| 88 |
+
<div class="w-16 h-16 bg-pink-600/20 rounded-full flex items-center justify-center mx-auto mb-3">
|
| 89 |
+
<i data-feather="home" class="text-pink-400"></i>
|
| 90 |
+
</div>
|
| 91 |
+
<h3 class="font-medium">Home</h3>
|
| 92 |
+
</a>
|
| 93 |
+
<a href="#" class="bg-gray-800/50 rounded-lg p-4 text-center card-hover">
|
| 94 |
+
<div class="w-16 h-16 bg-green-600/20 rounded-full flex items-center justify-center mx-auto mb-3">
|
| 95 |
+
<i data-feather="shopping-bag" class="text-green-400"></i>
|
| 96 |
+
</div>
|
| 97 |
+
<h3 class="font-medium">Supermarket</h3>
|
| 98 |
+
</a>
|
| 99 |
+
<a href="#" class="bg-gray-800/50 rounded-lg p-4 text-center card-hover">
|
| 100 |
+
<div class="w-16 h-16 bg-yellow-600/20 rounded-full flex items-center justify-center mx-auto mb-3">
|
| 101 |
+
<i data-feather="heart" class="text-yellow-400"></i>
|
| 102 |
+
</div>
|
| 103 |
+
<h3 class="font-medium">Beauty</h3>
|
| 104 |
+
</a>
|
| 105 |
+
<a href="#" class="bg-gray-800/50 rounded-lg p-4 text-center card-hover">
|
| 106 |
+
<div class="w-16 h-16 bg-red-600/20 rounded-full flex items-center justify-center mx-auto mb-3">
|
| 107 |
+
<i data-feather="activity" class="text-red-400"></i>
|
| 108 |
+
</div>
|
| 109 |
+
<h3 class="font-medium">Health</h3>
|
| 110 |
+
</a>
|
| 111 |
+
</div>
|
| 112 |
+
</section>
|
| 113 |
+
|
| 114 |
+
<!-- Featured Vendors -->
|
| 115 |
+
<section class="mb-16" id="featured">
|
| 116 |
+
<div class="flex justify-between items-center mb-8">
|
| 117 |
+
<h2 class="text-3xl font-bold gradient-text">Featured Vendors</h2>
|
| 118 |
+
<a href="#" class="text-purple-300 hover:text-purple-200 flex items-center">
|
| 119 |
+
View All <i data-feather="chevron-right" class="ml-1"></i>
|
| 120 |
+
</a>
|
| 121 |
+
</div>
|
| 122 |
+
<div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-6">
|
| 123 |
+
<!-- Vendor 1 -->
|
| 124 |
+
<div class="vendor-card rounded-xl p-6 card-hover">
|
| 125 |
+
<div class="flex items-start mb-4">
|
| 126 |
+
<img src="http://static.photos/retail/200x200/1" alt="Vendor Logo" class="w-16 h-16 rounded-full object-cover mr-4">
|
| 127 |
+
<div>
|
| 128 |
+
<h3 class="text-xl font-bold">Tech Haven</h3>
|
| 129 |
+
<div class="flex items-center mt-1">
|
| 130 |
+
<div class="flex text-yellow-400">
|
| 131 |
+
<i data-feather="star" class="w-4 h-4 fill-current"></i>
|
| 132 |
+
<i data-feather="star" class="w-4 h-4 fill-current"></i>
|
| 133 |
+
<i data-feather="star" class="w-4 h-4 fill-current"></i>
|
| 134 |
+
<i data-feather="star" class="w-4 h-4 fill-current"></i>
|
| 135 |
+
<i data-feather="star" class="w-4 h-4 fill-current"></i>
|
| 136 |
+
</div>
|
| 137 |
+
<span class="text-gray-400 text-sm ml-2">(1,234 reviews)</span>
|
| 138 |
+
</div>
|
| 139 |
+
</div>
|
| 140 |
+
</div>
|
| 141 |
+
<p class="text-gray-300 mb-4">Premium electronics and gadgets with warranty and excellent customer service.</p>
|
| 142 |
+
<a href="vendor-store.html" class="text-purple-300 hover:text-purple-200 flex items-center">
|
| 143 |
+
Visit Store <i data-feather="chevron-right" class="ml-1"></i>
|
| 144 |
+
</a>
|
| 145 |
+
</div>
|
| 146 |
+
|
| 147 |
+
<!-- Vendor 2 -->
|
| 148 |
+
<div class="vendor-card rounded-xl p-6 card-hover">
|
| 149 |
+
<div class="flex items-start mb-4">
|
| 150 |
+
<img src="http://static.photos/retail/200x200/2" alt="Vendor Logo" class="w-16 h-16 rounded-full object-cover mr-4">
|
| 151 |
+
<div>
|
| 152 |
+
<h3 class="text-xl font-bold">Fashion Forward</h3>
|
| 153 |
+
<div class="flex items-center mt-1">
|
| 154 |
+
<div class="flex text-yellow-400">
|
| 155 |
+
<i data-feather="star" class="w-4 h-4 fill-current"></i>
|
| 156 |
+
<i data-feather="star" class="w-4 h-4 fill-current"></i>
|
| 157 |
+
<i data-feather="star" class="w-4 h-4 fill-current"></i>
|
| 158 |
+
<i data-feather="star" class="w-4 h-4 fill-current"></i>
|
| 159 |
+
<i data-feather="star" class="w-4 h-4 fill-current"></i>
|
| 160 |
+
</div>
|
| 161 |
+
<span class="text-gray-400 text-sm ml-2">(892 reviews)</span>
|
| 162 |
+
</div>
|
| 163 |
+
</div>
|
| 164 |
+
</div>
|
| 165 |
+
<p class="text-gray-300 mb-4">Trendy clothing and accessories for men, women and children at affordable prices.</p>
|
| 166 |
+
<a href="vendor-store.html" class="text-purple-300 hover:text-purple-200 flex items-center">
|
| 167 |
+
Visit Store <i data-feather="chevron-right" class="ml-1"></i>
|
| 168 |
+
</a>
|
| 169 |
+
</div>
|
| 170 |
+
|
| 171 |
+
<!-- Vendor 3 -->
|
| 172 |
+
<div class="vendor-card rounded-xl p-6 card-hover">
|
| 173 |
+
<div class="flex items-start mb-4">
|
| 174 |
+
<img src="http://static.photos/retail/200x200/3" alt="Vendor Logo" class="w-16 h-16 rounded-full object-cover mr-4">
|
| 175 |
+
<div>
|
| 176 |
+
<h3 class="text-xl font-bold">Home Essentials</h3>
|
| 177 |
+
<div class="flex items-center mt-1">
|
| 178 |
+
<div class="flex text-yellow-400">
|
| 179 |
+
<i data-feather="star" class="w-4 h-4 fill-current"></i>
|
| 180 |
+
<i data-feather="star" class="w-4 h-4 fill-current"></i>
|
| 181 |
+
<i data-feather="star" class="w-4 h-4 fill-current"></i>
|
| 182 |
+
<i data-feather="star" class="w-4 h-4 fill-current"></i>
|
| 183 |
+
<i data-feather="star" class="w-4 h-4 fill-current"></i>
|
| 184 |
+
</div>
|
| 185 |
+
<span class="text-gray-400 text-sm ml-2">(1,567 reviews)</span>
|
| 186 |
+
</div>
|
| 187 |
+
</div>
|
| 188 |
+
</div>
|
| 189 |
+
<p class="text-gray-300 mb-4">Everything you need for your home - furniture, appliances, decor and more.</p>
|
| 190 |
+
<a href="vendor-store.html" class="text-purple-300 hover:text-purple-200 flex items-center">
|
| 191 |
+
Visit Store <i data-feather="chevron-right" class="ml-1"></i>
|
| 192 |
+
</a>
|
| 193 |
+
</div>
|
| 194 |
+
</div>
|
| 195 |
+
</section>
|
| 196 |
+
|
| 197 |
+
<!-- How It Works -->
|
| 198 |
+
<section class="bg-gray-800/50 rounded-xl p-8 mb-16">
|
| 199 |
+
<h2 class="text-3xl font-bold mb-8 gradient-text text-center">How GIEDO Digital Mall Works</h2>
|
| 200 |
+
<div class="grid grid-cols-1 md:grid-cols-3 gap-8">
|
| 201 |
+
<div class="text-center">
|
| 202 |
+
<div class="w-20 h-20 bg-purple-600/20 rounded-full flex items-center justify-center mx-auto mb-4">
|
| 203 |
+
<i data-feather="user-plus" class="text-purple-400 text-2xl"></i>
|
| 204 |
+
</div>
|
| 205 |
+
<h3 class="text-xl font-bold mb-2">1. Register as Vendor</h3>
|
| 206 |
+
<p class="text-gray-400">Create your vendor account and complete your store profile</p>
|
| 207 |
+
</div>
|
| 208 |
+
<div class="text-center">
|
| 209 |
+
<div class="w-20 h-20 bg-blue-600/20 rounded-full flex items-center justify-center mx-auto mb-4">
|
| 210 |
+
<i data-feather="upload" class="text-blue-400 text-2xl"></i>
|
| 211 |
+
</div>
|
| 212 |
+
<h3 class="text-xl font-bold mb-2">2. Add Your Products</h3>
|
| 213 |
+
<p class="text-gray-400">Upload your product catalog with images, descriptions and pricing</p>
|
| 214 |
+
</div>
|
| 215 |
+
<div class="text-center">
|
| 216 |
+
<div class="w-20 h-20 bg-pink-600/20 rounded-full flex items-center justify-center mx-auto mb-4">
|
| 217 |
+
<i data-feather="dollar-sign" class="text-pink-400 text-2xl"></i>
|
| 218 |
+
</div>
|
| 219 |
+
<h3 class="text-xl font-bold mb-2">3. Start Selling</h3>
|
| 220 |
+
<p class="text-gray-400">Manage orders, track sales and grow your business with our tools</p>
|
| 221 |
+
</div>
|
| 222 |
+
</div>
|
| 223 |
+
<div class="text-center mt-8">
|
| 224 |
+
<a href="vendor-registration.html" class="px-8 py-3 bg-gradient-to-r from-purple-600 to-blue-500 rounded-full font-semibold hover:opacity-90 transition-opacity text-center inline-block">
|
| 225 |
+
Start Selling Now
|
| 226 |
+
</a>
|
| 227 |
+
</div>
|
| 228 |
+
</section>
|
| 229 |
+
</main>
|
| 230 |
+
|
| 231 |
+
<footer class="relative z-10 bg-gray-900/50 border-t border-gray-800 mt-12">
|
| 232 |
+
<div class="container mx-auto px-6 py-12">
|
| 233 |
+
<div class="grid grid-cols-1 md:grid-cols-4 gap-8">
|
| 234 |
+
<div>
|
| 235 |
+
<h4 class="text-lg font-semibold mb-4 gradient-text">GIEDO Digital Mall</h4>
|
| 236 |
+
<p class="text-gray-400">Egypt's largest electronic marketplace connecting buyers and sellers nationwide.</p>
|
| 237 |
+
</div>
|
| 238 |
+
<div>
|
| 239 |
+
<h4 class="text-lg font-semibold mb-4">For Buyers</h4>
|
| 240 |
+
<ul class="space-y-2 text-gray-400">
|
| 241 |
+
<li><a href="#" class="hover:text-purple-300 transition-colors">How to Buy</a></li>
|
| 242 |
+
<li><a href="#" class="hover:text-purple-300 transition-colors">Payment Options</a></li>
|
| 243 |
+
<li><a href="#" class="hover:text-purple-300 transition-colors">Delivery Information</a></li>
|
| 244 |
+
</ul>
|
| 245 |
+
</div>
|
| 246 |
+
<div>
|
| 247 |
+
<h4 class="text-lg font-semibold mb-4">For Vendors</h4>
|
| 248 |
+
<ul class="space-y-2 text-gray-400">
|
| 249 |
+
<li><a href="vendor-registration.html" class="hover:text-purple-300 transition-colors">Become a Vendor</a></li>
|
| 250 |
+
<li><a href="#" class="hover:text-purple-300 transition-colors">Vendor Benefits</a></li>
|
| 251 |
+
<li><a href="#" class="hover:text-purple-300 transition-colors">Seller Handbook</a></li>
|
| 252 |
+
</ul>
|
| 253 |
+
</div>
|
| 254 |
+
<div>
|
| 255 |
+
<h4 class="text-lg font-semibold mb-4">Contact</h4>
|
| 256 |
+
<ul class="space-y-2 text-gray-400">
|
| 257 |
+
<li class="flex items-start">
|
| 258 |
+
<i data-feather="mail" class="mr-2"></i>
|
| 259 |
+
<span>support@giedo-mall.com</span>
|
| 260 |
+
</li>
|
| 261 |
+
<li class="flex items-start">
|
| 262 |
+
<i data-feather="phone" class="mr-2"></i>
|
| 263 |
+
<span>+20 100 000 0001</span>
|
| 264 |
+
</li>
|
| 265 |
+
<li class="flex items-start">
|
| 266 |
+
<i data-feather="map-pin" class="mr-2"></i>
|
| 267 |
+
<span>Smart Village, Cairo</span>
|
| 268 |
+
</li>
|
| 269 |
+
</ul>
|
| 270 |
+
</div>
|
| 271 |
+
</div>
|
| 272 |
+
<div class="border-t border-gray-800 mt-12 pt-8 flex flex-col md:flex-row justify-between items-center">
|
| 273 |
+
<p class="text-gray-500">© 2023 GIEDO Digital Mall. All rights reserved.</p>
|
| 274 |
+
<div class="flex space-x-6 mt-4 md:mt-0">
|
| 275 |
+
<a href="#"><i data-feather="facebook"></i></a>
|
| 276 |
+
<a href="#"><i data-feather="instagram"></i></a>
|
| 277 |
+
<a href="#"><i data-feather="linkedin"></i></a>
|
| 278 |
+
</div>
|
| 279 |
+
</div>
|
| 280 |
+
</div>
|
| 281 |
+
</footer>
|
| 282 |
+
|
| 283 |
+
<script>
|
| 284 |
+
feather.replace();
|
| 285 |
+
</script>
|
| 286 |
+
</body>
|
| 287 |
+
</html>
|
giedo-group.html
CHANGED
|
@@ -3,7 +3,7 @@
|
|
| 3 |
<head>
|
| 4 |
<meta charset="UTF-8">
|
| 5 |
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
| 6 |
-
<title>
|
| 7 |
<script src="https://cdn.tailwindcss.com"></script>
|
| 8 |
<script src="https://unpkg.com/feather-icons"></script>
|
| 9 |
<style>
|
|
@@ -25,12 +25,12 @@
|
|
| 25 |
<body class="min-h-screen bg-gradient-to-br from-gray-900 to-gray-800 text-white overflow-x-hidden">
|
| 26 |
<header class="relative z-10">
|
| 27 |
<nav class="container mx-auto px-6 py-6 flex justify-between items-center">
|
| 28 |
-
<a href="index.html" class="text-2xl font-bold gradient-text">
|
| 29 |
<div class="hidden md:flex space-x-8">
|
| 30 |
<a href="index.html" class="hover:text-purple-300 transition-colors">Home</a>
|
| 31 |
-
<a href="giedo-
|
| 32 |
-
<a href="
|
| 33 |
-
<a href="
|
| 34 |
</div>
|
| 35 |
<button class="md:hidden">
|
| 36 |
<i data-feather="menu"></i>
|
|
@@ -39,41 +39,127 @@
|
|
| 39 |
</header>
|
| 40 |
|
| 41 |
<main class="relative z-10 container mx-auto px-6 py-12">
|
| 42 |
-
<h1 class="text-4xl font-bold mb-8 gradient-text">
|
| 43 |
|
| 44 |
-
<div class="grid grid-cols-1 md:grid-cols-
|
| 45 |
-
<!--
|
| 46 |
-
<div class="bg-gray-800/50 backdrop-blur-lg rounded-xl p-
|
| 47 |
-
<div class="flex items-center justify-
|
| 48 |
-
<
|
| 49 |
-
<span class="text-xs bg-purple-600/20 text-purple-300 px-2 py-1 rounded">Featured</span>
|
| 50 |
</div>
|
| 51 |
-
<
|
| 52 |
-
<
|
|
|
|
|
|
|
|
|
|
| 53 |
</div>
|
| 54 |
|
| 55 |
-
<!--
|
| 56 |
-
<div class="bg-gray-800/50 backdrop-blur-lg rounded-xl p-
|
| 57 |
-
<div class="flex items-center justify-
|
| 58 |
-
<
|
| 59 |
-
<span class="text-xs bg-blue-600/20 text-blue-300 px-2 py-1 rounded">Premium</span>
|
| 60 |
</div>
|
| 61 |
-
<
|
| 62 |
-
<
|
|
|
|
|
|
|
|
|
|
| 63 |
</div>
|
| 64 |
|
| 65 |
-
<!-- Dashboard -->
|
| 66 |
-
<div class="bg-gray-800/50 backdrop-blur-lg rounded-xl p-
|
| 67 |
-
<div class="flex items-center justify-
|
| 68 |
-
<
|
| 69 |
-
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
| 70 |
</div>
|
| 71 |
-
<p class="text-gray-300 mb-4">Centralized management portal for all Giedo Group operations.</p>
|
| 72 |
-
<a href="dashboard.html" class="text-sm text-green-300 hover:text-green-200 transition-colors">Access Dashboard →</a>
|
| 73 |
</div>
|
| 74 |
</div>
|
| 75 |
</main>
|
| 76 |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
| 77 |
<script>
|
| 78 |
feather.replace();
|
| 79 |
</script>
|
|
|
|
| 3 |
<head>
|
| 4 |
<meta charset="UTF-8">
|
| 5 |
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
| 6 |
+
<title>GIEDO Group - Business Ecosystem</title>
|
| 7 |
<script src="https://cdn.tailwindcss.com"></script>
|
| 8 |
<script src="https://unpkg.com/feather-icons"></script>
|
| 9 |
<style>
|
|
|
|
| 25 |
<body class="min-h-screen bg-gradient-to-br from-gray-900 to-gray-800 text-white overflow-x-hidden">
|
| 26 |
<header class="relative z-10">
|
| 27 |
<nav class="container mx-auto px-6 py-6 flex justify-between items-center">
|
| 28 |
+
<a href="index.html" class="text-2xl font-bold gradient-text">GIEDO Group</a>
|
| 29 |
<div class="hidden md:flex space-x-8">
|
| 30 |
<a href="index.html" class="hover:text-purple-300 transition-colors">Home</a>
|
| 31 |
+
<a href="giedo-group.html" class="text-purple-300">Our Companies</a>
|
| 32 |
+
<a href="#" class="hover:text-purple-300 transition-colors">Dashboard</a>
|
| 33 |
+
<a href="#" class="hover:text-purple-300 transition-colors">Contact</a>
|
| 34 |
</div>
|
| 35 |
<button class="md:hidden">
|
| 36 |
<i data-feather="menu"></i>
|
|
|
|
| 39 |
</header>
|
| 40 |
|
| 41 |
<main class="relative z-10 container mx-auto px-6 py-12">
|
| 42 |
+
<h1 class="text-4xl font-bold mb-8 gradient-text">GIEDO Business Ecosystem</h1>
|
| 43 |
|
| 44 |
+
<div class="grid grid-cols-1 md:grid-cols-3 gap-8 mb-16">
|
| 45 |
+
<!-- Digital Mall Card -->
|
| 46 |
+
<div class="bg-gray-800/50 backdrop-blur-lg rounded-xl p-8 card-hover">
|
| 47 |
+
<div class="w-20 h-20 bg-purple-600/20 rounded-xl flex items-center justify-center mb-6 mx-auto">
|
| 48 |
+
<i data-feather="shopping-bag" class="text-purple-400 text-3xl"></i>
|
|
|
|
| 49 |
</div>
|
| 50 |
+
<h3 class="text-2xl font-bold mb-4 text-center">GIEDO Digital Mall</h3>
|
| 51 |
+
<p class="text-gray-400 mb-6">Egypt's largest electronic marketplace connecting vendors with customers nationwide.</p>
|
| 52 |
+
<a href="digital-mall.html" class="block text-center px-6 py-3 bg-gradient-to-r from-purple-600 to-blue-500 rounded-full font-semibold hover:opacity-90 transition-opacity">
|
| 53 |
+
Explore Marketplace
|
| 54 |
+
</a>
|
| 55 |
</div>
|
| 56 |
|
| 57 |
+
<!-- Digital Marketing Card -->
|
| 58 |
+
<div class="bg-gray-800/50 backdrop-blur-lg rounded-xl p-8 card-hover">
|
| 59 |
+
<div class="w-20 h-20 bg-blue-600/20 rounded-xl flex items-center justify-center mb-6 mx-auto">
|
| 60 |
+
<i data-feather="trending-up" class="text-blue-400 text-3xl"></i>
|
|
|
|
| 61 |
</div>
|
| 62 |
+
<h3 class="text-2xl font-bold mb-4 text-center">GIEDO Digital Marketing</h3>
|
| 63 |
+
<p class="text-gray-400 mb-6">Comprehensive digital marketing solutions including social media, classifieds and high-quality advertising.</p>
|
| 64 |
+
<a href="digital-marketing.html" class="block text-center px-6 py-3 bg-gradient-to-r from-blue-600 to-purple-500 rounded-full font-semibold hover:opacity-90 transition-opacity">
|
| 65 |
+
Marketing Services
|
| 66 |
+
</a>
|
| 67 |
</div>
|
| 68 |
|
| 69 |
+
<!-- Dashboard Card -->
|
| 70 |
+
<div class="bg-gray-800/50 backdrop-blur-lg rounded-xl p-8 card-hover">
|
| 71 |
+
<div class="w-20 h-20 bg-pink-600/20 rounded-xl flex items-center justify-center mb-6 mx-auto">
|
| 72 |
+
<i data-feather="dashboard" class="text-pink-400 text-3xl"></i>
|
| 73 |
+
</div>
|
| 74 |
+
<h3 class="text-2xl font-bold mb-4 text-center">Management Dashboard</h3>
|
| 75 |
+
<p class="text-gray-400 mb-6">Centralized control panel for managing all GIEDO Group companies and services.</p>
|
| 76 |
+
<a href="dashboard.html" class="block text-center px-6 py-3 bg-gradient-to-r from-pink-600 to-purple-500 rounded-full font-semibold hover:opacity-90 transition-opacity">
|
| 77 |
+
Access Dashboard
|
| 78 |
+
</a>
|
| 79 |
+
</div>
|
| 80 |
+
</div>
|
| 81 |
+
|
| 82 |
+
<div class="bg-gray-800/50 backdrop-blur-lg rounded-xl p-8">
|
| 83 |
+
<h2 class="text-3xl font-bold mb-6 gradient-text">About GIEDO Group</h2>
|
| 84 |
+
<p class="text-gray-300 mb-6">
|
| 85 |
+
GIEDO Group is a leading business conglomerate in Egypt managing three major companies specializing in e-commerce,
|
| 86 |
+
digital marketing, and electronic services. Our mission is to revolutionize digital business in the region through
|
| 87 |
+
innovative solutions and cutting-edge technology.
|
| 88 |
+
</p>
|
| 89 |
+
<div class="grid grid-cols-1 md:grid-cols-2 gap-8">
|
| 90 |
+
<div>
|
| 91 |
+
<h3 class="text-xl font-bold mb-4">Our Vision</h3>
|
| 92 |
+
<p class="text-gray-400">
|
| 93 |
+
To become the premier digital business ecosystem in North Africa, providing integrated solutions that empower
|
| 94 |
+
businesses and entrepreneurs in the digital economy.
|
| 95 |
+
</p>
|
| 96 |
+
</div>
|
| 97 |
+
<div>
|
| 98 |
+
<h3 class="text-xl font-bold mb-4">Our Services</h3>
|
| 99 |
+
<ul class="space-y-2 text-gray-400">
|
| 100 |
+
<li class="flex items-start">
|
| 101 |
+
<i data-feather="check" class="text-green-400 mr-2 mt-1"></i>
|
| 102 |
+
<span>E-commerce marketplace with vendor dashboards</span>
|
| 103 |
+
</li>
|
| 104 |
+
<li class="flex items-start">
|
| 105 |
+
<i data-feather="check" class="text-green-400 mr-2 mt-1"></i>
|
| 106 |
+
<span>Comprehensive digital marketing services</span>
|
| 107 |
+
</li>
|
| 108 |
+
<li class="flex items-start">
|
| 109 |
+
<i data-feather="check" class="text-green-400 mr-2 mt-1"></i>
|
| 110 |
+
<span>Centralized business management dashboard</span>
|
| 111 |
+
</li>
|
| 112 |
+
</ul>
|
| 113 |
</div>
|
|
|
|
|
|
|
| 114 |
</div>
|
| 115 |
</div>
|
| 116 |
</main>
|
| 117 |
|
| 118 |
+
<footer class="relative z-10 bg-gray-900/50 border-t border-gray-800 mt-20">
|
| 119 |
+
<div class="container mx-auto px-6 py-12">
|
| 120 |
+
<div class="grid grid-cols-1 md:grid-cols-3 gap-8">
|
| 121 |
+
<div>
|
| 122 |
+
<h4 class="text-lg font-semibold mb-4 gradient-text">GIEDO Group</h4>
|
| 123 |
+
<p class="text-gray-400">Building Egypt's digital future through innovative business solutions.</p>
|
| 124 |
+
</div>
|
| 125 |
+
<div>
|
| 126 |
+
<h4 class="text-lg font-semibold mb-4">Quick Links</h4>
|
| 127 |
+
<ul class="space-y-2 text-gray-400">
|
| 128 |
+
<li><a href="digital-mall.html" class="hover:text-purple-300 transition-colors">Digital Mall</a></li>
|
| 129 |
+
<li><a href="digital-marketing.html" class="hover:text-purple-300 transition-colors">Digital Marketing</a></li>
|
| 130 |
+
<li><a href="dashboard.html" class="hover:text-purple-300 transition-colors">Management Dashboard</a></li>
|
| 131 |
+
</ul>
|
| 132 |
+
</div>
|
| 133 |
+
<div>
|
| 134 |
+
<h4 class="text-lg font-semibold mb-4">Contact Us</h4>
|
| 135 |
+
<ul class="space-y-2 text-gray-400">
|
| 136 |
+
<li class="flex items-start">
|
| 137 |
+
<i data-feather="mail" class="mr-2"></i>
|
| 138 |
+
<span>info@giedo-group.com</span>
|
| 139 |
+
</li>
|
| 140 |
+
<li class="flex items-start">
|
| 141 |
+
<i data-feather="phone" class="mr-2"></i>
|
| 142 |
+
<span>+20 100 000 0000</span>
|
| 143 |
+
</li>
|
| 144 |
+
<li class="flex items-start">
|
| 145 |
+
<i data-feather="map-pin" class="mr-2"></i>
|
| 146 |
+
<span>Cairo, Egypt</span>
|
| 147 |
+
</li>
|
| 148 |
+
</ul>
|
| 149 |
+
</div>
|
| 150 |
+
</div>
|
| 151 |
+
<div class="border-t border-gray-800 mt-12 pt-8 flex flex-col md:flex-row justify-between items-center">
|
| 152 |
+
<p class="text-gray-500">© 2023 GIEDO Group. All rights reserved.</p>
|
| 153 |
+
<div class="flex space-x-6 mt-4 md:mt-0">
|
| 154 |
+
<a href="#"><i data-feather="facebook"></i></a>
|
| 155 |
+
<a href="#"><i data-feather="twitter"></i></a>
|
| 156 |
+
<a href="#"><i data-feather="instagram"></i></a>
|
| 157 |
+
<a href="#"><i data-feather="linkedin"></i></a>
|
| 158 |
+
</div>
|
| 159 |
+
</div>
|
| 160 |
+
</div>
|
| 161 |
+
</footer>
|
| 162 |
+
|
| 163 |
<script>
|
| 164 |
feather.replace();
|
| 165 |
</script>
|
index.html
CHANGED
|
@@ -3,8 +3,8 @@
|
|
| 3 |
<head>
|
| 4 |
<meta charset="UTF-8">
|
| 5 |
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
| 6 |
-
<title>
|
| 7 |
-
|
| 8 |
<script src="https://unpkg.com/feather-icons"></script>
|
| 9 |
<script src="https://cdn.jsdelivr.net/npm/vanta@latest/dist/vanta.globe.min.js"></script>
|
| 10 |
<style>
|
|
@@ -36,13 +36,13 @@
|
|
| 36 |
|
| 37 |
<header class="relative z-10">
|
| 38 |
<nav class="container mx-auto px-6 py-6 flex justify-between items-center">
|
| 39 |
-
<a href="#" class="text-2xl font-bold gradient-text">
|
| 40 |
-
|
| 41 |
<a href="#" class="hover:text-purple-300 transition-colors">Home</a>
|
| 42 |
-
<a href="
|
| 43 |
-
<a href="
|
| 44 |
-
<a href="#" class="hover:text-purple-300 transition-colors">
|
| 45 |
-
|
| 46 |
<button class="md:hidden">
|
| 47 |
<i data-feather="menu"></i>
|
| 48 |
</button>
|
|
@@ -55,10 +55,10 @@
|
|
| 55 |
<h1 class="text-4xl md:text-6xl font-bold mb-6 gradient-text">Build Stellar Interfaces</h1>
|
| 56 |
<p class="text-xl md:text-2xl text-gray-300 mb-10">A cosmic collection of UI components and interactions that will make your users orbit around your product</p>
|
| 57 |
<div class="flex flex-col sm:flex-row justify-center gap-4">
|
| 58 |
-
<a href="
|
| 59 |
-
|
| 60 |
</a>
|
| 61 |
-
|
| 62 |
Explore Cosmos
|
| 63 |
</button>
|
| 64 |
</div>
|
|
@@ -127,9 +127,9 @@
|
|
| 127 |
<div class="container mx-auto px-6 py-12">
|
| 128 |
<div class="grid grid-cols-1 md:grid-cols-4 gap-8">
|
| 129 |
<div>
|
| 130 |
-
<h4 class="text-lg font-semibold mb-4 gradient-text">
|
| 131 |
-
<p class="text-gray-400">
|
| 132 |
-
|
| 133 |
<div>
|
| 134 |
<h4 class="text-lg font-semibold mb-4">Resources</h4>
|
| 135 |
<ul class="space-y-2 text-gray-400">
|
|
@@ -157,8 +157,8 @@
|
|
| 157 |
</div>
|
| 158 |
</div>
|
| 159 |
<div class="border-t border-gray-800 mt-12 pt-8 flex flex-col md:flex-row justify-between items-center">
|
| 160 |
-
|
| 161 |
-
|
| 162 |
<a href="#"><i data-feather="github"></i></a>
|
| 163 |
<a href="#"><i data-feather="twitter"></i></a>
|
| 164 |
<a href="#"><i data-feather="instagram"></i></a>
|
|
|
|
| 3 |
<head>
|
| 4 |
<meta charset="UTF-8">
|
| 5 |
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
| 6 |
+
<title>GIEDO Group - Business Ecosystem</title>
|
| 7 |
+
<script src="https://cdn.tailwindcss.com"></script>
|
| 8 |
<script src="https://unpkg.com/feather-icons"></script>
|
| 9 |
<script src="https://cdn.jsdelivr.net/npm/vanta@latest/dist/vanta.globe.min.js"></script>
|
| 10 |
<style>
|
|
|
|
| 36 |
|
| 37 |
<header class="relative z-10">
|
| 38 |
<nav class="container mx-auto px-6 py-6 flex justify-between items-center">
|
| 39 |
+
<a href="#" class="text-2xl font-bold gradient-text">GIEDO Group</a>
|
| 40 |
+
<div class="hidden md:flex space-x-8">
|
| 41 |
<a href="#" class="hover:text-purple-300 transition-colors">Home</a>
|
| 42 |
+
<a href="giedo-group.html" class="hover:text-purple-300 transition-colors">GIEDO Group</a>
|
| 43 |
+
<a href="digital-mall.html" class="hover:text-purple-300 transition-colors">Digital Mall</a>
|
| 44 |
+
<a href="#" class="hover:text-purple-300 transition-colors">Dashboard</a>
|
| 45 |
+
</div>
|
| 46 |
<button class="md:hidden">
|
| 47 |
<i data-feather="menu"></i>
|
| 48 |
</button>
|
|
|
|
| 55 |
<h1 class="text-4xl md:text-6xl font-bold mb-6 gradient-text">Build Stellar Interfaces</h1>
|
| 56 |
<p class="text-xl md:text-2xl text-gray-300 mb-10">A cosmic collection of UI components and interactions that will make your users orbit around your product</p>
|
| 57 |
<div class="flex flex-col sm:flex-row justify-center gap-4">
|
| 58 |
+
<a href="giedo-group.html" class="px-8 py-3 bg-gradient-to-r from-purple-600 to-blue-500 rounded-full font-semibold hover:opacity-90 transition-opacity text-center">
|
| 59 |
+
Explore Companies
|
| 60 |
</a>
|
| 61 |
+
<button class="px-8 py-3 border border-gray-600 rounded-full font-semibold hover:bg-gray-800 transition-colors">
|
| 62 |
Explore Cosmos
|
| 63 |
</button>
|
| 64 |
</div>
|
|
|
|
| 127 |
<div class="container mx-auto px-6 py-12">
|
| 128 |
<div class="grid grid-cols-1 md:grid-cols-4 gap-8">
|
| 129 |
<div>
|
| 130 |
+
<h4 class="text-lg font-semibold mb-4 gradient-text">GIEDO Group</h4>
|
| 131 |
+
<p class="text-gray-400">Building Egypt's digital future through innovative business solutions.</p>
|
| 132 |
+
</div>
|
| 133 |
<div>
|
| 134 |
<h4 class="text-lg font-semibold mb-4">Resources</h4>
|
| 135 |
<ul class="space-y-2 text-gray-400">
|
|
|
|
| 157 |
</div>
|
| 158 |
</div>
|
| 159 |
<div class="border-t border-gray-800 mt-12 pt-8 flex flex-col md:flex-row justify-between items-center">
|
| 160 |
+
<p class="text-gray-500">© 2023 GIEDO Group. All rights reserved.</p>
|
| 161 |
+
<div class="flex space-x-6 mt-4 md:mt-0">
|
| 162 |
<a href="#"><i data-feather="github"></i></a>
|
| 163 |
<a href="#"><i data-feather="twitter"></i></a>
|
| 164 |
<a href="#"><i data-feather="instagram"></i></a>
|
vendor-dashboard.html
ADDED
|
@@ -0,0 +1,513 @@
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
| 1 |
+
<!DOCTYPE html>
|
| 2 |
+
<html lang="en">
|
| 3 |
+
<head>
|
| 4 |
+
<meta charset="UTF-8">
|
| 5 |
+
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
| 6 |
+
<title>Vendor Dashboard | GIEDO Digital Mall</title>
|
| 7 |
+
<script src="https://cdn.tailwindcss.com"></script>
|
| 8 |
+
<script src="https://unpkg.com/feather-icons"></script>
|
| 9 |
+
<script src="https://cdn.jsdelivr.net/npm/chart.js"></script>
|
| 10 |
+
<style>
|
| 11 |
+
.gradient-text {
|
| 12 |
+
background: linear-gradient(90deg, #3b82f6, #8b5cf6, #ec4899);
|
| 13 |
+
-webkit-background-clip: text;
|
| 14 |
+
background-clip: text;
|
| 15 |
+
color: transparent;
|
| 16 |
+
}
|
| 17 |
+
.sidebar {
|
| 18 |
+
width: 280px;
|
| 19 |
+
transition: all 0.3s;
|
| 20 |
+
}
|
| 21 |
+
.sidebar-collapsed {
|
| 22 |
+
width: 80px;
|
| 23 |
+
}
|
| 24 |
+
.main-content {
|
| 25 |
+
margin-left: 280px;
|
| 26 |
+
transition: all 0.3s;
|
| 27 |
+
}
|
| 28 |
+
.main-content-collapsed {
|
| 29 |
+
margin-left: 80px;
|
| 30 |
+
}
|
| 31 |
+
.active-menu {
|
| 32 |
+
background: rgba(79, 70, 229, 0.2);
|
| 33 |
+
border-left: 4px solid #4f46e5;
|
| 34 |
+
}
|
| 35 |
+
</style>
|
| 36 |
+
</head>
|
| 37 |
+
<body class="bg-gray-100 text-gray-800">
|
| 38 |
+
<div class="flex h-screen overflow-hidden">
|
| 39 |
+
<!-- Sidebar -->
|
| 40 |
+
<div class="sidebar bg-white shadow-md fixed h-full z-10">
|
| 41 |
+
<div class="p-4 border-b border-gray-200 flex items-center justify-between">
|
| 42 |
+
<a href="digital-mall.html" class="text-xl font-bold gradient-text whitespace-nowrap">Vendor Dashboard</a>
|
| 43 |
+
<button id="toggleSidebar" class="text-gray-500 hover:text-gray-700">
|
| 44 |
+
<i data-feather="menu"></i>
|
| 45 |
+
</button>
|
| 46 |
+
</div>
|
| 47 |
+
<div class="py-4">
|
| 48 |
+
<div class="px-4 py-3 flex items-center space-x-3 text-gray-700 hover:bg-gray-100">
|
| 49 |
+
<img src="http://static.photos/retail/200x200/5" alt="Vendor Logo" class="w-10 h-10 rounded-full object-cover">
|
| 50 |
+
<div>
|
| 51 |
+
<p class="font-medium">Tech Haven</p>
|
| 52 |
+
<p class="text-sm text-gray-500">Premium Electronics</p>
|
| 53 |
+
</div>
|
| 54 |
+
</div>
|
| 55 |
+
<nav class="mt-6">
|
| 56 |
+
<a href="#" class="flex items-center px-4 py-3 text-gray-700 active-menu">
|
| 57 |
+
<i data-feather="home" class="w-5 h-5"></i>
|
| 58 |
+
<span class="ml-3">Dashboard</span>
|
| 59 |
+
</a>
|
| 60 |
+
<a href="vendor-products.html" class="flex items-center px-4 py-3 text-gray-700 hover:bg-gray-100">
|
| 61 |
+
<i data-feather="box" class="w-5 h-5"></i>
|
| 62 |
+
<span class="ml-3">Products</span>
|
| 63 |
+
<span class="ml-auto bg-purple-100 text-purple-800 text-xs px-2 py-1 rounded-full">24</span>
|
| 64 |
+
</a>
|
| 65 |
+
<a href="vendor-orders.html" class="flex items-center px-4 py-3 text-gray-700 hover:bg-gray-100">
|
| 66 |
+
<i data-feather="shopping-bag" class="w-5 h-5"></i>
|
| 67 |
+
<span class="ml-3">Orders</span>
|
| 68 |
+
<span class="ml-auto bg-green-100 text-green-800 text-xs px-2 py-1 rounded-full">15</span>
|
| 69 |
+
</a>
|
| 70 |
+
<a href="vendor-customers.html" class="flex items-center px-4 py-3 text-gray-700 hover:bg-gray-100">
|
| 71 |
+
<i data-feather="users" class="w-5 h-5"></i>
|
| 72 |
+
<span class="ml-3">Customers</span>
|
| 73 |
+
</a>
|
| 74 |
+
<a href="vendor-analytics.html" class="flex items-center px-4 py-3 text-gray-700 hover:bg-gray-100">
|
| 75 |
+
<i data-feather="bar-chart-2" class="w-5 h-5"></i>
|
| 76 |
+
<span class="ml-3">Analytics</span>
|
| 77 |
+
</a>
|
| 78 |
+
<a href="vendor-promotions.html" class="flex items-center px-4 py-3 text-gray-700 hover:bg-gray-100">
|
| 79 |
+
<i data-feather="tag" class="w-5 h-5"></i>
|
| 80 |
+
<span class="ml-3">Promotions</span>
|
| 81 |
+
</a>
|
| 82 |
+
<a href="vendor-settings.html" class="flex items-center px-4 py-3 text-gray-700 hover:bg-gray-100">
|
| 83 |
+
<i data-feather="settings" class="w-5 h-5"></i>
|
| 84 |
+
<span class="ml-3">Settings</span>
|
| 85 |
+
</a>
|
| 86 |
+
</nav>
|
| 87 |
+
</div>
|
| 88 |
+
<div class="absolute bottom-0 w-full p-4 border-t border-gray-200">
|
| 89 |
+
<a href="#" class="flex items-center px-4 py-2 text-gray-700 hover:bg-gray-100 rounded">
|
| 90 |
+
<i data-feather="log-out" class="w-5 h-5"></i>
|
| 91 |
+
<span class="ml-3">Logout</span>
|
| 92 |
+
</a>
|
| 93 |
+
</div>
|
| 94 |
+
</div>
|
| 95 |
+
|
| 96 |
+
<!-- Main Content -->
|
| 97 |
+
<div class="main-content flex-1 overflow-auto">
|
| 98 |
+
<!-- Top Navigation -->
|
| 99 |
+
<header class="bg-white shadow-sm">
|
| 100 |
+
<div class="px-6 py-4 flex justify-between items-center">
|
| 101 |
+
<div class="flex items-center space-x-4">
|
| 102 |
+
<h1 class="text-2xl font-bold">Dashboard Overview</h1>
|
| 103 |
+
</div>
|
| 104 |
+
<div class="flex items-center space-x-4">
|
| 105 |
+
<div class="relative">
|
| 106 |
+
<button class="p-2 text-gray-500 hover:text-gray-700">
|
| 107 |
+
<i data-feather="bell"></i>
|
| 108 |
+
<span class="absolute top-0 right-0 w-2 h-2 bg-red-500 rounded-full"></span>
|
| 109 |
+
</button>
|
| 110 |
+
</div>
|
| 111 |
+
<div class="relative">
|
| 112 |
+
<button class="p-2 text-gray-500 hover:text-gray-700">
|
| 113 |
+
<i data-feather="message-square"></i>
|
| 114 |
+
<span class="absolute top-0 right-0 w-2 h-2 bg-blue-500 rounded-full"></span>
|
| 115 |
+
</button>
|
| 116 |
+
</div>
|
| 117 |
+
<div class="flex items-center space-x-2">
|
| 118 |
+
<img src="http://static.photos/people/200x200/1" alt="User" class="w-8 h-8 rounded-full">
|
| 119 |
+
<span class="font-medium">Ahmed Mohamed</span>
|
| 120 |
+
</div>
|
| 121 |
+
</div>
|
| 122 |
+
</div>
|
| 123 |
+
</header>
|
| 124 |
+
|
| 125 |
+
<!-- Dashboard Content -->
|
| 126 |
+
<main class="p-6">
|
| 127 |
+
<!-- Stats Cards -->
|
| 128 |
+
<div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-4 gap-6 mb-8">
|
| 129 |
+
<div class="bg-white rounded-lg shadow p-6">
|
| 130 |
+
<div class="flex items-center justify-between">
|
| 131 |
+
<div>
|
| 132 |
+
<p class="text-gray-500">Total Revenue</p>
|
| 133 |
+
<h3 class="text-2xl font-bold">EGP 24,589</h3>
|
| 134 |
+
<p class="text-green-500 text-sm flex items-center">
|
| 135 |
+
<i data-feather="trending-up" class="w-4 h-4 mr-1"></i>
|
| 136 |
+
<span>12% from last month</span>
|
| 137 |
+
</p>
|
| 138 |
+
</div>
|
| 139 |
+
<div class="p-3 rounded-full bg-purple-100 text-purple-600">
|
| 140 |
+
<i data-feather="dollar-sign" class="w-6 h-6"></i>
|
| 141 |
+
</div>
|
| 142 |
+
</div>
|
| 143 |
+
</div>
|
| 144 |
+
<div class="bg-white rounded-lg shadow p-6">
|
| 145 |
+
<div class="flex items-center justify-between">
|
| 146 |
+
<div>
|
| 147 |
+
<p class="text-gray-500">Total Orders</p>
|
| 148 |
+
<h3 class="text-2xl font-bold">156</h3>
|
| 149 |
+
<p class="text-green-500 text-sm flex items-center">
|
| 150 |
+
<i data-feather="trending-up" class="w-4 h-4 mr-1"></i>
|
| 151 |
+
<span>8% from last month</span>
|
| 152 |
+
</p>
|
| 153 |
+
</div>
|
| 154 |
+
<div class="p-3 rounded-full bg-blue-100 text-blue-600">
|
| 155 |
+
<i data-feather="shopping-bag" class="w-6 h-6"></i>
|
| 156 |
+
</div>
|
| 157 |
+
</div>
|
| 158 |
+
</div>
|
| 159 |
+
<div class="bg-white rounded-lg shadow p-6">
|
| 160 |
+
<div class="flex items-center justify-between">
|
| 161 |
+
<div>
|
| 162 |
+
<p class="text-gray-500">Products</p>
|
| 163 |
+
<h3 class="text-2xl font-bold">24</h3>
|
| 164 |
+
<p class="text-red-500 text-sm flex items-center">
|
| 165 |
+
<i data-feather="trending-down" class="w-4 h-4 mr-1"></i>
|
| 166 |
+
<span>2 less than last month</span>
|
| 167 |
+
</p>
|
| 168 |
+
</div>
|
| 169 |
+
<div class="p-3 rounded-full bg-green-100 text-green-600">
|
| 170 |
+
<i data-feather="box" class="w-6 h-6"></i>
|
| 171 |
+
</div>
|
| 172 |
+
</div>
|
| 173 |
+
</div>
|
| 174 |
+
<div class="bg-white rounded-lg shadow p-6">
|
| 175 |
+
<div class="flex items-center justify-between">
|
| 176 |
+
<div>
|
| 177 |
+
<p class="text-gray-500">Conversion Rate</p>
|
| 178 |
+
<h3 class="text-2xl font-bold">3.2%</h3>
|
| 179 |
+
<p class="text-green-500 text-sm flex items-center">
|
| 180 |
+
<i data-feather="trending-up" class="w-4 h-4 mr-1"></i>
|
| 181 |
+
<span>0.5% from last month</span>
|
| 182 |
+
</p>
|
| 183 |
+
</div>
|
| 184 |
+
<div class="p-3 rounded-full bg-yellow-100 text-yellow-600">
|
| 185 |
+
<i data-feather="percent" class="w-6 h-6"></i>
|
| 186 |
+
</div>
|
| 187 |
+
</div>
|
| 188 |
+
</div>
|
| 189 |
+
</div>
|
| 190 |
+
|
| 191 |
+
<!-- Charts Row -->
|
| 192 |
+
<div class="grid grid-cols-1 lg:grid-cols-2 gap-6 mb-8">
|
| 193 |
+
<!-- Sales Chart -->
|
| 194 |
+
<div class="bg-white rounded-lg shadow p-6">
|
| 195 |
+
<div class="flex justify-between items-center mb-4">
|
| 196 |
+
<h3 class="font-bold">Sales Overview</h3>
|
| 197 |
+
<div class="flex space-x-2">
|
| 198 |
+
<button class="px-3 py-1 text-xs bg-purple-600 text-white rounded">Weekly</button>
|
| 199 |
+
<button class="px-3 py-1 text-xs bg-gray-100 text-gray-700 rounded">Monthly</button>
|
| 200 |
+
<button class="px-3 py-1 text-xs bg-gray-100 text-gray-700 rounded">Yearly</button>
|
| 201 |
+
</div>
|
| 202 |
+
</div>
|
| 203 |
+
<div class="h-64">
|
| 204 |
+
<canvas id="salesChart"></canvas>
|
| 205 |
+
</div>
|
| 206 |
+
</div>
|
| 207 |
+
|
| 208 |
+
<!-- Orders Chart -->
|
| 209 |
+
<div class="bg-white rounded-lg shadow p-6">
|
| 210 |
+
<div class="flex justify-between items-center mb-4">
|
| 211 |
+
<h3 class="font-bold">Orders Overview</h3>
|
| 212 |
+
<div class="flex space-x-2">
|
| 213 |
+
<button class="px-3 py-1 text-xs bg-purple-600 text-white rounded">Weekly</button>
|
| 214 |
+
<button class="px-3 py-1 text-xs bg-gray-100 text-gray-700 rounded">Monthly</button>
|
| 215 |
+
<button class="px-3 py-1 text-xs bg-gray-100 text-gray-700 rounded">Yearly</button>
|
| 216 |
+
</div>
|
| 217 |
+
</div>
|
| 218 |
+
<div class="h-64">
|
| 219 |
+
<canvas id="ordersChart"></canvas>
|
| 220 |
+
</div>
|
| 221 |
+
</div>
|
| 222 |
+
</div>
|
| 223 |
+
|
| 224 |
+
<!-- Recent Orders -->
|
| 225 |
+
<div class="bg-white rounded-lg shadow overflow-hidden mb -8">
|
| 226 |
+
<div class="px-6 py-4 border-b border-gray-200 flex justify-between items-center">
|
| 227 |
+
<h3 class="font-bold">Recent Orders</h3>
|
| 228 |
+
<a href="vendor-orders.html" class="text-purple-600 hover:text-purple-800 text-sm font-medium">View All</a>
|
| 229 |
+
</div>
|
| 230 |
+
<div class="overflow-x-auto">
|
| 231 |
+
<table class="min-w-full divide-y divide-gray-200">
|
| 232 |
+
<thead class="bg-gray-50">
|
| 233 |
+
<tr>
|
| 234 |
+
<th class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">Order ID</th>
|
| 235 |
+
<th class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">Customer</th>
|
| 236 |
+
<th class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">Date</th>
|
| 237 |
+
<th class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">Amount</th>
|
| 238 |
+
<th class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">Status</th>
|
| 239 |
+
<th class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">Action</th>
|
| 240 |
+
</tr>
|
| 241 |
+
</thead>
|
| 242 |
+
<tbody class="bg-white divide-y divide-gray-200">
|
| 243 |
+
<tr>
|
| 244 |
+
<td class="px-6 py-4 whitespace-nowrap text-sm font-medium text-gray-900">#ORD-7854</td>
|
| 245 |
+
<td class="px-6 py-4 whitespace-nowrap text-sm text-gray-500">Mohamed Ali</td>
|
| 246 |
+
<td class="px-6 py-4 whitespace-nowrap text-sm text-gray-500">12 Oct, 2023</td>
|
| 247 |
+
<td class="px-6 py-4 whitespace-nowrap text-sm text-gray-500">EGP 1,245</td>
|
| 248 |
+
<td class="px-6 py-4 whitespace-nowrap">
|
| 249 |
+
<span class="px-2 inline-flex text-xs leading-5 font-semibold rounded-full bg-green-100 text-green-800">Completed</span>
|
| 250 |
+
</td>
|
| 251 |
+
<td class="px-6 py-4 whitespace-nowrap text-right text-sm font-medium">
|
| 252 |
+
<a href="#" class="text-purple-600 hover:text-purple-900"><i data-feather="eye" class="w-4 h-4"></i></a>
|
| 253 |
+
</td>
|
| 254 |
+
</tr>
|
| 255 |
+
<tr>
|
| 256 |
+
<td class="px-6 py-4 whitespace-nowrap text-sm font-medium text-gray-900">#ORD-7853</td>
|
| 257 |
+
<td class="px-6 py-4 whitespace-nowrap text-sm text-gray-500">Ahmed Hassan</td>
|
| 258 |
+
<td class="px-6 py-4 whitespace-nowrap text-sm text-gray-500">11 Oct, 2023</td>
|
| 259 |
+
<td class="px-6 py-4 whitespace-nowrap text-sm text-gray-500">EGP 899</td>
|
| 260 |
+
<td class="px-6 py-4 whitespace-nowrap">
|
| 261 |
+
<span class="px-2 inline-flex text-xs leading-5 font-semibold rounded-full bg-yellow-100 text-yellow-800">Processing</span>
|
| 262 |
+
</td>
|
| 263 |
+
<td class="px-6 py-4 whitespace-nowrap text-right text-sm font-medium">
|
| 264 |
+
<a href="#" class="text-purple-600 hover:text-purple-900"><i data-feather="eye" class="w-4 h-4"></i></a>
|
| 265 |
+
</td>
|
| 266 |
+
</tr>
|
| 267 |
+
<tr>
|
| 268 |
+
<td class="px-6 py-4 whitespace-nowrap text-sm font-medium text-gray-900">#ORD-7852</td>
|
| 269 |
+
<td class="px-6 py-4 whitespace-nowrap text-sm text-gray-500">Yasmine Adel</td>
|
| 270 |
+
<td class="px-6 py-4 whitespace-nowrap text-sm text-gray-500">10 Oct, 2023</td>
|
| 271 |
+
<td class="px-6 py-4 whitespace-nowrap text-sm text-gray-500">EGP 2,345</td>
|
| 272 |
+
<td class="px-6 py-4 whitespace-nowrap">
|
| 273 |
+
<span class="px-2 inline-flex text-xs leading-5 font-semibold rounded-full bg-blue-100 text-blue-800">Shipped</span>
|
| 274 |
+
</td>
|
| 275 |
+
<td class="px-6 py-4 whitespace-nowrap text-right text-sm font-medium">
|
| 276 |
+
<a href="#" class="text-purple-600 hover:text-purple-900"><i data-feather="eye" class="w-4 h-4"></i></a>
|
| 277 |
+
</td>
|
| 278 |
+
</tr>
|
| 279 |
+
<tr>
|
| 280 |
+
<td class="px-6 py-4 whitespace-nowrap text-sm font-medium text-gray-900">#ORD-7851</td>
|
| 281 |
+
<td class="px-6 py-4 whitespace-nowrap text-sm text-gray-500">Mostafa Kamal</td>
|
| 282 |
+
<td class="px-6 py-4 whitespace-nowrap text-sm text-gray-500">9 Oct, 2023</td>
|
| 283 |
+
<td class="px-6 py-4 whitespace-nowrap text-sm text-gray-500">EGP 450</td>
|
| 284 |
+
<td class="px-6 py-4 whitespace-nowrap">
|
| 285 |
+
<span class="px-2 inline-flex text-xs leading-5 font-semibold rounded-full bg-red-100 text-red-800">Cancelled</span>
|
| 286 |
+
</td>
|
| 287 |
+
<td class="px-6 py-4 whitespace-nowrap text-right text-sm font-medium">
|
| 288 |
+
<a href="#" class="text-purple-600 hover:text-purple-900"><i data-feather="eye" class="w-4 h-4"></i></a>
|
| 289 |
+
</td>
|
| 290 |
+
</tr>
|
| 291 |
+
</tbody>
|
| 292 |
+
</table>
|
| 293 |
+
</div>
|
| 294 |
+
</div>
|
| 295 |
+
|
| 296 |
+
<!-- Top Products -->
|
| 297 |
+
<div class="bg-white rounded-lg shadow overflow-hidden">
|
| 298 |
+
<div class="px-6 py-4 border-b border-gray-200 flex justify-between items-center">
|
| 299 |
+
<h3 class="font-bold">Top Selling Products</h3>
|
| 300 |
+
<a href="vendor-products.html" class="text-purple-600 hover:text-purple-800 text-sm font-medium">View All</a>
|
| 301 |
+
</div>
|
| 302 |
+
<div class="overflow-x-auto">
|
| 303 |
+
<table class="min-w-full divide-y divide-gray-200">
|
| 304 |
+
<thead class="bg-gray-50">
|
| 305 |
+
<tr>
|
| 306 |
+
<th class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">Product</th>
|
| 307 |
+
<th class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">Price</th>
|
| 308 |
+
<th class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">Sold</th>
|
| 309 |
+
<th class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">Revenue</th>
|
| 310 |
+
<th class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">Rating</th>
|
| 311 |
+
<th class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">Action</th>
|
| 312 |
+
</tr>
|
| 313 |
+
</thead>
|
| 314 |
+
<tbody class="bg-white divide-y divide-gray-200">
|
| 315 |
+
<tr>
|
| 316 |
+
<td class="px-6 py-4 whitespace-nowrap">
|
| 317 |
+
<div class="flex items-center">
|
| 318 |
+
<div class="flex-shrink-0 h-10 w-10">
|
| 319 |
+
<img class="h-10 w-10 rounded" src="http://static.photos/technology/200x200/1" alt="">
|
| 320 |
+
</div>
|
| 321 |
+
<div class="ml-4">
|
| 322 |
+
<div class="text-sm font-medium text-gray-900">Wireless Headphones Pro</div>
|
| 323 |
+
<div class="text-sm text-gray-500">Electronics</div>
|
| 324 |
+
</div>
|
| 325 |
+
</div>
|
| 326 |
+
</td>
|
| 327 |
+
<td class="px-6 py-4 whitespace-nowrap text-sm text-gray-500">EGP 1,299</td>
|
| 328 |
+
<td class="px-6 py-4 whitespace-nowrap text-sm text-gray-500">45</td>
|
| 329 |
+
<td class="px-6 py-4 whitespace-nowrap text-sm text-gray-500">EGP 58,455</td>
|
| 330 |
+
<td class="px-6 py-4 whitespace-nowrap">
|
| 331 |
+
<div class="flex items-center">
|
| 332 |
+
<div class="flex text-yellow-400">
|
| 333 |
+
<i data-feather="star" class="w-4 h-4 fill-current"></i>
|
| 334 |
+
<i data-feather="star" class="w-4 h-4 fill-current"></i>
|
| 335 |
+
<i data-feather="star" class="w-4 h-4 fill-current"></i>
|
| 336 |
+
<i data-feather="star" class="w-4 h-4 fill-current"></i>
|
| 337 |
+
<i data-feather="star" class="w-4 h-4 fill-current"></i>
|
| 338 |
+
</div>
|
| 339 |
+
<span class="ml-1 text-sm text-gray-500">(24)</span>
|
| 340 |
+
</div>
|
| 341 |
+
</td>
|
| 342 |
+
<td class="px-6 py-4 whitespace-nowrap text-right text-sm font-medium">
|
| 343 |
+
<a href="#" class="text-purple-600 hover:text-purple-900 mr-3"><i data-feather="edit" class="w-4 h-4"></i></a>
|
| 344 |
+
<a href="#" class="text-red-600 hover:text-red-900"><i data-feather="trash-2" class="w-4 h-4"></i></a>
|
| 345 |
+
</td>
|
| 346 |
+
</tr>
|
| 347 |
+
<tr>
|
| 348 |
+
<td class="px-6 py-4 whitespace-nowrap">
|
| 349 |
+
<div class="flex items-center">
|
| 350 |
+
<div class="flex-shrink-0 h-10 w-10">
|
| 351 |
+
<img class="h-10 w-10 rounded" src="http://static.photos/technology/200x200/2" alt="">
|
| 352 |
+
</div>
|
| 353 |
+
<div class="ml-4">
|
| 354 |
+
<div class="text-sm font-medium text-gray-900">Smart Watch X3</div>
|
| 355 |
+
<div class="text-sm text-gray-500">Electronics</div>
|
| 356 |
+
</div>
|
| 357 |
+
</div>
|
| 358 |
+
</td>
|
| 359 |
+
<td class="px-6 py-4 whitespace-nowrap text-sm text-gray-500">EGP 2,499</td>
|
| 360 |
+
<td class="px-6 py-4 whitespace-nowrap text-sm text-gray-500">32</td>
|
| 361 |
+
<td class="px-6 py-4 whitespace-nowrap text-sm text-gray-500">EGP 79,968</td>
|
| 362 |
+
<td class="px-6 py-4 whitespace-nowrap">
|
| 363 |
+
<div class="flex items-center">
|
| 364 |
+
<div class="flex text-yellow-400">
|
| 365 |
+
<i data-feather="star" class="w-4 h-4 fill-current"></i>
|
| 366 |
+
<i data-feather="star" class="w-4 h-4 fill-current"></i>
|
| 367 |
+
<i data-feather="star" class="w-4 h-4 fill-current"></i>
|
| 368 |
+
<i data-feather="star" class="w-4 h-4 fill-current"></i>
|
| 369 |
+
<i data-feather="star" class="w-4 h-4 fill-current"></i>
|
| 370 |
+
</div>
|
| 371 |
+
<span class="ml-1 text-sm text-gray-500">(18)</span>
|
| 372 |
+
</div>
|
| 373 |
+
</td>
|
| 374 |
+
<td class="px-6 py-4 whitespace-nowrap text-right text-sm font-medium">
|
| 375 |
+
<a href="#" class="text-purple-600 hover:text-purple-900 mr-3"><i data-feather="edit" class="w-4 h-4"></i></a>
|
| 376 |
+
<a href="#" class="text-red-600 hover:text-red-900"><i data-feather="trash-2" class="w-4 h-4"></i></a>
|
| 377 |
+
</td>
|
| 378 |
+
</tr>
|
| 379 |
+
<tr>
|
| 380 |
+
<td class="px-6 py-4 whitespace-nowrap">
|
| 381 |
+
<div class="flex items-center">
|
| 382 |
+
<div class="flex-shrink-0 h-10 w-10">
|
| 383 |
+
<img class="h-10 w-10 rounded" src="http://static.photos/technology/200x200/3" alt="">
|
| 384 |
+
</div>
|
| 385 |
+
<div class="ml-4">
|
| 386 |
+
<div class="text-sm font-medium text-gray-900">Bluetooth Speaker</div>
|
| 387 |
+
<div class="text-sm text-gray-500">Electronics</div>
|
| 388 |
+
</div>
|
| 389 |
+
</div>
|
| 390 |
+
</td>
|
| 391 |
+
<td class="px-6 py-4 whitespace-nowrap text-sm text-gray-500">EGP 899</td>
|
| 392 |
+
<td class="px-6 py-4 whitespace-nowrap text-sm text-gray-500">28</td>
|
| 393 |
+
<td class="px-6 py-4 whitespace-nowrap text-sm text-gray-500">EGP 25,172</td>
|
| 394 |
+
<td class="px-6 py-4 whitespace-nowrap">
|
| 395 |
+
<div class="flex items-center">
|
| 396 |
+
<div class="flex text-yellow-400">
|
| 397 |
+
<i data-feather="star" class="w-4 h-4 fill-current"></i>
|
| 398 |
+
<i data-feather="star" class="w-4 h-4 fill-current"></i>
|
| 399 |
+
<i data-feather="star" class="w-4 h-4 fill-current"></i>
|
| 400 |
+
<i data-feather="star" class="w-4 h-4 fill-current"></i>
|
| 401 |
+
<i data-feather="star" class="w-4 h-4 fill-current"></i>
|
| 402 |
+
</div>
|
| 403 |
+
<span class="ml-1 text-sm text-gray-500">(15)</span>
|
| 404 |
+
</div>
|
| 405 |
+
</td>
|
| 406 |
+
<td class="px-6 py-4 whitespace-nowrap text-right text-sm font-medium">
|
| 407 |
+
<a href="#" class="text-purple-600 hover:text-purple-900 mr-3"><i data-feather="edit" class="w-4 h-4"></i></a>
|
| 408 |
+
<a href="#" class="text-red-600 hover:text-red-900"><i data-feather="trash-2" class="w-4 h-4"></i></a>
|
| 409 |
+
</td>
|
| 410 |
+
</tr>
|
| 411 |
+
</tbody>
|
| 412 |
+
</table>
|
| 413 |
+
</div>
|
| 414 |
+
</div>
|
| 415 |
+
</main>
|
| 416 |
+
</div>
|
| 417 |
+
</div>
|
| 418 |
+
|
| 419 |
+
<script>
|
| 420 |
+
// Initialize Feather Icons
|
| 421 |
+
feather.replace();
|
| 422 |
+
|
| 423 |
+
// Toggle Sidebar
|
| 424 |
+
document.getElementById('toggleSidebar').addEventListener('click', function() {
|
| 425 |
+
document.querySelector('.sidebar').classList.toggle('sidebar-collapsed');
|
| 426 |
+
document.querySelector('.main-content').classList.toggle('main-content-collapsed');
|
| 427 |
+
|
| 428 |
+
// Update all feather icons
|
| 429 |
+
setTimeout(() => {
|
| 430 |
+
feather.replace();
|
| 431 |
+
}, 300);
|
| 432 |
+
});
|
| 433 |
+
|
| 434 |
+
// Sales Chart
|
| 435 |
+
const salesCtx = document.getElementById('salesChart').getContext('2d');
|
| 436 |
+
const salesChart = new Chart(salesCtx, {
|
| 437 |
+
type: 'line',
|
| 438 |
+
data: {
|
| 439 |
+
labels: ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct'],
|
| 440 |
+
datasets: [{
|
| 441 |
+
label: 'Sales (EGP)',
|
| 442 |
+
data: [12000, 19000, 15000, 18000, 17000, 22000, 21000, 25000, 23000, 28000],
|
| 443 |
+
backgroundColor: 'rgba(79, 70, 229, 0.1)',
|
| 444 |
+
borderColor: 'rgba(79, 70, 229, 1)',
|
| 445 |
+
borderWidth: 2,
|
| 446 |
+
tension: 0.3,
|
| 447 |
+
fill: true
|
| 448 |
+
}]
|
| 449 |
+
},
|
| 450 |
+
options: {
|
| 451 |
+
responsive: true,
|
| 452 |
+
maintainAspectRatio: false,
|
| 453 |
+
plugins: {
|
| 454 |
+
legend: {
|
| 455 |
+
display: false
|
| 456 |
+
}
|
| 457 |
+
},
|
| 458 |
+
scales: {
|
| 459 |
+
y: {
|
| 460 |
+
beginAtZero: true,
|
| 461 |
+
grid: {
|
| 462 |
+
drawBorder: false
|
| 463 |
+
}
|
| 464 |
+
},
|
| 465 |
+
x: {
|
| 466 |
+
grid: {
|
| 467 |
+
display: false
|
| 468 |
+
}
|
| 469 |
+
}
|
| 470 |
+
}
|
| 471 |
+
}
|
| 472 |
+
});
|
| 473 |
+
|
| 474 |
+
// Orders Chart
|
| 475 |
+
const ordersCtx = document.getElementById('ordersChart').getContext('2d');
|
| 476 |
+
const ordersChart = new Chart(ordersCtx, {
|
| 477 |
+
type: 'bar',
|
| 478 |
+
data: {
|
| 479 |
+
labels: ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct'],
|
| 480 |
+
datasets: [{
|
| 481 |
+
label: 'Orders',
|
| 482 |
+
data: [45, 60, 50, 55, 60, 70, 65, 80, 75, 90],
|
| 483 |
+
backgroundColor: 'rgba(99, 102, 241, 0.7)',
|
| 484 |
+
borderColor: 'rgba(99, 102, 241, 1)',
|
| 485 |
+
borderWidth: 0
|
| 486 |
+
}]
|
| 487 |
+
},
|
| 488 |
+
options: {
|
| 489 |
+
responsive: true,
|
| 490 |
+
maintainAspectRatio: false,
|
| 491 |
+
plugins: {
|
| 492 |
+
legend: {
|
| 493 |
+
display: false
|
| 494 |
+
}
|
| 495 |
+
},
|
| 496 |
+
scales: {
|
| 497 |
+
y: {
|
| 498 |
+
beginAtZero: true,
|
| 499 |
+
grid: {
|
| 500 |
+
drawBorder: false
|
| 501 |
+
}
|
| 502 |
+
},
|
| 503 |
+
x: {
|
| 504 |
+
grid: {
|
| 505 |
+
display: false
|
| 506 |
+
}
|
| 507 |
+
}
|
| 508 |
+
}
|
| 509 |
+
}
|
| 510 |
+
});
|
| 511 |
+
</script>
|
| 512 |
+
</body>
|
| 513 |
+
</html>
|