Hugging Face's logo

Spaces:
steake
/
uandme2
Running

App Files Community
steake commited on
Commit
2f5d801
·
verified ·
1 Parent(s): 728fdef

Add 3 files

Browse files
Files changed (3) hide show
  1. README.md +6 -4
  2. index.html +676 -19
  3. prompts.txt +0 -0
README.md CHANGED
@@ -1,10 +1,12 @@
1
  ---
2
- title: Uandme2
3
- emoji: 💻
4
- colorFrom: purple
5
  colorTo: red
6
  sdk: static
7
  pinned: false
 
 
8
  ---
9
 
10
- Check out the configuration reference at https://huggingface.co/docs/hub/spaces-config-reference
 
1
  ---
2
+ title: uandme2
3
+ emoji: 🐳
4
+ colorFrom: gray
5
  colorTo: red
6
  sdk: static
7
  pinned: false
8
+ tags:
9
+ - deepsite
10
  ---
11
 
12
+ Check out the configuration reference at https://huggingface.co/docs/hub/spaces-config-reference
index.html CHANGED
@@ -1,19 +1,676 @@
1
- <!doctype html>
2
- <html>
3
- <head>
4
- <meta charset="utf-8" />
5
- <meta name="viewport" content="width=device-width" />
6
- <title>My static Space</title>
7
- <link rel="stylesheet" href="style.css" />
8
- </head>
9
- <body>
10
- <div class="card">
11
- <h1>Welcome to your static Space!</h1>
12
- <p>You can modify this app directly by editing <i>index.html</i> in the Files and versions tab.</p>
13
- <p>
14
- Also don't forget to check the
15
- <a href="https://huggingface.co/docs/hub/spaces" target="_blank">Spaces documentation</a>.
16
- </p>
17
- </div>
18
- </body>
19
- </html>
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
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>You & Me Pub & Hostel | Kampot, Cambodia</title>
7
+ <script src="https://cdn.tailwindcss.com"></script>
8
+ <link rel="preconnect" href="https://fonts.googleapis.com">
9
+ <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
10
+ <link href="https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@400;500;700&family=Inter:wght@300;400;500&display=swap" rel="stylesheet">
11
+ <script>
12
+ tailwind.config = {
13
+ theme: {
14
+ extend: {
15
+ colors: {
16
+ 'sunset-yellow': '#FFD166',
17
+ 'sunset-orange': '#F4A261',
18
+ 'sunset-pink': '#EF476F',
19
+ 'sunset-purple': '#9C6ADE',
20
+ 'sunset-blue': '#118AB2',
21
+ 'electric-blue': '#06AED5',
22
+ 'amber': '#FF9F1C',
23
+ },
24
+ fontFamily: {
25
+ heading: ['Space Grotesk', 'sans-serif'],
26
+ body: ['Inter', 'sans-serif'],
27
+ },
28
+ backgroundImage: {
29
+ 'sunset-gradient': 'linear-gradient(to right, #FFD166, #F4A261, #EF476F, #9C6ADE, #118AB2)',
30
+ 'logo-gradient': 'radial-gradient(circle, #FFD166, #F4A261, #EF476F, #9C6ADE, #118AB2)',
31
+ }
32
+ }
33
+ }
34
+ }
35
+ </script>
36
+ <style>
37
+ .logo-circle {
38
+ width: 80px;
39
+ height: 80px;
40
+ border-radius: 50%;
41
+ display: flex;
42
+ align-items: center;
43
+ justify-content: center;
44
+ box-shadow: 0 4px 15px rgba(0,0,0,0.2);
45
+ transition: transform 0.3s ease;
46
+ }
47
+ .logo-circle:hover {
48
+ transform: rotate(15deg) scale(1.05);
49
+ }
50
+ .cocktail-icon {
51
+ font-size: 40px;
52
+ color: white;
53
+ }
54
+ .nav-link {
55
+ position: relative;
56
+ }
57
+ .nav-link:after {
58
+ content: '';
59
+ position: absolute;
60
+ width: 0;
61
+ height: 2px;
62
+ bottom: -2px;
63
+ left: 0;
64
+ background: currentColor;
65
+ transition: width 0.3s ease;
66
+ }
67
+ .nav-link:hover:after {
68
+ width: 100%;
69
+ }
70
+ .gallery-grid {
71
+ display: grid;
72
+ grid-template-columns: repeat(auto-fill, minmax(250px, 1fr));
73
+ gap: 1rem;
74
+ }
75
+ .loyalty-card {
76
+ perspective: 1000px;
77
+ }
78
+ .loyalty-card-inner {
79
+ transition: transform 0.6s;
80
+ transform-style: preserve-3d;
81
+ }
82
+ .loyalty-card:hover .loyalty-card-inner {
83
+ transform: rotateY(180deg);
84
+ }
85
+ .loyalty-card-front, .loyalty-card-back {
86
+ backface-visibility: hidden;
87
+ }
88
+ .loyalty-card-back {
89
+ transform: rotateY(180deg);
90
+ }
91
+ .lazy-load {
92
+ opacity: 0;
93
+ transition: opacity 0.5s ease;
94
+ }
95
+ .lazy-load.loaded {
96
+ opacity: 1;
97
+ }
98
+ </style>
99
+ </head>
100
+ <body class="font-body bg-white text-gray-800">
101
+ <!-- Header -->
102
+ <header class="sticky top-0 z-50 bg-white shadow-sm">
103
+ <div class="container mx-auto px-4 py-3 flex justify-between items-center">
104
+ <a href="#" class="flex items-center">
105
+ <div class="logo-circle bg-gradient-to-br from-sunset-yellow to-sunset-blue mr-3">
106
+ <span class="cocktail-icon">🍹</span>
107
+ </div>
108
+ <span class="font-heading text-xl font-bold text-transparent bg-clip-text bg-gradient-to-r from-sunset-yellow to-sunset-blue">You & Me</span>
109
+ </a>
110
+
111
+ <nav class="hidden md:flex space-x-8">
112
+ <a href="#" class="nav-link font-medium text-sunset-blue hover:text-sunset-pink">Home</a>
113
+ <a href="#events" class="nav-link font-medium text-sunset-blue hover:text-sunset-pink">Events</a>
114
+ <a href="#book" class="nav-link font-medium text-sunset-blue hover:text-sunset-pink">Book a Bed</a>
115
+ <a href="#join" class="nav-link font-medium text-sunset-blue hover:text-sunset-pink">Join Telegram</a>
116
+ </nav>
117
+
118
+ <button class="bg-amber text-white px-4 py-2 rounded-full font-medium shadow-md hover:shadow-lg transform hover:scale-105 transition-all">
119
+ Tonight's Free Shot Code
120
+ </button>
121
+
122
+ <!-- Mobile menu button -->
123
+ <button id="mobile-menu-button" class="md:hidden text-sunset-blue">
124
+ <svg class="w-6 h-6" fill="none" stroke="currentColor" viewBox="0 0 24 24">
125
+ <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4 6h16M4 12h16M4 18h16"></path>
126
+ </svg>
127
+ </button>
128
+ </div>
129
+
130
+ <!-- Mobile menu -->
131
+ <div id="mobile-menu" class="hidden md:hidden bg-white py-2 px-4 shadow-md">
132
+ <a href="#" class="block py-2 font-medium text-sunset-blue">Home</a>
133
+ <a href="#events" class="block py-2 font-medium text-sunset-blue">Events</a>
134
+ <a href="#book" class="block py-2 font-medium text-sunset-blue">Book a Bed</a>
135
+ <a href="#join" class="block py-2 font-medium text-sunset-blue">Join Telegram</a>
136
+ </div>
137
+ </header>
138
+
139
+ <!-- Hero Section -->
140
+ <section class="relative bg-gradient-to-b from-white to-sunset-yellow/10 py-20">
141
+ <div class="container mx-auto px-4 flex flex-col items-center text-center">
142
+ <div class="logo-circle bg-gradient-to-br from-sunset-yellow to-sunset-blue mb-8">
143
+ <span class="cocktail-icon">🍹</span>
144
+ </div>
145
+
146
+ <h1 class="font-heading text-4xl md:text-6xl font-bold mb-4 text-transparent bg-clip-text bg-gradient-to-r from-sunset-yellow to-sunset-blue">
147
+ Drink. Chill. Crash. Repeat.
148
+ </h1>
149
+
150
+ <p class="text-lg md:text-xl max-w-2xl mb-8 text-gray-700">
151
+ The only pub in Kampot where you can party, sleep, and wake up to do it again.
152
+ </p>
153
+
154
+ <div class="flex flex-col sm:flex-row gap-4">
155
+ <a href="#join" class="bg-electric-blue text-white px-8 py-3 rounded-full font-bold shadow-md hover:shadow-lg transform hover:scale-105 transition-all">
156
+ Join Telegram
157
+ </a>
158
+ <a href="#book" class="bg-amber text-white px-8 py-3 rounded-full font-bold shadow-md hover:shadow-lg transform hover:scale-105 transition-all">
159
+ Book a Bed
160
+ </a>
161
+ </div>
162
+ </div>
163
+
164
+ <div class="absolute bottom-0 left-0 right-0 h-16 bg-gradient-to-t from-white to-transparent"></div>
165
+ </section>
166
+
167
+ <!-- Tonight at the Pub -->
168
+ <section id="events" class="py-16 bg-white">
169
+ <div class="container mx-auto px-4">
170
+ <h2 class="font-heading text-3xl font-bold mb-8 text-center text-sunset-blue">
171
+ Tonight at the Pub
172
+ </h2>
173
+
174
+ <div class="max-w-2xl mx-auto bg-gradient-to-r from-sunset-yellow/10 to-sunset-blue/10 p-6 rounded-xl shadow-md">
175
+ <div class="flex items-center mb-4">
176
+ <div class="bg-sunset-pink text-white p-2 rounded-full mr-3">
177
+ <svg class="w-6 h-6" fill="none" stroke="currentColor" viewBox="0 0 24 24">
178
+ <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M11 5.882V19.24a1.76 1.76 0 01-3.417.592l-2.147-6.15M18 13a3 3 0 100-6M5.436 13.683A4.001 4.001 0 017 6h1.832c4.1 0 7.625-1.234 9.168-3v14c-1.543-1.766-5.067-3-9.168-3H7a3.988 3.988 0 01-1.564-.317z"></path>
179
+ </svg>
180
+ </div>
181
+ <h3 class="font-heading text-xl font-bold text-sunset-pink">Live Events</h3>
182
+ </div>
183
+
184
+ <div id="event-content" class="space-y-3">
185
+ <p class="text-lg"><span class="font-bold">8:00 PM</span> - Open Mic Night</p>
186
+ <p class="text-lg"><span class="font-bold">5:00-7:00 PM</span> - $1 Beers Happy Hour</p>
187
+ <p class="text-lg font-bold text-sunset-pink">Free shot if you say: "Sticky Mango"</p>
188
+ </div>
189
+
190
+ <div class="mt-6 pt-4 border-t border-gray-200">
191
+ <p class="text-sm text-gray-500">Events update daily. Join our Telegram for real-time updates.</p>
192
+ </div>
193
+ </div>
194
+ </div>
195
+ </section>
196
+
197
+ <!-- Sleep with Us -->
198
+ <section id="book" class="py-16 bg-gradient-to-b from-white to-sunset-blue/10">
199
+ <div class="container mx-auto px-4">
200
+ <h2 class="font-heading text-3xl font-bold mb-8 text-center text-sunset-blue">
201
+ Sleep with Us
202
+ </h2>
203
+
204
+ <div class="max-w-4xl mx-auto grid md:grid-cols-2 gap-8">
205
+ <div class="bg-white p-6 rounded-xl shadow-md">
206
+ <div class="flex items-center mb-4">
207
+ <div class="bg-sunset-blue text-white p-2 rounded-full mr-3">
208
+ <svg class="w-6 h-6" fill="none" stroke="currentColor" viewBox="0 0 24 24">
209
+ <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M20 7l-8-4-8 4m16 0l-8 4m8-4v10l-8 4m0-10L4 7m8 4v10M4 7v10l8 4"></path>
210
+ </svg>
211
+ </div>
212
+ <h3 class="font-heading text-xl font-bold text-sunset-blue">10-Bed Mixed Dorm</h3>
213
+ </div>
214
+
215
+ <ul class="space-y-2 mb-6">
216
+ <li class="flex items-center">
217
+ <svg class="w-5 h-5 text-sunset-blue mr-2" fill="none" stroke="currentColor" viewBox="0 0 24 24">
218
+ <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7"></path>
219
+ </svg>
220
+ <span>Only $5/night</span>
221
+ </li>
222
+ <li class="flex items-center">
223
+ <svg class="w-5 h-5 text-sunset-blue mr-2" fill="none" stroke="currentColor" viewBox="0 0 24 24">
224
+ <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7"></path>
225
+ </svg>
226
+ <span>Air-conditioned</span>
227
+ </li>
228
+ <li class="flex items-center">
229
+ <svg class="w-5 h-5 text-sunset-blue mr-2" fill="none" stroke="currentColor" viewBox="0 0 24 24">
230
+ <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7"></path>
231
+ </svg>
232
+ <span>Secure lockers</span>
233
+ </li>
234
+ <li class="flex items-center">
235
+ <svg class="w-5 h-5 text-sunset-blue mr-2" fill="none" stroke="currentColor" viewBox="0 0 24 24">
236
+ <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7"></path>
237
+ </svg>
238
+ <span>Free high-speed Wi-Fi</span>
239
+ </li>
240
+ </ul>
241
+
242
+ <button class="w-full bg-sunset-blue text-white px-6 py-3 rounded-full font-bold shadow-md hover:shadow-lg transform hover:scale-[1.02] transition-all">
243
+ Check Bed Availability
244
+ </button>
245
+ </div>
246
+
247
+ <div class="bg-white p-6 rounded-xl shadow-md">
248
+ <div class="flex items-center mb-4">
249
+ <div class="bg-amber text-white p-2 rounded-full mr-3">
250
+ <svg class="w-6 h-6" fill="none" stroke="currentColor" viewBox="0 0 24 24">
251
+ <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M3 10h18M7 15h1m4 0h1m-7 4h12a3 3 0 003-3V8a3 3 0 00-3-3H6a3 3 0 00-3 3v8a3 3 0 003 3z"></path>
252
+ </svg>
253
+ </div>
254
+ <h3 class="font-heading text-xl font-bold text-amber">Special Offers</h3>
255
+ </div>
256
+
257
+ <ul class="space-y-3 mb-6">
258
+ <li class="flex items-start">
259
+ <svg class="w-5 h-5 text-amber mr-2 mt-1" fill="none" stroke="currentColor" viewBox="0 0 24 24">
260
+ <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7"></path>
261
+ </svg>
262
+ <span><span class="font-bold">Stay 3+ nights</span> - Get 1 free drink per night</span>
263
+ </li>
264
+ <li class="flex items-start">
265
+ <svg class="w-5 h-5 text-amber mr-2 mt-1" fill="none" stroke="currentColor" viewBox="0 0 24 24">
266
+ <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7"></path>
267
+ </svg>
268
+ <span><span class="font-bold">Weekly rate</span> - Only $30 (save $5)</span>
269
+ </li>
270
+ <li class="flex items-start">
271
+ <svg class="w-5 h-5 text-amber mr-2 mt-1" fill="none" stroke="currentColor" viewBox="0 0 24 24">
272
+ <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7"></path>
273
+ </svg>
274
+ <span><span class="font-bold">Late checkout</span> - Until 2PM for dorm guests</span>
275
+ </li>
276
+ </ul>
277
+
278
+ <button class="w-full bg-amber text-white px-6 py-3 rounded-full font-bold shadow-md hover:shadow-lg transform hover:scale-[1.02] transition-all">
279
+ See All Offers
280
+ </button>
281
+ </div>
282
+ </div>
283
+ </div>
284
+ </section>
285
+
286
+ <!-- Gallery -->
287
+ <section class="py-16 bg-white">
288
+ <div class="container mx-auto px-4">
289
+ <h2 class="font-heading text-3xl font-bold mb-8 text-center text-sunset-blue">
290
+ Life at You & Me
291
+ </h2>
292
+
293
+ <div class="gallery-grid">
294
+ <img src="https://images.unsplash.com/photo-1514933651103-005eec06c04b?ixlib=rb-1.2.1&auto=format&fit=crop&w=500&q=80" alt="Bar area" class="lazy-load rounded-lg shadow-md aspect-square object-cover" loading="lazy">
295
+ <img src="https://images.unsplash.com/photo-1551632436-cbf8dd35adfa?ixlib=rb-1.2.1&auto=format&fit=crop&w=500&q=80" alt="Dormitory" class="lazy-load rounded-lg shadow-md aspect-square object-cover" loading="lazy">
296
+ <img src="https://images.unsplash.com/photo-1555396273-367ea4eb4db5?ixlib=rb-1.2.1&auto=format&fit=crop&w=500&q=80" alt="Cocktails" class="lazy-load rounded-lg shadow-md aspect-square object-cover" loading="lazy">
297
+ <img src="https://images.unsplash.com/photo-1530103862676-de8c9debad1d?ixlib=rb-1.2.1&auto=format&fit=crop&w=500&q=80" alt="Pub atmosphere" class="lazy-load rounded-lg shadow-md aspect-square object-cover" loading="lazy">
298
+ <img src="https://images.unsplash.com/photo-1527525443983-6e60c75fff46?ixlib=rb-1.2.1&auto=format&fit=crop&w=500&q=80" alt="Guests socializing" class="lazy-load rounded-lg shadow-md aspect-square object-cover" loading="lazy">
299
+ <img src="https://images.unsplash.com/photo-1520250497591-112f2f40a3f4?ixlib=rb-1.2.1&auto=format&fit=crop&w=500&q=80" alt="Hostel common area" class="lazy-load rounded-lg shadow-md aspect-square object-cover" loading="lazy">
300
+ </div>
301
+ </div>
302
+ </section>
303
+
304
+ <!-- Join the Party -->
305
+ <section id="join" class="py-16 bg-gradient-to-b from-white to-sunset-pink/10">
306
+ <div class="container mx-auto px-4">
307
+ <div class="max-w-4xl mx-auto bg-white rounded-xl shadow-md overflow-hidden">
308
+ <div class="md:flex">
309
+ <div class="md:w-1/2 p-8">
310
+ <h2 class="font-heading text-3xl font-bold mb-4 text-sunset-pink">
311
+ Join the Party
312
+ </h2>
313
+
314
+ <p class="text-lg mb-6">
315
+ Insider deals. Secret events. Free drinks. Join the crew on Telegram.
316
+ </p>
317
+
318
+ <div class="flex items-center space-x-4 mb-6">
319
+ <div class="bg-gray-100 p-3 rounded-lg">
320
+ <img src="https://api.qrserver.com/v1/create-qr-code/?size=150x150&data=https://t.me/youandmepubkampot" alt="Telegram QR Code" class="w-32 h-32">
321
+ </div>
322
+ <div>
323
+ <p class="text-sm text-gray-500 mb-2">Scan or click below:</p>
324
+ <a href="https://t.me/youandmepubkampot" class="inline-block bg-electric-blue text-white px-6 py-3 rounded-full font-bold shadow-md hover:shadow-lg transform hover:scale-[1.02] transition-all">
325
+ Join Telegram Group
326
+ </a>
327
+ </div>
328
+ </div>
329
+
330
+ <p class="text-sm text-gray-500">
331
+ 500+ members. Daily updates. No spam.
332
+ </p>
333
+ </div>
334
+
335
+ <div class="md:w-1/2 bg-gradient-to-br from-sunset-yellow/20 to-sunset-pink/20 flex items-center justify-center p-8">
336
+ <div class="text-center">
337
+ <div class="text-6xl mb-4">🎉</div>
338
+ <h3 class="font-heading text-xl font-bold mb-2 text-sunset-pink">
339
+ Exclusive Member Perks
340
+ </h3>
341
+ <ul class="space-y-2 text-left">
342
+ <li class="flex items-center">
343
+ <svg class="w-5 h-5 text-sunset-pink mr-2" fill="none" stroke="currentColor" viewBox="0 0 24 24">
344
+ <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7"></path>
345
+ </svg>
346
+ <span>Free birthday shot</span>
347
+ </li>
348
+ <li class="flex items-center">
349
+ <svg class="w-5 h-5 text-sunset-pink mr-2" fill="none" stroke="currentColor" viewBox="0 0 24 24">
350
+ <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7"></path>
351
+ </svg>
352
+ <span>Member-only happy hours</span>
353
+ </li>
354
+ <li class="flex items-center">
355
+ <svg class="w-5 h-5 text-sunset-pink mr-2" fill="none" stroke="currentColor" viewBox="0 0 24 24">
356
+ <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7"></path>
357
+ </svg>
358
+ <span>First access to special events</span>
359
+ </li>
360
+ </ul>
361
+ </div>
362
+ </div>
363
+ </div>
364
+ </div>
365
+ </div>
366
+ </section>
367
+
368
+ <!-- Loyalty + Referral -->
369
+ <section class="py-16 bg-white">
370
+ <div class="container mx-auto px-4">
371
+ <div class="max-w-4xl mx-auto">
372
+ <h2 class="font-heading text-3xl font-bold mb-8 text-center text-sunset-blue">
373
+ Loyalty Rewards
374
+ </h2>
375
+
376
+ <div class="grid md:grid-cols-2 gap-8 items-center">
377
+ <div class="loyalty-card">
378
+ <div class="loyalty-card-inner relative">
379
+ <div class="loyalty-card-front bg-gradient-to-br from-sunset-yellow/10 to-sunset-blue/10 p-6 rounded-xl shadow-md">
380
+ <h3 class="font-heading text-xl font-bold mb-4 text-sunset-blue">Punch Card</h3>
381
+ <p class="mb-6">Buy 9 drinks, get your 10th free!</p>
382
+ <div class="grid grid-cols-5 gap-2">
383
+ <div class="h-12 rounded-full border-2 border-sunset-blue flex items-center justify-center">1</div>
384
+ <div class="h-12 rounded-full border-2 border-sunset-blue flex items-center justify-center">2</div>
385
+ <div class="h-12 rounded-full border-2 border-sunset-blue flex items-center justify-center">3</div>
386
+ <div class="h-12 rounded-full border-2 border-sunset-blue flex items-center justify-center">4</div>
387
+ <div class="h-12 rounded-full border-2 border-sunset-blue flex items-center justify-center">5</div>
388
+ <div class="h-12 rounded-full border-2 border-sunset-blue flex items-center justify-center">6</div>
389
+ <div class="h-12 rounded-full border-2 border-sunset-blue flex items-center justify-center">7</div>
390
+ <div class="h-12 rounded-full border-2 border-sunset-blue flex items-center justify-center">8</div>
391
+ <div class="h-12 rounded-full border-2 border-sunset-blue flex items-center justify-center">9</div>
392
+ <div class="h-12 rounded-full bg-sunset-blue text-white flex items-center justify-center">FREE</div>
393
+ </div>
394
+ <p class="text-sm text-gray-500 mt-4">Ask at the bar for your physical card</p>
395
+ </div>
396
+ <div class="loyalty-card-back absolute inset-0 bg-gradient-to-br from-sunset-pink/10 to-amber/10 p-6 rounded-xl shadow-md flex flex-col justify-center">
397
+ <h3 class="font-heading text-xl font-bold mb-4 text-sunset-pink">Referral Bonus</h3>
398
+ <p class="mb-6">Bring a friend, get a free shot!</p>
399
+ <div class="bg-gray-100 p-3 rounded-lg mx-auto mb-4">
400
+ <img src="https://api.qrserver.com/v1/create-qr-code/?size=150x150&data=https://youandme.pub/refer" alt="Referral QR Code" class="w-32 h-32">
401
+ </div>
402
+ <p class="text-sm text-center text-gray-500">Show this QR code when you arrive with a new guest</p>
403
+ </div>
404
+ </div>
405
+ </div>
406
+
407
+ <div>
408
+ <h3 class="font-heading text-xl font-bold mb-4 text-amber">How It Works</h3>
409
+ <ul class="space-y-4">
410
+ <li class="flex items-start">
411
+ <div class="bg-amber text-white rounded-full p-1 mr-3 mt-1">
412
+ <svg class="w-4 h-4" fill="none" stroke="currentColor" viewBox="0 0 24 24">
413
+ <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7"></path>
414
+ </svg>
415
+ </div>
416
+ <span>Get your loyalty card at the bar (physical or digital)</span>
417
+ </li>
418
+ <li class="flex items-start">
419
+ <div class="bg-amber text-white rounded-full p-1 mr-3 mt-1">
420
+ <svg class="w-4 h-4" fill="none" stroke="currentColor" viewBox="0 0 24 24">
421
+ <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7"></path>
422
+ </svg>
423
+ </div>
424
+ <span>Get a punch for each drink purchased</span>
425
+ </li>
426
+ <li class="flex items-start">
427
+ <div class="bg-amber text-white rounded-full p-1 mr-3 mt-1">
428
+ <svg class="w-4 h-4" fill="none" stroke="currentColor" viewBox="0 0 24 24">
429
+ <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7"></path>
430
+ </svg>
431
+ </div>
432
+ <span>10th drink is free (any drink under $5)</span>
433
+ </li>
434
+ <li class="flex items-start">
435
+ <div class="bg-amber text-white rounded-full p-1 mr-3 mt-1">
436
+ <svg class="w-4 h-4" fill="none" stroke="currentColor" viewBox="0 0 24 24">
437
+ <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7"></path>
438
+ </svg>
439
+ </div>
440
+ <span>Refer friends for instant free shots</span>
441
+ </li>
442
+ </ul>
443
+ </div>
444
+ </div>
445
+ </div>
446
+ </div>
447
+ </section>
448
+
449
+ <!-- Find Us -->
450
+ <section class="py-16 bg-gradient-to-b from-white to-sunset-blue/10">
451
+ <div class="container mx-auto px-4">
452
+ <h2 class="font-heading text-3xl font-bold mb-8 text-center text-sunset-blue">
453
+ Find Us
454
+ </h2>
455
+
456
+ <div class="max-w-6xl mx-auto grid md:grid-cols-2 gap-8">
457
+ <div class="bg-white p-6 rounded-xl shadow-md">
458
+ <div class="h-64 md:h-full rounded-lg overflow-hidden">
459
+ <iframe
460
+ src="https://www.google.com/maps/embed?pb=!1m18!1m12!1m3!1d3925.432183857843!2d104.1812723152776!3d10.48199219251801!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x3108c3d2a5f3b3a5%3A0x5a9d5c639f3a3a1!2sKampot%20Old%20Market!5e0!3m2!1sen!2skh!4v1620000000000!5m2!1sen!2skh"
461
+ width="100%"
462
+ height="100%"
463
+ style="border:0;"
464
+ allowfullscreen=""
465
+ loading="lazy"
466
+ class="lazy-load"
467
+ ></iframe>
468
+ </div>
469
+ </div>
470
+
471
+ <div>
472
+ <div class="bg-white p-6 rounded-xl shadow-md mb-6">
473
+ <h3 class="font-heading text-xl font-bold mb-4 text-sunset-blue">Location</h3>
474
+ <p class="mb-4">123 Riverside Road, Kampot, Cambodia</p>
475
+ <p class="text-sm text-gray-500">3 minutes walk from the Old Market</p>
476
+ </div>
477
+
478
+ <div class="bg-white p-6 rounded-xl shadow-md mb-6">
479
+ <h3 class="font-heading text-xl font-bold mb-4 text-sunset-blue">Hours</h3>
480
+ <p class="mb-2"><span class="font-bold">Pub:</span> 12PM – Late (every day)</p>
481
+ <p><span class="font-bold">Reception:</span> 8AM – 10PM</p>
482
+ </div>
483
+
484
+ <div class="bg-white p-6 rounded-xl shadow-md">
485
+ <h3 class="font-heading text-xl font-bold mb-4 text-sunset-blue">Contact</h3>
486
+ <div class="space-y-3">
487
+ <div class="flex items-center">
488
+ <svg class="w-5 h-5 text-sunset-blue mr-2" fill="none" stroke="currentColor" viewBox="0 0 24 24">
489
+ <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M3 5a2 2 0 012-2h3.28a1 1 0 01.948.684l1.498 4.493a1 1 0 01-.502 1.21l-2.257 1.13a11.042 11.042 0 005.516 5.516l1.13-2.257a1 1 0 011.21-.502l4.493 1.498a1 1 0 01.684.949V19a2 2 0 01-2 2h-1C9.716 21 3 14.284 3 6V5z"></path>
490
+ </svg>
491
+ <span>+855 12 345 678</span>
492
+ </div>
493
+ <div class="flex items-center">
494
+ <svg class="w-5 h-5 text-sunset-blue mr-2" fill="none" stroke="currentColor" viewBox="0 0 24 24">
495
+ <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M8 10h.01M12 10h.01M16 10h.01M9 16H5a2 2 0 01-2-2V6a2 2 0 012-2h14a2 2 0 012 2v8a2 2 0 01-2 2h-5l-5 5v-5z"></path>
496
+ </svg>
497
+ <span>WhatsApp / Messenger</span>
498
+ </div>
499
+ <div class="flex items-center">
500
+ <svg class="w-5 h-5 text-sunset-blue mr-2" fill="none" stroke="currentColor" viewBox="0 0 24 24">
501
+ <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M3 8l7.89 5.26a2 2 0 002.22 0L21 8M5 19h14a2 2 0 002-2V7a2 2 0 00-2-2H5a2 2 0 00-2 2v10a2 2 0 002 2z"></path>
502
+ </svg>
503
+ <span>hello@youandme.pub</span>
504
+ </div>
505
+ </div>
506
+ </div>
507
+ </div>
508
+ </div>
509
+ </div>
510
+ </section>
511
+
512
+ <!-- Footer -->
513
+ <footer class="bg-sunset-blue text-white py-12">
514
+ <div class="container mx-auto px-4">
515
+ <div class="flex flex-col md:flex-row justify-between items-center mb-8">
516
+ <div class="flex items-center mb-6 md:mb-0">
517
+ <div class="logo-circle bg-gradient-to-br from-sunset-yellow to-sunset-blue mr-3">
518
+ <span class="cocktail-icon">🍹</span>
519
+ </div>
520
+ <span class="font-heading text-xl font-bold">You & Me Pub & Hostel</span>
521
+ </div>
522
+
523
+ <div class="flex space-x-6">
524
+ <a href="https://t.me/youandmepubkampot" class="text-white hover:text-sunset-yellow transition-colors">
525
+ <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24">
526
+ <path d="M11.944 0A12 12 0 0 0 0 12a12 12 0 0 0 12 12 12 12 0 0 0 12-12A12 12 0 0 0 12 0a12 12 0 0 0-.056 0zm4.962 7.224c.1-.002.321.023.465.14a.506.506 0 0 1 .171.325c.016.093.036.306.02.472-.18 1.898-.962 6.502-1.36 8.627-.168.9-.499 1.201-.82 1.23-.696.065-1.225-.46-1.9-.902-1.056-.693-1.653-1.124-2.678-1.8-1.185-.78-.417-1.21.258-1.91.177-.184 3.247-2.977 3.307-3.23.007-.032.014-.15-.056-.212s-.174-.041-.249-.024c-.106.024-1.793 1.14-5.061 3.345-.48.33-.913.49-1.302.48-.428-.008-1.252-.241-1.865-.44-.752-.245-1.349-.374-1.297-.789.027-.216.325-.437.893-.663 3.498-1.524 5.83-2.529 6.998-3.014 3.332-1.386 4.025-1.627 4.476-1.635z"/>
527
+ </svg>
528
+ </a>
529
+ <a href="https://facebook.com/youandmepubkampot" class="text-white hover:text-sunset-yellow transition-colors">
530
+ <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24">
531
+ <path d="M22 12c0-5.523-4.477-10-10-10S2 6.477 2 12c0 4.991 3.657 9.128 8.438 9.878v-6.987h-2.54V12h2.54V9.797c0-2.506 1.492-3.89 3.777-3.89 1.094 0 2.238.195 2.238.195v2.46h-1.26c-1.243 0-1.63.771-1.63 1.562V12h2.773l-.443 2.89h-2.33v6.988C18.343 21.128 22 16.991 22 12z"/>
532
+ </svg>
533
+ </a>
534
+ <a href="https://instagram.com/youandmepubkampot" class="text-white hover:text-sunset-yellow transition-colors">
535
+ <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24">
536
+ <path d="M12 2.163c3.204 0 3.584.012 4.85.07 3.252.148 4.771 1.691 4.919 4.919.058 1.265.069 1.645.069 4.849 0 3.205-.012 3.584-.069 4.849-.149 3.225-1.664 4.771-4.919 4.919-1.266.058-1.644.07-4.85.07-3.204 0-3.584-.012-4.849-.07-3.26-.149-4.771-1.699-4.919-4.92-.058-1.265-.07-1.644-.07-4.849 0-3.204.013-3.583.07-4.849.149-3.227 1.664-4.771 4.919-4.919 1.266-.057 1.645-.069 4.849-.069zM12 0C8.741 0 8.333.014 7.053.072 2.695.272.273 2.69.073 7.052.014 8.333 0 8.741 0 12c0 3.259.014 3.668.072 4.948.2 4.358 2.618 6.78 6.98 6.98C8.333 23.986 8.741 24 12 24c3.259 0 3.668-.014 4.948-.072 4.354-.2 6.782-2.618 6.979-6.98.059-1.28.073-1.689.073-4.948 0-3.259-.014-3.667-.072-4.947-.196-4.354-2.617-6.78-6.979-6.98C15.668.014 15.259 0 12 0zm0 5.838a6.162 6.162 0 100 12.324 6.162 6.162 0 000-12.324zM12 16a4 4 0 110-8 4 4 0 010 8zm6.406-11.845a1.44 1.44 0 100 2.881 1.44 1.44 0 000-2.881z"/>
537
+ </svg>
538
+ </a>
539
+ </div>
540
+ </div>
541
+
542
+ <div class="border-t border-sunset-blue/30 pt-8 text-center">
543
+ <p class="text-sm text-sunset-yellow/80 mb-2">Designed by drunks. Refined by code.</p>
544
+ <p class="text-xs text-white/60">© You & Me Pub & Hostel 2024. All rights reserved.</p>
545
+ </div>
546
+ </div>
547
+ </footer>
548
+
549
+ <script>
550
+ // Mobile menu toggle
551
+ document.getElementById('mobile-menu-button').addEventListener('click', function() {
552
+ const menu = document.getElementById('mobile-menu');
553
+ menu.classList.toggle('hidden');
554
+ });
555
+
556
+ // Lazy load images
557
+ document.addEventListener('DOMContentLoaded', function() {
558
+ const lazyLoadImages = document.querySelectorAll('.lazy-load');
559
+
560
+ const lazyLoad = function(target) {
561
+ const io = new IntersectionObserver(function(entries, observer) {
562
+ entries.forEach(function(entry) {
563
+ if (entry.isIntersecting) {
564
+ const img = entry.target;
565
+ if (img.dataset.src) {
566
+ img.src = img.dataset.src;
567
+ }
568
+ img.classList.add('loaded');
569
+ observer.unobserve(img);
570
+ }
571
+ });
572
+ });
573
+
574
+ io.observe(target);
575
+ };
576
+
577
+ lazyLoadImages.forEach(lazyLoad);
578
+ });
579
+
580
+ // Fake event data (in a real app, this would come from an API)
581
+ function updateEventContent() {
582
+ const events = [
583
+ { time: "8:00 PM", description: "Open Mic Night" },
584
+ { time: "5:00-7:00 PM", description: "$1 Beers Happy Hour" },
585
+ { description: "Free shot if you say: \"Sticky Mango\"", highlight: true }
586
+ ];
587
+
588
+ const eventContent = document.getElementById('event-content');
589
+ eventContent.innerHTML = '';
590
+
591
+ events.forEach(event => {
592
+ const p = document.createElement('p');
593
+ p.className = 'text-lg';
594
+
595
+ if (event.time) {
596
+ const timeSpan = document.createElement('span');
597
+ timeSpan.className = 'font-bold';
598
+ timeSpan.textContent = event.time;
599
+ p.appendChild(timeSpan);
600
+ p.appendChild(document.createTextNode(' - ' + event.description));
601
+ } else {
602
+ p.className += ' font-bold';
603
+ if (event.highlight) {
604
+ p.className += ' text-sunset-pink';
605
+ }
606
+ p.textContent = event.description;
607
+ }
608
+
609
+ eventContent.appendChild(p);
610
+ });
611
+ }
612
+
613
+ // Initialize
614
+ document.addEventListener('DOMContentLoaded', function() {
615
+ updateEventContent();
616
+
617
+ // Simulate loading lazy images
618
+ setTimeout(() => {
619
+ const lazyImages = document.querySelectorAll('.lazy-load');
620
+ lazyImages.forEach(img => {
621
+ img.classList.add('loaded');
622
+ });
623
+ }, 500);
624
+ });
625
+ </script>
626
+
627
+ <!-- Schema.org markup -->
628
+ <script type="application/ld+json">
629
+ {
630
+ "@context": "https://schema.org",
631
+ "@type": "BarOrPub",
632
+ "name": "You & Me Pub & Hostel",
633
+ "image": "https://youandme.pub/logo.jpg",
634
+ "@id": "https://youandme.pub",
635
+ "url": "https://youandme.pub",
636
+ "telephone": "+85512345678",
637
+ "address": {
638
+ "@type": "PostalAddress",
639
+ "streetAddress": "123 Riverside Road",
640
+ "addressLocality": "Kampot",
641
+ "addressCountry": "KH"
642
+ },
643
+ "geo": {
644
+ "@type": "GeoCoordinates",
645
+ "latitude": 10.481992,
646
+ "longitude": 104.181272
647
+ },
648
+ "openingHoursSpecification": {
649
+ "@type": "OpeningHoursSpecification",
650
+ "dayOfWeek": [
651
+ "Monday",
652
+ "Tuesday",
653
+ "Wednesday",
654
+ "Thursday",
655
+ "Friday",
656
+ "Saturday",
657
+ "Sunday"
658
+ ],
659
+ "opens": "12:00",
660
+ "closes": "00:00"
661
+ },
662
+ "priceRange": "$",
663
+ "servesCuisine": "Bar food, Pub grub"
664
+ }
665
+ </script>
666
+
667
+ <!-- Google Analytics -->
668
+ <script async src="https://www.googletagmanager.com/gtag/js?id=G-XXXXXXXXXX"></script>
669
+ <script>
670
+ window.dataLayer = window.dataLayer || [];
671
+ function gtag(){dataLayer.push(arguments);}
672
+ gtag('js', new Date());
673
+ gtag('config', 'G-XXXXXXXXXX');
674
+ </script>
675
+ <p style="border-radius: 8px; text-align: center; font-size: 12px; color: #fff; margin-top: 16px;position: fixed; left: 8px; bottom: 8px; z-index: 10; background: rgba(0, 0, 0, 0.8); padding: 4px 8px;">Made with <img src="https://enzostvs-deepsite.hf.space/logo.svg" alt="DeepSite Logo" style="width: 16px; height: 16px; vertical-align: middle;display:inline-block;margin-right:3px;filter:brightness(0) invert(1);"><a href="https://enzostvs-deepsite.hf.space" style="color: #fff;text-decoration: underline;" target="_blank" >DeepSite</a> - 🧬 <a href="https://enzostvs-deepsite.hf.space?remix=steake/uandme2" style="color: #fff;text-decoration: underline;" target="_blank" >Remix</a></p></body>
676
+ </html>
prompts.txt ADDED
File without changes