Alexis08 commited on
Commit
12178f9
·
verified ·
1 Parent(s): 40a0774

create an adult sex toys ecommerce website under the name leisure empire that will be just listing products and people will place an order which will be stored on the database as an order to be followed up. There will be no payment function on this site - Follow Up Deployment

Browse files
Files changed (1) hide show
  1. index.html +70 -14
index.html CHANGED
@@ -49,7 +49,7 @@
49
  <div class="flex justify-between h-16">
50
  <div class="flex items-center space-x-6">
51
  <a href="#" class="text-xl font-bold text-indigo-600 flex items-center">
52
- <i class="fas fa-heart mr-2"></i>Pleasure Haven
53
  </a>
54
  <div class="hidden md:flex space-x-6">
55
  <a href="#" class="text-gray-700 hover:text-indigo-600">Home</a>
@@ -78,13 +78,68 @@
78
  <!-- Hero Section -->
79
  <div class="bg-indigo-700 text-white py-12">
80
  <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 text-center">
81
- <h1 class="text-4xl font-bold mb-4">Explore Pleasure Products</h1>
82
- <p class="text-xl mb-8">Discreet shipping and premium adult toys for all desires</p>
83
  </div>
84
  </div>
85
 
86
  <!-- Main Content -->
87
  <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 py-8">
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
88
  <!-- Order Form (Initially Hidden) -->
89
  <section id="order-form" class="hidden fixed inset-0 bg-gray-600 bg-opacity-50 flex items-center justify-center z-50 p-4">
90
  <div class="bg-white rounded-lg shadow-xl max-w-md w-full p-6">
@@ -140,8 +195,8 @@
140
  <div class="mx-auto flex items-center justify-center h-12 w-12 rounded-full bg-green-100 mb-4">
141
  <i class="fas fa-check text-green-600 text-xl"></i>
142
  </div>
143
- <h3 class="text-lg font-medium text-gray-900 mb-2">Order Placed Successfully!</h3>
144
- <p class="text-sm text-gray-500 mb-6">Thank you for your order. We'll contact you shortly to confirm the details and arrange payment.</p>
145
  <button id="close-success" class="w-full bg-indigo-600 text-white py-2 px-4 rounded-md hover:bg-indigo-700 focus:outline-none focus:ring-2 focus:ring-indigo-500 focus:ring-offset-2 transition duration-150">
146
  Continue Shopping
147
  </button>
@@ -154,8 +209,8 @@
154
  <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
155
  <div class="grid grid-cols-1 md:grid-cols-3 gap-8">
156
  <div>
157
- <h3 class="text-lg font-semibold mb-4">Pleasure Haven</h3>
158
- <p class="text-gray-400">Discreet, premium adult products for your intimate pleasure.</p>
159
  </div>
160
  <div>
161
  <div>
@@ -173,9 +228,9 @@
173
  </div>
174
  <h3 class="text-lg font-semibold mb-4">Contact Us</h3>
175
  <ul class="space-y-2 text-gray-400">
176
- <li><i class="fas fa-map-marker-alt mr-2"></i> 123 Shop Street, City</li>
177
- <li><i class="fas fa-phone mr-2"></i> (123) 456-7890</li>
178
- <li><i class="fas fa-envelope mr-2"></i> info@simpleshop.com</li>
179
  </ul>
180
  </div>
181
  </div>
@@ -255,11 +310,12 @@
255
  date: new Date().toISOString()
256
  };
257
 
258
- // In a real application, you would send this data to your server
259
- console.log('Order submitted (KES):', formData);
 
260
 
261
- // Simulate database storage
262
- localStorage.setItem('order_' + Date.now(), JSON.stringify(formData));
263
 
264
  // Show success message
265
  orderForm.classList.add('hidden');
 
49
  <div class="flex justify-between h-16">
50
  <div class="flex items-center space-x-6">
51
  <a href="#" class="text-xl font-bold text-indigo-600 flex items-center">
52
+ <i class="fas fa-crown mr-2"></i>Leisure Empire
53
  </a>
54
  <div class="hidden md:flex space-x-6">
55
  <a href="#" class="text-gray-700 hover:text-indigo-600">Home</a>
 
78
  <!-- Hero Section -->
79
  <div class="bg-indigo-700 text-white py-12">
80
  <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 text-center">
81
+ <h1 class="text-4xl font-bold mb-4">Leisure Empire Adult Toys</h1>
82
+ <p class="text-xl mb-8">Premium selection - Order now for discreet delivery</p>
83
  </div>
84
  </div>
85
 
86
  <!-- Main Content -->
87
  <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 py-8">
88
+ <!-- Featured Products by Category -->
89
+ <section class="mb-12">
90
+ <h2 class="text-2xl font-bold mb-6">Featured Adult Toys</h2>
91
+ <div class="grid grid-cols-1 sm:grid-cols-2 md:grid-cols-3 lg:grid-cols-4 gap-6">
92
+ <div class="product-card bg-white rounded-lg shadow-md overflow-hidden">
93
+ <img src="https://via.placeholder.com/300x300" alt="Product" class="w-full h-48 object-cover">
94
+ <div class="p-4">
95
+ <h3 class="font-semibold text-lg mb-1">Premium Vibrator</h3>
96
+ <p class="text-gray-600 text-sm mb-2">Multi-speed, waterproof design</p>
97
+ <div class="flex justify-between items-center">
98
+ <span class="font-bold text-indigo-600">KES 2,500</span>
99
+ <button class="bg-indigo-600 text-white px-3 py-1 rounded-md text-sm hover:bg-indigo-700">Add to Cart</button>
100
+ </div>
101
+ </div>
102
+ </div>
103
+ <!-- Repeat similar product cards for other featured adult toys -->
104
+ </div>
105
+ </section>
106
+
107
+ <section class="mb-12">
108
+ <h2 class="text-2xl font-bold mb-6">Featured Vibrators</h2>
109
+ <div class="grid grid-cols-1 sm:grid-cols-2 md:grid-cols-3 lg:grid-cols-4 gap-6">
110
+ <div class="product-card bg-white rounded-lg shadow-md overflow-hidden">
111
+ <img src="https://via.placeholder.com/300x300" alt="Product" class="w-full h-48 object-cover">
112
+ <div class="p-4">
113
+ <h3 class="font-semibold text-lg mb-1">Rabbit Vibrator</h3>
114
+ <p class="text-gray-600 text-sm mb-2">Dual stimulation, 10 patterns</p>
115
+ <div class="flex justify-between items-center">
116
+ <span class="font-bold text-indigo-600">KES 3,200</span>
117
+ <button class="bg-indigo-600 text-white px-3 py-1 rounded-md text-sm hover:bg-indigo-700">Add to Cart</button>
118
+ </div>
119
+ </div>
120
+ </div>
121
+ <!-- Repeat similar product cards for other featured vibrators -->
122
+ </div>
123
+ </section>
124
+
125
+ <section class="mb-12">
126
+ <h2 class="text-2xl font-bold mb-6">Featured Dildos</h2>
127
+ <div class="grid grid-cols-1 sm:grid-cols-2 md:grid-cols-3 lg:grid-cols-4 gap-6">
128
+ <div class="product-card bg-white rounded-lg shadow-md overflow-hidden">
129
+ <img src="https://via.placeholder.com/300x300" alt="Product" class="w-full h-48 object-cover">
130
+ <div class="p-4">
131
+ <h3 class="font-semibold text-lg mb-1">Realistic Dildo</h3>
132
+ <p class="text-gray-600 text-sm mb-2">Life-like texture, suction base</p>
133
+ <div class="flex justify-between items-center">
134
+ <span class="font-bold text-indigo-600">KES 2,800</span>
135
+ <button class="bg-indigo-600 text-white px-3 py-1 rounded-md text-sm hover:bg-indigo-700">Add to Cart</button>
136
+ </div>
137
+ </div>
138
+ </div>
139
+ <!-- Repeat similar product cards for other featured dildos -->
140
+ </div>
141
+ </section>
142
+
143
  <!-- Order Form (Initially Hidden) -->
144
  <section id="order-form" class="hidden fixed inset-0 bg-gray-600 bg-opacity-50 flex items-center justify-center z-50 p-4">
145
  <div class="bg-white rounded-lg shadow-xl max-w-md w-full p-6">
 
195
  <div class="mx-auto flex items-center justify-center h-12 w-12 rounded-full bg-green-100 mb-4">
196
  <i class="fas fa-check text-green-600 text-xl"></i>
197
  </div>
198
+ <h3 class="text-lg font-medium text-gray-900 mb-2">Order Received!</h3>
199
+ <p class="text-sm text-gray-500 mb-6">Thank you for your order. We'll contact you within 24 hours to confirm availability and arrange payment & delivery.</p>
200
  <button id="close-success" class="w-full bg-indigo-600 text-white py-2 px-4 rounded-md hover:bg-indigo-700 focus:outline-none focus:ring-2 focus:ring-indigo-500 focus:ring-offset-2 transition duration-150">
201
  Continue Shopping
202
  </button>
 
209
  <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
210
  <div class="grid grid-cols-1 md:grid-cols-3 gap-8">
211
  <div>
212
+ <h3 class="text-lg font-semibold mb-4">Leisure Empire</h3>
213
+ <p class="text-gray-400">Premium adult toys for your intimate leisure.</p>
214
  </div>
215
  <div>
216
  <div>
 
228
  </div>
229
  <h3 class="text-lg font-semibold mb-4">Contact Us</h3>
230
  <ul class="space-y-2 text-gray-400">
231
+ <li><i class="fas fa-map-marker-alt mr-2"></i> Nairobi</li>
232
+ <li><i class="fas fa-phone mr-2"></i> +2540715841575</li>
233
+ <li><i class="fas fa-envelope mr-2"></i> pleasurehaven@gmail.com</li>
234
  </ul>
235
  </div>
236
  </div>
 
310
  date: new Date().toISOString()
311
  };
312
 
313
+ // Store order in localStorage (replace with your database storage)
314
+ const orderId = 'order_' + Date.now();
315
+ localStorage.setItem(orderId, JSON.stringify(formData));
316
 
317
+ // In a real app, you would send to your backend here
318
+ console.log('Order submitted for follow-up:', orderId, formData);
319
 
320
  // Show success message
321
  orderForm.classList.add('hidden');