Hugging Face's logo

Spaces:
patrickmasterson
/
barhubv1
Running

App Files Community
patrickmasterson commited on
Commit
771cece
·
verified ·
1 Parent(s): 59c2685

Needs vs. Wants for features Needs: Clean UI Quick tab to see bars at a glance with their special/event of the day and a button to click to put you in the detailed overview tab for more information (weekly specials, hours, address, busy time, food menu dropdown that business owners can add). Daily, weekly specials (food and drinks), hours, address, busy time, google reviews, age restrictions for the day. Calendar tab that has the monthly events that vendors can populate. Either google calendar and convert that into a custom one or just the google calendar on the app itself. Reporting system for Users and bar owners to report incorrect/old information and get in contact with us. Local Admin we can give permissions to keep the app updated when we graduate and login for them. (Or have AI be the admin). Terms of service, usage policy, privacy policy, legal disclaimer etc. Wants: A social media feed (from instagram) where bar’s posts auto fill as posted. It can then be sorted by specific bar. Radius from the user. Ability for bar owners to input their information themselves about their specific bars. Coordinate with bars and monetization & app promotion strategies. Moderators going through reports and have the ability to update bar info. Moderator login to the app. To recruit admins from other cities/towns we can have an application process with a contract and incentivize them with a % of the profit from their area. Potential customer login/account for rewards and promotions from bars? Age verification from that. Connector between event planners/bands with to bars through app Sponsored page that has 3 sponsored bars (bidded out each week/month or something) and 3 sponsored events/bands. Scaling for the future.. A one stop app that consolidates all relevant information about bars within a preset distance from Boone/App State for users to easily search through specials, events, times, etc.

Browse files
Files changed (5) hide show
  1. README.md +7 -5
  2. admin.html +285 -0
  3. bar-detail.html +362 -0
  4. index.html +590 -18
  5. prompts.txt +6 -0
README.md CHANGED
@@ -1,10 +1,12 @@
1
  ---
2
- title: Barhubv1
3
- emoji: 📚
4
- colorFrom: purple
5
- colorTo: pink
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: barhubv1
3
+ emoji: 🐳
4
+ colorFrom: pink
5
+ colorTo: yellow
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
admin.html ADDED
@@ -0,0 +1,285 @@
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
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>BarFinder Admin</title>
7
+ <link rel="icon" type="image/x-icon" href="/static/favicon.ico">
8
+ <script src="https://cdn.tailwindcss.com"></script>
9
+ <link href="https://unpkg.com/aos@2.3.1/dist/aos.css" rel="stylesheet">
10
+ <script src="https://unpkg.com/aos@2.3.1/dist/aos.js"></script>
11
+ <script src="https://cdn.jsdelivr.net/npm/feather-icons/dist/feather.min.js"></script>
12
+ <script src="https://unpkg.com/feather-icons"></script>
13
+ <style>
14
+ .sidebar {
15
+ transition: all 0.3s ease;
16
+ }
17
+ .sidebar.collapsed {
18
+ width: 80px;
19
+ }
20
+ .sidebar.collapsed .sidebar-text {
21
+ display: none;
22
+ }
23
+ .sidebar.collapsed .sidebar-icon {
24
+ margin-right: 0;
25
+ }
26
+ .content {
27
+ transition: margin-left 0.3s ease;
28
+ }
29
+ .content.expanded {
30
+ margin-left: 80px;
31
+ }
32
+ </style>
33
+ </head>
34
+ <body class="bg-gray-100">
35
+ <!-- Admin Layout -->
36
+ <div class="flex h-screen">
37
+ <!-- Sidebar -->
38
+ <div class="sidebar bg-indigo-900 text-white w-64 flex-shrink-0 flex flex-col" id="sidebar">
39
+ <div class="p-4 flex items-center justify-between border-b border-indigo-800">
40
+ <div class="flex items-center">
41
+ <i data-feather="cocktail" class="w-6 h-6"></i>
42
+ <span class="ml-2 font-bold sidebar-text">BarFinder Admin</span>
43
+ </div>
44
+ <button id="toggle-sidebar" class="text-gray-300 hover:text-white focus:outline-none">
45
+ <i data-feather="chevron-left" class="w-5 h-5"></i>
46
+ </button>
47
+ </div>
48
+ <div class="flex-1 overflow-y-auto">
49
+ <nav class="p-4 space-y-1">
50
+ <a href="#" class="flex items-center px-3 py-2 text-sm font-medium rounded-md bg-indigo-800 text-white">
51
+ <i data-feather="home" class="sidebar-icon w-5 h-5 mr-3"></i>
52
+ <span class="sidebar-text">Dashboard</span>
53
+ </a>
54
+ <a href="#" class="flex items-center px-3 py-2 text-sm font-medium rounded-md text-indigo-200 hover:bg-indigo-800 hover:text-white">
55
+ <i data-feather="map-pin" class="sidebar-icon w-5 h-5 mr-3"></i>
56
+ <span class="sidebar-text">Bars</span>
57
+ </a>
58
+ <a href="#" class="flex items-center px-3 py-2 text-sm font-medium rounded-md text-indigo-200 hover:bg-indigo-800 hover:text-white">
59
+ <i data-feather="calendar" class="sidebar-icon w-5 h-5 mr-3"></i>
60
+ <span class="sidebar-text">Events</span>
61
+ </a>
62
+ <a href="#" class="flex items-center px-3 py-2 text-sm font-medium rounded-md text-indigo-200 hover:bg-indigo-800 hover:text-white">
63
+ <i data-feather="instagram" class="sidebar-icon w-5 h-5 mr-3"></i>
64
+ <span class="sidebar-text">Social Feeds</span>
65
+ </a>
66
+ <a href="#" class="flex items-center px-3 py-2 text-sm font-medium rounded-md text-indigo-200 hover:bg-indigo-800 hover:text-white">
67
+ <i data-feather="star" class="sidebar-icon w-5 h-5 mr-3"></i>
68
+ <span class="sidebar-text">Sponsored</span>
69
+ </a>
70
+ <a href="#" class="flex items-center px-3 py-2 text-sm font-medium rounded-md text-indigo-200 hover:bg-indigo-800 hover:text-white">
71
+ <i data-feather="users" class="sidebar-icon w-5 h-5 mr-3"></i>
72
+ <span class="sidebar-text">Users</span>
73
+ </a>
74
+ <a href="#" class="flex items-center px-3 py-2 text-sm font-medium rounded-md text-indigo-200 hover:bg-indigo-800 hover:text-white">
75
+ <i data-feather="alert-triangle" class="sidebar-icon w-5 h-5 mr-3"></i>
76
+ <span class="sidebar-text">Reports</span>
77
+ </a>
78
+ <a href="#" class="flex items-center px-3 py-2 text-sm font-medium rounded-md text-indigo-200 hover:bg-indigo-800 hover:text-white">
79
+ <i data-feather="settings" class="sidebar-icon w-5 h-5 mr-3"></i>
80
+ <span class="sidebar-text">Settings</span>
81
+ </a>
82
+ </nav>
83
+ </div>
84
+ <div class="p-4 border-t border-indigo-800">
85
+ <div class="flex items-center">
86
+ <img src="http://static.photos/people/200x200/1" alt="Admin" class="w-8 h-8 rounded-full">
87
+ <div class="ml-3 sidebar-text">
88
+ <p class="text-sm font-medium text-white">Admin User</p>
89
+ <p class="text-xs text-indigo-300">Super Admin</p>
90
+ </div>
91
+ </div>
92
+ </div>
93
+ </div>
94
+
95
+ <!-- Main Content -->
96
+ <div class="content flex-1 flex flex-col overflow-hidden" id="content">
97
+ <!-- Top Navigation -->
98
+ <header class="bg-white shadow-sm">
99
+ <div class="px-4 py-3 flex items-center justify-between">
100
+ <h1 class="text-xl font-bold text-gray-800">Admin Dashboard</h1>
101
+ <div class="flex items-center space-x-4">
102
+ <button class="p-2 text-gray-500 hover:text-gray-700 focus:outline-none">
103
+ <i data-feather="bell" class="w-5 h-5"></i>
104
+ </button>
105
+ <button class="p-2 text-gray-500 hover:text-gray-700 focus:outline-none">
106
+ <i data-feather="help-circle" class="w-5 h-5"></i>
107
+ </button>
108
+ </div>
109
+ </div>
110
+ </header>
111
+
112
+ <!-- Main Content Area -->
113
+ <main class="flex-1 overflow-y-auto p-6 bg-gray-50">
114
+ <!-- Stats Cards -->
115
+ <div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-4 gap-6 mb-6">
116
+ <div class="bg-white rounded-lg shadow p-6">
117
+ <div class="flex items-center">
118
+ <div class="p-3 rounded-full bg-indigo-100 text-indigo-600 mr-4">
119
+ <i data-feather="map-pin" class="w-6 h-6"></i>
120
+ </div>
121
+ <div>
122
+ <p class="text-sm font-medium text-gray-500">Total Bars</p>
123
+ <p class="text-2xl font-semibold text-gray-800">42</p>
124
+ </div>
125
+ </div>
126
+ </div>
127
+ <div class="bg-white rounded-lg shadow p-6">
128
+ <div class="flex items-center">
129
+ <div class="p-3 rounded-full bg-green-100 text-green-600 mr-4">
130
+ <i data-feather="calendar" class="w-6 h-6"></i>
131
+ </div>
132
+ <div>
133
+ <p class="text-sm font-medium text-gray-500">Upcoming Events</p>
134
+ <p class="text-2xl font-semibold text-gray-800">18</p>
135
+ </div>
136
+ </div>
137
+ </div>
138
+ <div class="bg-white rounded-lg shadow p-6">
139
+ <div class="flex items-center">
140
+ <div class="p-3 rounded-full bg-yellow-100 text-yellow-600 mr-4">
141
+ <i data-feather="alert-triangle" class="w-6 h-6"></i>
142
+ </div>
143
+ <div>
144
+ <p class="text-sm font-medium text-gray-500">Pending Reports</p>
145
+ <p class="text-2xl font-semibold text-gray-800">7</p>
146
+ </div>
147
+ </div>
148
+ </div>
149
+ <div class="bg-white rounded-lg shadow p-6">
150
+ <div class="flex items-center">
151
+ <div class="p-3 rounded-full bg-blue-100 text-blue-600 mr-4">
152
+ <i data-feather="users" class="w-6 h-6"></i>
153
+ </div>
154
+ <div>
155
+ <p class="text-sm font-medium text-gray-500">Active Users</p>
156
+ <p class="text-2xl font-semibold text-gray-800">1,243</p>
157
+ </div>
158
+ </div>
159
+ </div>
160
+ </div>
161
+
162
+ <!-- Recent Activity -->
163
+ <div class="bg-white rounded-lg shadow overflow-hidden mb-6">
164
+ <div class="px-6 py-4 border-b border-gray-200">
165
+ <h2 class="text-lg font-semibold text-gray-800">Recent Activity</h2>
166
+ </div>
167
+ <div class="divide-y divide-gray-200">
168
+ <div class="px-6 py-4 flex items-start">
169
+ <div class="flex-shrink-0">
170
+ <img src="http://static.photos/people/200x200/2" alt="User" class="w-10 h-10 rounded-full">
171
+ </div>
172
+ <div class="ml-4">
173
+ <p class="text-sm font-medium text-gray-900">Sarah Johnson</p>
174
+ <p class="text-sm text-gray-500">Added new event "Summer Beer Fest" at Boone Brews</p>
175
+ <p class="text-xs text-gray-400 mt-1">2 hours ago</p>
176
+ </div>
177
+ </div>
178
+ <div class="px-6 py-4 flex items-start">
179
+ <div class="flex-shrink-0">
180
+ <img src="http://static.photos/people/200x200/3" alt="User" class="w-10 h-10 rounded-full">
181
+ </div>
182
+ <div class="ml-4">
183
+ <p class="text-sm font-medium text-gray-900">Michael Chen</p>
184
+ <p class="text-sm text-gray-500">Updated menu for The Local Tap</p>
185
+ <p class="text-xs text-gray-400 mt-1">5 hours ago</p>
186
+ </div>
187
+ </div>
188
+ <div class="px-6 py-4 flex items-start">
189
+ <div class="flex-shrink-0">
190
+ <img src="http://static.photos/people/200x200/4" alt="User" class="w-10 h-10 rounded-full">
191
+ </div>
192
+ <div class="ml-4">
193
+ <p class="text-sm font-medium text-gray-900">Alex Rodriguez</p>
194
+ <p class="text-sm text-gray-500">Reported incorrect hours for Mountain View Lounge</p>
195
+ <p class="text-xs text-gray-400 mt-1">1 day ago</p>
196
+ </div>
197
+ </div>
198
+ </div>
199
+ <div class="px-6 py-4 bg-gray-50 text-center">
200
+ <a href="#" class="text-sm font-medium text-indigo-600 hover:text-indigo-500">View all activity</a>
201
+ </div>
202
+ </div>
203
+
204
+ <!-- Quick Actions -->
205
+ <div class="grid grid-cols-1 md:grid-cols-2 gap-6">
206
+ <div class="bg-white rounded-lg shadow overflow-hidden">
207
+ <div class="px-6 py-4 border-b border-gray-200">
208
+ <h2 class="text-lg font-semibold text-gray-800">Pending Approvals</h2>
209
+ </div>
210
+ <div class="p-6">
211
+ <div class="mb-4">
212
+ <p class="text-sm font-medium text-gray-700 mb-1">New Bar Submission</p>
213
+ <p class="text-sm text-gray-500">"The Rusty Anchor" submitted by David Wilson</p>
214
+ <div class="flex mt-2 space-x-2">
215
+ <button class="px-3 py-1 bg-green-100 text-green-800 text-sm rounded hover:bg-green-200">Approve</button>
216
+ <button class="px-3 py-1 bg-red-100 text-red-800 text-sm rounded hover:bg-red-200">Reject</button>
217
+ </div>
218
+ </div>
219
+ <div class="mb-4">
220
+ <p class="text-sm font-medium text-gray-700 mb-1">Event Submission</p>
221
+ <p class="text-sm text-gray-500">"Jazz Night" at Appalachian Pub</p>
222
+ <div class="flex mt-2 space-x-2">
223
+ <button class="px-3 py-1 bg-green-100 text-green-800 text-sm rounded hover:bg-green-200">Approve</button>
224
+ <button class="px-3 py-1 bg-red-100 text-red-800 text-sm rounded hover:bg-red-200">Reject</button>
225
+ </div>
226
+ </div>
227
+ <a href="#" class="text-sm font-medium text-indigo-600 hover:text-indigo-500">View all pending approvals</a>
228
+ </div>
229
+ </div>
230
+ <div class="bg-white rounded-lg shadow overflow-hidden">
231
+ <div class="px-6 py-4 border-b border-gray-200">
232
+ <h2 class="text-lg font-semibold text-gray-800">Quick Actions</h2>
233
+ </div>
234
+ <div class="p-6 grid grid-cols-2 gap-4">
235
+ <a href="#" class="p-4 border border-gray-200 rounded-lg text-center hover:bg-gray-50">
236
+ <i data-feather="plus" class="w-6 h-6 text-indigo-600 mx-auto"></i>
237
+ <p class="mt-2 text-sm font-medium text-gray-700">Add New Bar</p>
238
+ </a>
239
+ <a href="#" class="p-4 border border-gray-200 rounded-lg text-center hover:bg-gray-50">
240
+ <i data-feather="calendar" class="w-6 h-6 text-indigo-600 mx-auto"></i>
241
+ <p class="mt-2 text-sm font-medium text-gray-700">Create Event</p>
242
+ </a>
243
+ <a href="#" class="p-4 border border-gray-200 rounded-lg text-center hover:bg-gray-50">
244
+ <i data-feather="star" class="w-6 h-6 text-indigo-600 mx-auto"></i>
245
+ <p class="mt-2 text-sm font-medium text-gray-700">Manage Sponsors</p>
246
+ </a>
247
+ <a href="#" class="p-4 border border-gray-200 rounded-lg text-center hover:bg-gray-50">
248
+ <i data-feather="users" class="w-6 h-6 text-indigo-600 mx-auto"></i>
249
+ <p class="mt-2 text-sm font-medium text-gray-700">Add Admin</p>
250
+ </a>
251
+ </div>
252
+ </div>
253
+ </div>
254
+ </main>
255
+ </div>
256
+ </div>
257
+
258
+ <script>
259
+ // Toggle sidebar
260
+ document.getElementById('toggle-sidebar').addEventListener('click', function() {
261
+ const sidebar = document.getElementById('sidebar');
262
+ const content = document.getElementById('content');
263
+ const icon = this.querySelector('i');
264
+
265
+ sidebar.classList.toggle('collapsed');
266
+ content.classList.toggle('expanded');
267
+
268
+ if (sidebar.classList.contains('collapsed')) {
269
+ icon.setAttribute('data-feather', 'chevron-right');
270
+ } else {
271
+ icon.setAttribute('data-feather', 'chevron-left');
272
+ }
273
+ feather.replace();
274
+ });
275
+
276
+ // Initialize AOS
277
+ AOS.init({
278
+ duration: 800,
279
+ easing: 'ease-in-out',
280
+ once: true
281
+ });
282
+ </script>
283
+ <script>feather.replace();</script>
284
+ </body>
285
+ </html>
bar-detail.html ADDED
@@ -0,0 +1,362 @@
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
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>The Local Tap | BarFinder</title>
7
+ <link rel="icon" type="image/x-icon" href="/static/favicon.ico">
8
+ <script src="https://cdn.tailwindcss.com"></script>
9
+ <link href="https://unpkg.com/aos@2.3.1/dist/aos.css" rel="stylesheet">
10
+ <script src="https://unpkg.com/aos@2.3.1/dist/aos.js"></script>
11
+ <script src="https://cdn.jsdelivr.net/npm/feather-icons/dist/feather.min.js"></script>
12
+ <script src="https://unpkg.com/feather-icons"></script>
13
+ <style>
14
+ .gallery-image {
15
+ transition: transform 0.3s ease;
16
+ }
17
+ .gallery-image:hover {
18
+ transform: scale(1.03);
19
+ }
20
+ .menu-tab.active {
21
+ border-bottom: 3px solid #6366f1;
22
+ color: #6366f1;
23
+ }
24
+ .hours-table tr:not(:last-child) {
25
+ border-bottom: 1px solid #e5e7eb;
26
+ }
27
+ </style>
28
+ </head>
29
+ <body class="bg-gray-100">
30
+ <!-- Navigation -->
31
+ <nav class="bg-indigo-900 text-white shadow-lg">
32
+ <div class="container mx-auto px-4 py-3 flex justify-between items-center">
33
+ <div class="flex items-center space-x-2">
34
+ <i data-feather="cocktail" class="w-6 h-6"></i>
35
+ <span class="font-bold text-xl">BarFinder</span>
36
+ </div>
37
+ <div class="hidden md:flex space-x-6">
38
+ <a href="index.html" class="hover:text-indigo-200">Home</a>
39
+ <a href="index.html#bars" class="hover:text-indigo-200">Bars</a>
40
+ <a href="index.html#events" class="hover:text-indigo-200">Events</a>
41
+ <a href="index.html#social" class="hover:text-indigo-200">Social</a>
42
+ <a href="admin.html" class="bg-indigo-700 px-3 py-1 rounded hover:bg-indigo-600">Admin</a>
43
+ </div>
44
+ <button class="md:hidden focus:outline-none" id="mobile-menu-button">
45
+ <i data-feather="menu" class="w-6 h-6"></i>
46
+ </button>
47
+ </div>
48
+ </nav>
49
+
50
+ <!-- Bar Header -->
51
+ <section class="relative">
52
+ <div class="h-64 md:h-96 w-full bg-gray-800 overflow-hidden">
53
+ <img src="http://static.photos/nightlife/1200x630/1" alt="The Local Tap" class="w-full h-full object-cover opacity-70">
54
+ </div>
55
+ <div class="absolute bottom-0 left-0 right-0 bg-gradient-to-t from-black to-transparent pt-20 pb-6">
56
+ <div class="container mx-auto px-4">
57
+ <div class="flex flex-col md:flex-row md:items-end justify-between">
58
+ <div>
59
+ <h1 class="text-3xl md:text-4xl font-bold text-white">The Local Tap</h1>
60
+ <div class="flex items-center mt-2">
61
+ <div class="flex items-center text-yellow-400">
62
+ <i data-feather="star" class="w-5 h-5 fill-current"></i>
63
+ <i data-feather="star" class="w-5 h-5 fill-current"></i>
64
+ <i data-feather="star" class="w-5 h-5 fill-current"></i>
65
+ <i data-feather="star" class="w-5 h-5 fill-current"></i>
66
+ <i data-feather="star" class="w-5 h-5 fill-current"></i>
67
+ <span class="ml-2 text-white">4.8 (142 reviews)</span>
68
+ </div>
69
+ </div>
70
+ </div>
71
+ <div class="mt-4 md:mt-0 flex space-x-3">
72
+ <button class="bg-white text-indigo-900 px-4 py-2 rounded-lg font-medium hover:bg-gray-100 flex items-center">
73
+ <i data-feather="phone" class="w-4 h-4 mr-2"></i>
74
+ Call
75
+ </button>
76
+ <button class="bg-indigo-600 text-white px-4 py-2 rounded-lg font-medium hover:bg-indigo-700 flex items-center">
77
+ <i data-feather="map-pin" class="w-4 h-4 mr-2"></i>
78
+ Directions
79
+ </button>
80
+ </div>
81
+ </div>
82
+ </div>
83
+ </div>
84
+ </section>
85
+
86
+ <!-- Bar Info -->
87
+ <section class="py-8 bg-white">
88
+ <div class="container mx-auto px-4">
89
+ <div class="flex flex-col md:flex-row gap-8">
90
+ <div class="md:w-2/3">
91
+ <!-- Tabs -->
92
+ <div class="border-b border-gray-200 mb-6">
93
+ <nav class="flex space-x-8">
94
+ <button class="py-4 px-1 font-medium text-gray-500 hover:text-indigo-600 menu-tab active" data-tab="overview">
95
+ Overview
96
+ </button>
97
+ <button class="py-4 px-1 font-medium text-gray-500 hover:text-indigo-600 menu-tab" data-tab="menu">
98
+ Menu
99
+ </button>
100
+ <button class="py-4 px-1 font-medium text-gray-500 hover:text-indigo-600 menu-tab" data-tab="photos">
101
+ Photos
102
+ </button>
103
+ <button class="py-4 px-1 font-medium text-gray-500 hover:text-indigo-600 menu-tab" data-tab="reviews">
104
+ Reviews
105
+ </button>
106
+ </nav>
107
+ </div>
108
+
109
+ <!-- Overview Tab -->
110
+ <div id="overview-tab" class="tab-content active">
111
+ <h2 class="text-2xl font-bold mb-4">About The Local Tap</h2>
112
+ <p class="text-gray-700 mb-6">
113
+ The Local Tap is Boone's premier craft beer bar, featuring 40 rotating taps of the best local and regional brews.
114
+ Our cozy atmosphere, knowledgeable staff, and regular events make us a favorite among locals and visitors alike.
115
+ </p>
116
+
117
+ <h3 class="text-xl font-bold mb-3">Today's Special</h3>
118
+ <div class="bg-indigo-50 rounded-lg p-4 mb-6">
119
+ <div class="flex items-start">
120
+ <div class="bg-indigo-100 p-2 rounded-lg mr-4">
121
+ <i data-feather="dollar-sign" class="w-6 h-6 text-indigo-600"></i>
122
+ </div>
123
+ <div>
124
+ <h4 class="font-bold text-lg">Happy Hour</h4>
125
+ <p class="text-gray-700">4PM - 7PM • $3 Craft Beers</p>
126
+ <p class="text-gray-600 mt-1">All local drafts included. Excludes specialty brews.</p>
127
+ </div>
128
+ </div>
129
+ </div>
130
+
131
+ <h3 class="text-xl font-bold mb-3">Weekly Specials</h3>
132
+ <div class="space-y-4 mb-6">
133
+ <div class="flex items-start">
134
+ <div class="bg-gray-100 p-2 rounded-lg mr-4">
135
+ <i data-feather="calendar" class="w-5 h-5 text-gray-600"></i>
136
+ </div>
137
+ <div>
138
+ <h4 class="font-medium">Monday</h4>
139
+ <p class="text-gray-600">$4 Local IPAs all day</p>
140
+ </div>
141
+ </div>
142
+ <div class="flex items-start">
143
+ <div class="bg-gray-100 p-2 rounded-lg mr-4">
144
+ <i data-feather="calendar" class="w-5 h-5 text-gray-600"></i>
145
+ </div>
146
+ <div>
147
+ <h4 class="font-medium">Tuesday</h4>
148
+ <p class="text-gray-600">$5 Burger & Beer combo</p>
149
+ </div>
150
+ </div>
151
+ <div class="flex items-start">
152
+ <div class="bg-gray-100 p-2 rounded-lg mr-4">
153
+ <i data="feather" data-feather="calendar" class="w-5 h-5 text-gray-600"></i>
154
+ </div>
155
+ <div>
156
+ <h4 class="font-medium">Wednesday</h4>
157
+ <p class="text-gray-600">Trivia Night - 8PM (win free drinks!)</p>
158
+ </div>
159
+ </div>
160
+ <div class="flex items-start">
161
+ <div class="bg-gray-100 p-2 rounded-lg mr-4">
162
+ <i data-feather="calendar" class="w-5 h-5 text-gray-600"></i>
163
+ </div>
164
+ <div>
165
+ <h4 class="font-medium">Thursday</h4>
166
+ <p class="text-gray-600">Karaoke - 9PM (half-price cocktails for performers)</p>
167
+ </div>
168
+ </div>
169
+ <div class="flex items-start">
170
+ <div class="bg-gray-100 p-2 rounded-lg mr-4">
171
+ <i data-feather="calendar" class="w-5 h-5 text-gray-600"></i>
172
+ </div>
173
+ <div>
174
+ <h4 class="font-medium">Friday-Saturday</h4>
175
+ <p class="text-gray-600">Live music - 10PM ($1 off all drafts during shows)</p>
176
+ </div>
177
+ </div>
178
+ <div class="flex items-start">
179
+ <div class="bg-gray-100 p-2 rounded-lg mr-4">
180
+ <i data-feather="calendar" class="w-5 h-5 text-gray-600"></i>
181
+ </div>
182
+ <div>
183
+ <h4 class="font-medium">Sunday</h4>
184
+ <p class="text-gray-600">$3 Mimosas 11AM-3PM</p>
185
+ </div>
186
+ </div>
187
+ </div>
188
+
189
+ <h3 class="text-xl font-bold mb-3">Upcoming Events</h3>
190
+ <div class="space-y-4">
191
+ <div class="bg-gray-50 rounded-lg p-4">
192
+ <div class="flex items-start">
193
+ <div class="bg-indigo-100 p-2 rounded-lg mr-4">
194
+ <i data-feather="music" class="w-5 h-5 text-indigo-600"></i>
195
+ </div>
196
+ <div>
197
+ <h4 class="font-bold">Live Band: Mountain Sound</h4>
198
+ <p class="text-gray-600">Tomorrow • 9PM-12AM</p>
199
+ <p class="text-gray-700 mt-1">Local favorites playing rock and indie covers. $5 cover after 9PM.</p>
200
+ <button class="mt-2 text-indigo-600 hover:text-indigo-800 font-medium">
201
+ More Info <i data-feather="arrow-right" class="w-4 h-4 inline"></i>
202
+ </button>
203
+ </div>
204
+ </div>
205
+ </div>
206
+ <div class="bg-gray-50 rounded-lg p-4">
207
+ <div class="flex items-start">
208
+ <div class="bg-indigo-100 p-2 rounded-lg mr-4">
209
+ <i data-feather="award" class="w-5 h-5 text-indigo-600"></i>
210
+ </div>
211
+ <div>
212
+ <h4 class="font-bold">Beer Release Party</h4>
213
+ <p class="text-gray-600">June 10 • 6PM-10PM</p>
214
+ <p class="text-gray-700 mt-1">Celebrating our new collaboration brew with Boone Brewing Company.</p>
215
+ <button class="mt-2 text-indigo-600 hover:text-indigo-800 font-medium">
216
+ More Info <i data-feather="arrow-right" class="w-4 h-4 inline"></i>
217
+ </button>
218
+ </div>
219
+ </div>
220
+ </div>
221
+ </div>
222
+ </div>
223
+
224
+ <!-- Menu Tab -->
225
+ <div id="menu-tab" class="tab-content hidden">
226
+ <h2 class="text-2xl font-bold mb-4">Menu</h2>
227
+
228
+ <h3 class="text-xl font-bold mb-3 mt-6">Food Menu</h3>
229
+ <div class="space-y-6">
230
+ <div class="border-b border-gray-200 pb-6">
231
+ <h4 class="font-bold text-lg mb-2">Appetizers</h4>
232
+ <div class="space-y-4">
233
+ <div class="flex justify-between">
234
+ <div>
235
+ <p class="font-medium">Nachos</p>
236
+ <p class="text-sm text-gray-600">Tortilla chips, cheese, jalapeños, pico de gallo, guacamole</p>
237
+ </div>
238
+ <p class="font-medium">$7.50</p>
239
+ </div>
240
+ <div class="flex justify-between">
241
+ <div>
242
+ <p class="font-medium">Wings</p>
243
+ <p class="text-sm text-gray-600">Choice of buffalo, BBQ, or garlic parmesan</p>
244
+ </div>
245
+ <p class="font-medium">$8.99</p>
246
+ </div>
247
+ <div class="flex justify-between">
248
+ <div>
249
+ <p class="font-medium">Pretzel Bites</p>
250
+ <p class="text-sm text-gray-600">Served with beer cheese and mustard</p>
251
+ </div>
252
+ <p class="font-medium">$6.50</p>
253
+ </div>
254
+ </div>
255
+ </div>
256
+
257
+ <div class="border-b border-gray-200 pb-6">
258
+ <h4 class="font-bold text-lg mb-2">Burgers & Sandwiches</h4>
259
+ <div class="space-y-4">
260
+ <div class="flex justify-between">
261
+ <div>
262
+ <p class="font-medium">Classic Burger</p>
263
+ <p class="text-sm text-gray-600">Beef patty, lettuce, tomato, onion, pickles</p>
264
+ </div>
265
+ <p class="font-medium">$10.99</p>
266
+ </div>
267
+ <div class="flex justify-between">
268
+ <div>
269
+ <p class="font-medium">BBQ Bacon Burger</p>
270
+ <p class="text-sm text-gray-600">Beef patty, bacon, cheddar, BBQ sauce</p>
271
+ </div>
272
+ <p class="font-medium">$12.50</p>
273
+ </div>
274
+ <div class="flex justify-between">
275
+ <div>
276
+ <p class="font-medium">Chicken Sandwich</p>
277
+ <p class="text-sm text-gray-600">Grilled or fried chicken with lettuce and tomato</p>
278
+ </div>
279
+ <p class="font-medium">$9.99</p>
280
+ </div>
281
+ </div>
282
+ </div>
283
+
284
+ <h3 class="text-xl font-bold mb-3">Drink Menu</h3>
285
+ <div class="border-b border-gray-200 pb-6">
286
+ <h4 class="font-bold text-lg mb-2">Beer</h4>
287
+ <div class="space-y-4">
288
+ <div>
289
+ <p class="font-medium mb-1">Local Drafts (16oz)</p>
290
+ <div class="flex justify-between text-sm">
291
+ <p>Boone Brewing IPA</p>
292
+ <p>$6.00</p>
293
+ </div>
294
+ <div class="flex justify-between text-sm">
295
+ <p>Mountain Valley Lager</p>
296
+ <p>$5.50</p>
297
+ </div>
298
+ <div class="flex justify-between text-sm">
299
+ <p>Appalachian Amber</p>
300
+ <p>$5.75</p>
301
+ </div>
302
+ </div>
303
+ <div>
304
+ <p class="font-medium mb-1">Domestic Bottles</p>
305
+ <div class="flex justify-between text-sm">
306
+ <p>Bud Light</p>
307
+ <p>$4.00</p>
308
+ </div>
309
+ <div class="flex justify-between text-sm">
310
+ <p>Coors Light</p>
311
+ <p>$4.00</p>
312
+ </div>
313
+ </div>
314
+ </div>
315
+ </div>
316
+
317
+ <div class="border-b border-gray-200 pb-6">
318
+ <h4 class="font-bold text-lg mb-2">Cocktails</h4>
319
+ <div class="space-y-4">
320
+ <div class="flex justify-between">
321
+ <div>
322
+ <p class="font-medium">Margarita</p>
323
+ <p class="text-sm text-gray-600">House margarita with lime and salt</p>
324
+ </div>
325
+ <p class="font-medium">$7.00</p>
326
+ </div>
327
+ <div class="flex justify-between">
328
+ <div>
329
+ <p class="font-medium">Old Fashioned</p>
330
+ <p class="text-sm text-gray-600">Bourbon, sugar, bitters</p>
331
+ </div>
332
+ <p class="font-medium">$9.00</p>
333
+ </div>
334
+ <div class="flex justify-between">
335
+ <div>
336
+ <p class="font-medium">Moscow Mule</p>
337
+ <p class="text-sm text-gray-600">Vodka, ginger beer, lime</p>
338
+ </div>
339
+ <p class="font-medium">$8.00</p>
340
+ </div>
341
+ </div>
342
+ </div>
343
+ </div>
344
+ </div>
345
+
346
+ <!-- Photos Tab -->
347
+ <div id="photos-tab" class="tab-content hidden">
348
+ <h2 class="text-2xl font-bold mb-4">Photos</h2>
349
+ <div class="grid grid-cols-2 md:grid-cols-3 gap-4">
350
+ <div class="overflow-hidden rounded-lg">
351
+ <img src="http://static.photos/nightlife/640x360/1" alt="Bar Interior" class="w-full h-40 object-cover gallery-image">
352
+ </div>
353
+ <div class="overflow-hidden rounded-lg">
354
+ <img src="http://static.photos/nightlife/640x360/2" alt="Bar Exterior" class="w-full h-40 object-cover gallery-image">
355
+ </div>
356
+ <div class="overflow-hidden rounded-lg">
357
+ <img src="http://static.photos/nightlife/640x360/3" alt="Beer Selection" class="w-full h-40 object-cover gallery-image">
358
+ </div>
359
+ <div class="overflow-hidden rounded-lg">
360
+ <img src="http://static.photos/food/640x360/1"
361
+ </body>
362
+ </html>
index.html CHANGED
@@ -1,19 +1,591 @@
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>BarFinder - Discover Local Bars & Specials</title>
7
+ <link rel="icon" type="image/x-icon" href="/static/favicon.ico">
8
+ <script src="https://cdn.tailwindcss.com"></script>
9
+ <link href="https://unpkg.com/aos@2.3.1/dist/aos.css" rel="stylesheet">
10
+ <script src="https://unpkg.com/aos@2.3.1/dist/aos.js"></script>
11
+ <script src="https://cdn.jsdelivr.net/npm/feather-icons/dist/feather.min.js"></script>
12
+ <script src="https://unpkg.com/feather-icons"></script>
13
+ <style>
14
+ .bar-card:hover .bar-image {
15
+ transform: scale(1.05);
16
+ }
17
+ .menu-dropdown {
18
+ max-height: 0;
19
+ overflow: hidden;
20
+ transition: max-height 0.3s ease-out;
21
+ }
22
+ .menu-dropdown.active {
23
+ max-height: 500px;
24
+ transition: max-height 0.5s ease-in;
25
+ }
26
+ .instagram-feed {
27
+ scrollbar-width: none;
28
+ }
29
+ .instagram-feed::-webkit-scrollbar {
30
+ display: none;
31
+ }
32
+ </style>
33
+ </head>
34
+ <body class="bg-gray-100">
35
+ <!-- Navigation -->
36
+ <nav class="bg-indigo-900 text-white shadow-lg">
37
+ <div class="container mx-auto px-4 py-3 flex justify-between items-center">
38
+ <div class="flex items-center space-x-2">
39
+ <i data-feather="cocktail" class="w-6 h-6"></i>
40
+ <span class="font-bold text-xl">BarFinder</span>
41
+ </div>
42
+ <div class="hidden md:flex space-x-6">
43
+ <a href="#" class="hover:text-indigo-200">Home</a>
44
+ <a href="#bars" class="hover:text-indigo-200">Bars</a>
45
+ <a href="#events" class="hover:text-indigo-200">Events</a>
46
+ <a href="#social" class="hover:text-indigo-200">Social</a>
47
+ <a href="admin.html" class="bg-indigo-700 px-3 py-1 rounded hover:bg-indigo-600">Admin</a>
48
+ </div>
49
+ <button class="md:hidden focus:outline-none" id="mobile-menu-button">
50
+ <i data-feather="menu" class="w-6 h-6"></i>
51
+ </button>
52
+ </div>
53
+ <!-- Mobile menu -->
54
+ <div class="md:hidden hidden bg-indigo-800 px-4 py-2" id="mobile-menu">
55
+ <a href="#" class="block py-2 hover:text-indigo-200">Home</a>
56
+ <a href="#bars" class="block py-2 hover:text-indigo-200">Bars</a>
57
+ <a href="#events" class="block py-2 hover:text-indigo-200">Events</a>
58
+ <a href="#social" class="block py-2 hover:text-indigo-200">Social</a>
59
+ <a href="admin.html" class="block py-2 text-indigo-200">Admin</a>
60
+ </div>
61
+ </nav>
62
+
63
+ <!-- Hero Section -->
64
+ <section class="bg-gradient-to-r from-indigo-900 to-purple-800 text-white py-16">
65
+ <div class="container mx-auto px-4 text-center">
66
+ <h1 class="text-4xl md:text-5xl font-bold mb-4" data-aos="fade-up">Discover the Best Bars in Boone</h1>
67
+ <p class="text-xl mb-8 max-w-2xl mx-auto" data-aos="fade-up" data-aos-delay="100">
68
+ Find daily specials, events, and everything you need for a great night out
69
+ </p>
70
+ <div class="flex flex-col sm:flex-row justify-center gap-4" data-aos="fade-up" data-aos-delay="200">
71
+ <a href="#bars" class="bg-white text-indigo-900 font-semibold px-6 py-3 rounded-lg hover:bg-gray-100 transition">
72
+ Explore Bars
73
+ </a>
74
+ <a href="#events" class="bg-indigo-700 text-white font-semibold px-6 py-3 rounded-lg hover:bg-indigo-600 transition">
75
+ View Events
76
+ </a>
77
+ </div>
78
+ </div>
79
+ </section>
80
+
81
+ <!-- Search & Filters -->
82
+ <section class="bg-white py-8 shadow-sm">
83
+ <div class="container mx-auto px-4">
84
+ <div class="flex flex-col md:flex-row gap-4 items-center">
85
+ <div class="relative flex-grow">
86
+ <input type="text" placeholder="Search bars..." class="w-full px-4 py-3 border border-gray-300 rounded-lg focus:outline-none focus:ring-2 focus:ring-indigo-500">
87
+ <i data-feather="search" class="absolute right-3 top-3.5 text-gray-400"></i>
88
+ </div>
89
+ <div class="flex gap-2 w-full md:w-auto">
90
+ <select class="px-3 py-2 border border-gray-300 rounded-lg focus:outline-none focus:ring-2 focus:ring-indigo-500">
91
+ <option>Distance</option>
92
+ <option>1 mile</option>
93
+ <option>5 miles</option>
94
+ <option>10 miles</option>
95
+ </select>
96
+ <select class="px-3 py-2 border border-gray-300 rounded-lg focus:outline-none focus:ring-2 focus:ring-indigo-500">
97
+ <option>Age</option>
98
+ <option>18+</option>
99
+ <option>21+</option>
100
+ </select>
101
+ </div>
102
+ </div>
103
+ </div>
104
+ </section>
105
+
106
+ <!-- Bars Section -->
107
+ <section id="bars" class="py-12 bg-gray-50">
108
+ <div class="container mx-auto px-4">
109
+ <h2 class="text-3xl font-bold mb-8 text-center" data-aos="fade-up">Featured Bars</h2>
110
+ <div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-6">
111
+ <!-- Bar Card 1 -->
112
+ <div class="bg-white rounded-xl shadow-md overflow-hidden bar-card transition duration-300" data-aos="fade-up">
113
+ <div class="relative overflow-hidden h-48">
114
+ <img src="http://static.photos/nightlife/640x360/1" alt="Bar Image" class="w-full h-full object-cover bar-image transition duration-300">
115
+ <div class="absolute top-2 right-2 bg-indigo-700 text-white px-2 py-1 rounded text-sm font-medium">
116
+ Today's Special
117
+ </div>
118
+ </div>
119
+ <div class="p-5">
120
+ <div class="flex justify-between items-start">
121
+ <h3 class="text-xl font-bold mb-2">The Local Tap</h3>
122
+ <div class="flex items-center text-yellow-400">
123
+ <i data-feather="star" class="w-4 h-4 fill-current"></i>
124
+ <span class="ml-1 text-gray-700">4.8</span>
125
+ </div>
126
+ </div>
127
+ <p class="text-gray-600 mb-3">$3 Craft Beers • 4PM-7PM</p>
128
+ <div class="flex flex-wrap gap-2 mb-4">
129
+ <span class="bg-gray-100 px-2 py-1 rounded text-xs">21+</span>
130
+ <span class="bg-gray-100 px-2 py-1 rounded text-xs">Live Music</span>
131
+ <span class="bg-gray-100 px-2 py-1 rounded text-xs">Outdoor Seating</span>
132
+ </div>
133
+ <div class="flex justify-between items-center">
134
+ <button class="text-indigo-600 hover:text-indigo-800 font-medium" onclick="toggleMenu('menu1')">
135
+ View Menu <i data-feather="chevron-down" class="w-4 h-4 inline"></i>
136
+ </button>
137
+ <a href="bar-detail.html" class="bg-indigo-600 text-white px-4 py-2 rounded hover:bg-indigo-700 transition">
138
+ Details
139
+ </a>
140
+ </div>
141
+ <div id="menu1" class="menu-dropdown mt-3">
142
+ <h4 class="font-medium mb-2">Food Menu</h4>
143
+ <ul class="space-y-1 text-sm">
144
+ <li>• Wings - $8.99</li>
145
+ <li>• Nachos - $7.50</li>
146
+ <li>• Burger - $10.99</li>
147
+ </ul>
148
+ <h4 class="font-medium mt-3 mb-2">Drink Specials</h4>
149
+ <ul class="space-y-1 text-sm">
150
+ <li>• Local IPA - $3 (Happy Hour)</li>
151
+ <li>• Margarita - $5 (All Night)</li>
152
+ </ul>
153
+ </div>
154
+ </div>
155
+ </div>
156
+
157
+ <!-- Bar Card 2 -->
158
+ <div class="bg-white rounded-xl shadow-md overflow-hidden bar-card transition duration-300" data-aos="fade-up" data-aos-delay="100">
159
+ <div class="relative overflow-hidden h-48">
160
+ <img src="http://static.photos/nightlife/640x360/2" alt="Bar Image" class="w-full h-full object-cover bar-image transition duration-300">
161
+ <div class="absolute top-2 right-2 bg-purple-700 text-white px-2 py-1 rounded text-sm font-medium">
162
+ Event Tonight
163
+ </div>
164
+ </div>
165
+ <div class="p-5">
166
+ <div class="flex justify-between items-start">
167
+ <h3 class="text-xl font-bold mb-2">Boone Brews</h3>
168
+ <div class="flex items-center text-yellow-400">
169
+ <i data-feather="star" class="w-4 h-4 fill-current"></i>
170
+ <span class="ml-1 text-gray-700">4.5</span>
171
+ </div>
172
+ </div>
173
+ <p class="text-gray-600 mb-3">Trivia Night • 8PM</p>
174
+ <div class="flex flex-wrap gap-2 mb-4">
175
+ <span class="bg-gray-100 px-2 py-1 rounded text-xs">18+</span>
176
+ <span class="bg-gray-100 px-2 py-1 rounded text-xs">Craft Beer</span>
177
+ <span class="bg-gray-100 px-2 py-1 rounded text-xs">Food Available</span>
178
+ </div>
179
+ <div class="flex justify-between items-center">
180
+ <button class="text-indigo-600 hover:text-indigo-800 font-medium" onclick="toggleMenu('menu2')">
181
+ View Menu <i data-feather="chevron-down" class="w-4 h-4 inline"></i>
182
+ </button>
183
+ <a href="bar-detail.html" class="bg-indigo-600 text-white px-4 py-2 rounded hover:bg-indigo-700 transition">
184
+ Details
185
+ </a>
186
+ </div>
187
+ <div id="menu2" class="menu-dropdown mt-3">
188
+ <h4 class="font-medium mb-2">Food Menu</h4>
189
+ <ul class="space-y-1 text-sm">
190
+ <li>• Pizza - $12.99</li>
191
+ <li>• Salad - $6.50</li>
192
+ <li>• Fries - $4.99</li>
193
+ </ul>
194
+ <h4 class="font-medium mt-3 mb-2">Drink Specials</h4>
195
+ <ul class="space-y-1 text-sm">
196
+ <li>• House Brew - $4 (All Night)</li>
197
+ <li>• Wine - $5/glass</li>
198
+ </ul>
199
+ </div>
200
+ </div>
201
+ </div>
202
+
203
+ <!-- Bar Card 3 -->
204
+ <div class="bg-white rounded-xl shadow-md overflow-hidden bar-card transition duration-300" data-aos="fade-up" data-aos-delay="200">
205
+ <div class="relative overflow-hidden h-48">
206
+ <img src="http://static.photos/nightlife/640x360/3" alt="Bar Image" class="w-full h-full object-cover bar-image transition duration-300">
207
+ <div class="absolute top-2 right-2 bg-green-700 text-white px-2 py-1 rounded text-sm font-medium">
208
+ Weekly Special
209
+ </div>
210
+ </div>
211
+ <div class="p-5">
212
+ <div class="flex justify-between items-start">
213
+ <h3 class="text-xl font-bold mb-2">Mountain View Lounge</h3>
214
+ <div class="flex items-center text-yellow-400">
215
+ <i data-feather="star" class="w-4 h-4 fill-current"></i>
216
+ <span class="ml-1 text-gray-700">4.7</span>
217
+ </div>
218
+ </div>
219
+ <p class="text-gray-600 mb-3">$5 Cocktails • All Week</p>
220
+ <div class="flex flex-wrap gap-2 mb-4">
221
+ <span class="bg-gray-100 px-2 py-1 rounded text-xs">21+</span>
222
+ <span class="bg-gray-100 px-2 py-1 rounded text-xs">Cocktails</span>
223
+ <span class="bg-gray-100 px-2 py-1 rounded text-xs">VIP Area</span>
224
+ </div>
225
+ <div class="flex justify-between items-center">
226
+ <button class="text-indigo-600 hover:text-indigo-800 font-medium" onclick="toggleMenu('menu3')">
227
+ View Menu <i data-feather="chevron-down" class="w-4 h-4 inline"></i>
228
+ </button>
229
+ <a href="bar-detail.html" class="bg-indigo-600 text-white px-4 py-2 rounded hover:bg-indigo-700 transition">
230
+ Details
231
+ </a>
232
+ </div>
233
+ <div id="menu3" class="menu-dropdown mt-3">
234
+ <h4 class="font-medium mb-2">Food Menu</h4>
235
+ <ul class="space-y-1 text-sm">
236
+ <li>• Sliders - $9.99</li>
237
+ <li>• Tacos - $8.50</li>
238
+ <li>• Cheese Plate - $11.99</li>
239
+ </ul>
240
+ <h4 class="font-medium mt-3 mb-2">Drink Specials</h4>
241
+ <ul class="space-y-1 text-sm">
242
+ <li>• Signature Cocktails - $5 (All Week)</li>
243
+ <li>• Domestic Beer - $3</li>
244
+ </ul>
245
+ </div>
246
+ </div>
247
+ </div>
248
+ </div>
249
+ <div class="text-center mt-8">
250
+ <a href="bars.html" class="inline-block bg-indigo-600 text-white px-6 py-3 rounded-lg hover:bg-indigo-700 transition">
251
+ View All Bars
252
+ </a>
253
+ </div>
254
+ </div>
255
+ </section>
256
+
257
+ <!-- Events Section -->
258
+ <section id="events" class="py-12 bg-white">
259
+ <div class="container mx-auto px-4">
260
+ <div class="flex justify-between items-center mb-8">
261
+ <h2 class="text-3xl font-bold">Upcoming Events</h2>
262
+ <a href="events.html" class="text-indigo-600 hover:text-indigo-800 font-medium">
263
+ View Calendar <i data-feather="calendar" class="w-4 h-4 inline"></i>
264
+ </a>
265
+ </div>
266
+
267
+ <div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-6">
268
+ <!-- Event Card 1 -->
269
+ <div class="bg-gray-50 rounded-xl shadow-md overflow-hidden" data-aos="fade-up">
270
+ <div class="relative h-48">
271
+ <img src="http://static.photos/event/640x360/1" alt="Event Image" class="w-full h-full object-cover">
272
+ <div class="absolute bottom-0 left-0 right-0 bg-gradient-to-t from-black to-transparent p-4">
273
+ <div class="text-white font-bold text-lg">Live Band Night</div>
274
+ <div class="text-gray-200 text-sm">Tomorrow • 9PM</div>
275
+ </div>
276
+ </div>
277
+ <div class="p-5">
278
+ <div class="flex items-center text-sm text-gray-600 mb-3">
279
+ <i data-feather="map-pin" class="w-4 h-4 mr-1"></i>
280
+ <span>The Local Tap</span>
281
+ </div>
282
+ <p class="text-gray-700 mb-4">Join us for an evening with local favorite "Mountain Sound" playing all your favorite hits!</p>
283
+ <div class="flex justify-between items-center">
284
+ <span class="bg-indigo-100 text-indigo-800 px-2 py-1 rounded text-xs">21+</span>
285
+ <a href="#" class="text-indigo-600 hover:text-indigo-800 font-medium">
286
+ More Info
287
+ </a>
288
+ </div>
289
+ </div>
290
+ </div>
291
+
292
+ <!-- Event Card 2 -->
293
+ <div class="bg-gray-50 rounded-xl shadow-md overflow-hidden" data-aos="fade-up" data-aos-delay="100">
294
+ <div class="relative h-48">
295
+ <img src="http://static.photos/event/640x360/2" alt="Event Image" class="w-full h-full object-cover">
296
+ <div class="absolute bottom-0 left-0 right-0 bg-gradient-to-t from-black to-transparent p-4">
297
+ <div class="text-white font-bold text-lg">Karaoke Thursday</div>
298
+ <div class="text-gray-200 text-sm">Thu • 8PM</div>
299
+ </div>
300
+ </div>
301
+ <div class="p-5">
302
+ <div class="flex items-center text-sm text-gray-600 mb-3">
303
+ <i data-feather="map-pin" class="w-4 h-4 mr-1"></i>
304
+ <span>Boone Brews</span>
305
+ </div>
306
+ <p class="text-gray-700 mb-4">Show off your singing skills or just enjoy the show! Drink specials all night for participants.</p>
307
+ <div class="flex justify-between items-center">
308
+ <span class="bg-indigo-100 text-indigo-800 px-2 py-1 rounded text-xs">18+</span>
309
+ <a href="#" class="text-indigo-600 hover:text-indigo-800 font-medium">
310
+ More Info
311
+ </a>
312
+ </div>
313
+ </div>
314
+ </div>
315
+
316
+ <!-- Event Card 3 -->
317
+ <div class="bg-gray-50 rounded-xl shadow-md overflow-hidden" data-aos="fade-up" data-aos-delay="200">
318
+ <div class="relative h-48">
319
+ <img src="http://static.photos/event/640x360/3" alt="Event Image" class="w-full h-full object-cover">
320
+ <div class="absolute bottom-0 left-0 right-0 bg-gradient-to-t from-black to-transparent p-4">
321
+ <div class="text-white font-bold text-lg">Sunday Funday</div>
322
+ <div class="text-gray-200 text-sm">Sun • 12PM-6PM</div>
323
+ </div>
324
+ </div>
325
+ <div class="p-5">
326
+ <div class="flex items-center text-sm text-gray-600 mb-3">
327
+ <i data-feather="map-pin" class="w-4 h-4 mr-1"></i>
328
+ <span>Mountain View Lounge</span>
329
+ </div>
330
+ <p class="text-gray-700 mb-4">Bottomless mimosas, live DJ, and outdoor games. The perfect way to spend your Sunday!</p>
331
+ <div class="flex justify-between items-center">
332
+ <span class="bg-indigo-100 text-indigo-800 px-2 py-1 rounded text-xs">21+</span>
333
+ <a href="#" class="text-indigo-600 hover:text-indigo-800 font-medium">
334
+ More Info
335
+ </a>
336
+ </div>
337
+ </div>
338
+ </div>
339
+ </div>
340
+ </div>
341
+ </section>
342
+
343
+ <!-- Social Feed Section -->
344
+ <section id="social" class="py-12 bg-gray-50">
345
+ <div class="container mx-auto px-4">
346
+ <h2 class="text-3xl font-bold mb-8 text-center">From Our Bars</h2>
347
+ <div class="relative">
348
+ <div class="instagram-feed flex overflow-x-auto space-x-4 pb-6 scroll-smooth" style="scroll-snap-type: x mandatory;">
349
+ <!-- Instagram Post 1 -->
350
+ <div class="flex-shrink-0 w-64 bg-white rounded-lg shadow-md overflow-hidden" style="scroll-snap-align: start;">
351
+ <img src="http://static.photos/nightlife/320x240/1" alt="Instagram Post" class="w-full h-48 object-cover">
352
+ <div class="p-4">
353
+ <div class="flex items-center mb-2">
354
+ <img src="http://static.photos/logo/200x200/1" alt="Bar Logo" class="w-8 h-8 rounded-full mr-2">
355
+ <span class="font-medium">@thelocaltap</span>
356
+ </div>
357
+ <p class="text-sm text-gray-600">Happy Hour just got happier! $3 craft beers until 7PM 🍻 #boonenightlife</p>
358
+ <div class="flex items-center mt-3 text-sm text-gray-500">
359
+ <i data-feather="heart" class="w-4 h-4 mr-1"></i>
360
+ <span class="mr-3">142</span>
361
+ <i data-feather="message-circle" class="w-4 h-4 mr-1"></i>
362
+ <span>23</span>
363
+ </div>
364
+ </div>
365
+ </div>
366
+
367
+ <!-- Instagram Post 2 -->
368
+ <div class="flex-shrink-0 w-64 bg-white rounded-lg shadow-md overflow-hidden" style="scroll-snap-align: start;">
369
+ <img src="http://static.photos/nightlife/320x240/2" alt="Instagram Post" class="w-full h-48 object-cover">
370
+ <div class="p-4">
371
+ <div class="flex items-center mb-2">
372
+ <img src="http://static.photos/logo/200x200/2" alt="Bar Logo" class="w-8 h-8 rounded-full mr-2">
373
+ <span class="font-medium">@boonebrews</span>
374
+ </div>
375
+ <p class="text-sm text-gray-600">Trivia night champions! Who's ready for next week? 🏆 #boonebrews #trivianight</p>
376
+ <div class="flex items-center mt-3 text-sm text-gray-500">
377
+ <i data-feather="heart" class="w-4 h-4 mr-1"></i>
378
+ <span class="mr-3">98</span>
379
+ <i data-feather="message-circle" class="w-4 h-4 mr-1"></i>
380
+ <span>15</span>
381
+ </div>
382
+ </div>
383
+ </div>
384
+
385
+ <!-- Instagram Post 3 -->
386
+ <div class="flex-shrink-0 w-64 bg-white rounded-lg shadow-md overflow-hidden" style="scroll-snap-align: start;">
387
+ <img src="http://static.photos/nightlife/320x240/3" alt="Instagram Post" class="w-full h-48 object-cover">
388
+ <div class="p-4">
389
+ <div class="flex items-center mb-2">
390
+ <img src="http://static.photos/logo/200x200/3" alt="Bar Logo" class="w-8 h-8 rounded-full mr-2">
391
+ <span class="font-medium">@mountainviewlounge</span>
392
+ </div>
393
+ <p class="text-sm text-gray-600">New cocktail menu dropping this weekend! Who's coming? 🍹 #cocktails #boone</p>
394
+ <div class="flex items-center mt-3 text-sm text-gray-500">
395
+ <i data-feather="heart" class="w-4 h-4 mr-1"></i>
396
+ <span class="mr-3">215</span>
397
+ <i data-feather="message-circle" class="w-4 h-4 mr-1"></i>
398
+ <span>42</span>
399
+ </div>
400
+ </div>
401
+ </div>
402
+
403
+ <!-- Instagram Post 4 -->
404
+ <div class="flex-shrink-0 w-64 bg-white rounded-lg shadow-md overflow-hidden" style="scroll-snap-align: start;">
405
+ <img src="http://static.photos/nightlife/320x240/4" alt="Instagram Post" class="w-full h-48 object-cover">
406
+ <div class="p-4">
407
+ <div class="flex items-center mb-2">
408
+ <img src="http://static.photos/logo/200x200/4" alt="Bar Logo" class="w-8 h-8 rounded-full mr-2">
409
+ <span class="font-medium">@appalachianpub</span>
410
+ </div>
411
+ <p class="text-sm text-gray-600">Sunday Funday starts now! Bottomless mimosas until 6PM 🥂 #sundayfunday</p>
412
+ <div class="flex items-center mt-3 text-sm text-gray-500">
413
+ <i data-feather="heart" class="w-4 h-4 mr-1"></i>
414
+ <span class="mr-3">176</span>
415
+ <i data-feather="message-circle" class="w-4 h-4 mr-1"></i>
416
+ <span>31</span>
417
+ </div>
418
+ </div>
419
+ </div>
420
+ </div>
421
+ <button class="absolute left-0 top-1/2 -translate-y-1/2 -ml-2 bg-white rounded-full p-2 shadow-md hover:bg-gray-100 hidden md:block">
422
+ <i data-feather="chevron-left" class="w-5 h-5 text-gray-700"></i>
423
+ </button>
424
+ <button class="absolute right-0 top-1/2 -translate-y-1/2 -mr-2 bg-white rounded-full p-2 shadow-md hover:bg-gray-100 hidden md:block">
425
+ <i data-feather="chevron-right" class="w-5 h-5 text-gray-700"></i>
426
+ </button>
427
+ </div>
428
+ <div class="text-center mt-8">
429
+ <button class="inline-flex items-center bg-indigo-600 text-white px-6 py-3 rounded-lg hover:bg-indigo-700 transition">
430
+ <i data-feather="instagram" class="w-5 h-5 mr-2"></i>
431
+ Follow All Bars
432
+ </button>
433
+ </div>
434
+ </div>
435
+ </section>
436
+
437
+ <!-- Sponsored Section -->
438
+ <section class="py-12 bg-indigo-50">
439
+ <div class="container mx-auto px-4">
440
+ <h2 class="text-3xl font-bold mb-8 text-center">Sponsored</h2>
441
+ <div class="grid grid-cols-1 md:grid-cols-3 gap-6">
442
+ <!-- Sponsored Bar 1 -->
443
+ <div class="bg-white rounded-xl shadow-md overflow-hidden" data-aos="fade-up">
444
+ <div class="relative h-48">
445
+ <img src="http://static.photos/nightlife/640x360/4" alt="Sponsored Bar" class="w-full h-full object-cover">
446
+ <div class="absolute top-2 left-2 bg-yellow-500 text-white px-2 py-1 rounded text-sm font-medium">
447
+ Sponsored
448
+ </div>
449
+ </div>
450
+ <div class="p-5">
451
+ <h3 class="text-xl font-bold mb-2">Appalachian Pub</h3>
452
+ <p class="text-gray-600 mb-4">$2 Tacos & $4 Margaritas every Tuesday!</p>
453
+ <a href="#" class="text-indigo-600 hover:text-indigo-800 font-medium">
454
+ Learn More <i data-feather="arrow-right" class="w-4 h-4 inline"></i>
455
+ </a>
456
+ </div>
457
+ </div>
458
+
459
+ <!-- Sponsored Event -->
460
+ <div class="bg-white rounded-xl shadow-md overflow-hidden" data-aos="fade-up" data-aos-delay="100">
461
+ <div class="relative h-48">
462
+ <img src="http://static.photos/event/640x360/5" alt="Sponsored Event" class="w-full h-full object-cover">
463
+ <div class="absolute top-2 left-2 bg-yellow-500 text-white px-2 py-1 rounded text-sm font-medium">
464
+ Sponsored
465
+ </div>
466
+ </div>
467
+ <div class="p-5">
468
+ <h3 class="text-xl font-bold mb-2">Beer Festival</h3>
469
+ <p class="text-gray-600 mb-4">June 15th • 50+ breweries • Live music</p>
470
+ <a href="#" class="text-indigo-600 hover:text-indigo-800 font-medium">
471
+ Get Tickets <i data-feather="arrow-right" class="w-4 h-4 inline"></i>
472
+ </a>
473
+ </div>
474
+ </div>
475
+
476
+ <!-- Sponsored Band -->
477
+ <div class="bg-white rounded-xl shadow-md overflow-hidden" data-aos="fade-up" data-aos-delay="200">
478
+ <div class="relative h-48">
479
+ <img src="http://static.photos/music/640x360/1" alt="Sponsored Band" class="w-full h-full object-cover">
480
+ <div class="absolute top-2 left-2 bg-yellow-500 text-white px-2 py-1 rounded text-sm font-medium">
481
+ Sponsored
482
+ </div>
483
+ </div>
484
+ <div class="p-5">
485
+ <h3 class="text-xl font-bold mb-2">The Highlanders</h3>
486
+ <p class="text-gray-600 mb-4">Live at Boone Brews • June 10th</p>
487
+ <a href="#" class="text-indigo-600 hover:text-indigo-800 font-medium">
488
+ Event Details <i data-feather="arrow-right" class="w-4 h-4 inline"></i>
489
+ </a>
490
+ </div>
491
+ </div>
492
+ </div>
493
+ </div>
494
+ </section>
495
+
496
+ <!-- Report Section -->
497
+ <section class="py-12 bg-white">
498
+ <div class="container mx-auto px-4 max-w-4xl">
499
+ <div class="bg-gray-50 rounded-xl p-8 shadow-sm">
500
+ <h2 class="text-2xl font-bold mb-4">See Incorrect Information?</h2>
501
+ <p class="text-gray-600 mb-6">Help us keep BarFinder accurate by reporting outdated or incorrect details about bars and events.</p>
502
+ <button class="bg-indigo-600 text-white px-6 py-3 rounded-lg hover:bg-indigo-700 transition">
503
+ Report an Issue
504
+ </button>
505
+ </div>
506
+ </div>
507
+ </section>
508
+
509
+ <!-- Footer -->
510
+ <footer class="bg-gray-900 text-white py-12">
511
+ <div class="container mx-auto px-4">
512
+ <div class="grid grid-cols-1 md:grid-cols-4 gap-8">
513
+ <div>
514
+ <div class="flex items-center space-x-2 mb-4">
515
+ <i data-feather="cocktail" class="w-6 h-6"></i>
516
+ <span class="font-bold text-xl">BarFinder</span>
517
+ </div>
518
+ <p class="text-gray-400">Discover the best bars and events in Boone, NC.</p>
519
+ </div>
520
+ <div>
521
+ <h3 class="font-bold text-lg mb-4">Quick Links</h3>
522
+ <ul class="space-y-2">
523
+ <li><a href="#" class="text-gray-400 hover:text-white">Home</a></li>
524
+ <li><a href="#bars" class="text-gray-400 hover:text-white">Bars</a></li>
525
+ <li><a href="#events" class="text-gray-400 hover:text-white">Events</a></li>
526
+ <li><a href="#social" class="text-gray-400 hover:text-white">Social</a></li>
527
+ </ul>
528
+ </div>
529
+ <div>
530
+ <h3 class="font-bold text-lg mb-4">Legal</h3>
531
+ <ul class="space-y-2">
532
+ <li><a href="#" class="text-gray-400 hover:text-white">Terms of Service</a></li>
533
+ <li><a href="#" class="text-gray-400 hover:text-white">Privacy Policy</a></li>
534
+ <li><a href="#" class="text-gray-400 hover:text-white">Cookie Policy</a></li>
535
+ <li><a href="#" class="text-gray-400 hover:text-white">Disclaimer</a></li>
536
+ </ul>
537
+ </div>
538
+ <div>
539
+ <h3 class="font-bold text-lg mb-4">Connect</h3>
540
+ <div class="flex space-x-4 mb-4">
541
+ <a href="#" class="text-gray-400 hover:text-white">
542
+ <i data-feather="instagram" class="w-5 h-5"></i>
543
+ </a>
544
+ <a href="#" class="text-gray-400 hover:text-white">
545
+ <i data-feather="facebook" class="w-5 h-5"></i>
546
+ </a>
547
+ <a href="#" class="text-gray-400 hover:text-white">
548
+ <i data-feather="twitter" class="w-5 h-5"></i>
549
+ </a>
550
+ </div>
551
+ <p class="text-gray-400">For bar owners: <a href="admin.html" class="text-indigo-400 hover:text-indigo-300">Claim your listing</a></p>
552
+ </div>
553
+ </div>
554
+ <div class="border-t border-gray-800 mt-8 pt-8 text-center text-gray-500 text-sm">
555
+ <p>© 2023 BarFinder. All rights reserved.</p>
556
+ <p class="mt-1">Made with <i data-feather="heart" class="w-4 h-4 inline text-red-400"></i> in Boone, NC</p>
557
+ </div>
558
+ </div>
559
+ </footer>
560
+
561
+ <script>
562
+ // Mobile menu toggle
563
+ document.getElementById('mobile-menu-button').addEventListener('click', function() {
564
+ const menu = document.getElementById('mobile-menu');
565
+ menu.classList.toggle('hidden');
566
+ });
567
+
568
+ // Menu dropdown toggle
569
+ function toggleMenu(id) {
570
+ const menu = document.getElementById(id);
571
+ menu.classList.toggle('active');
572
+
573
+ const icon = menu.previousElementSpreviousElementSibling.querySelector('i');
574
+ if (menu.classList.contains('active')) {
575
+ icon.setAttribute('data-feather', 'chevron-up');
576
+ } else {
577
+ icon.setAttribute('data-feather', 'chevron-down');
578
+ }
579
+ feather.replace();
580
+ }
581
+
582
+ // Initialize AOS
583
+ AOS.init({
584
+ duration: 800,
585
+ easing: 'ease-in-out',
586
+ once: true
587
+ });
588
+ </script>
589
+ <script>feather.replace();</script>
590
+ </body>
591
  </html>
prompts.txt ADDED
@@ -0,0 +1,6 @@
 
 
 
 
 
 
 
1
+ Needs vs. Wants for features Needs: Clean UI Quick tab to see bars at a glance with their special/event of the day and a button to click to put you in the detailed overview tab for more information (weekly specials, hours, address, busy time, food menu dropdown that business owners can add). Daily, weekly specials (food and drinks), hours, address, busy time, google reviews, age restrictions for the day. Calendar tab that has the monthly events that vendors can populate. Either google calendar and convert that into a custom one or just the google calendar on the app itself. Reporting system for Users and bar owners to report incorrect/old information and get in contact with us. Local Admin we can give permissions to keep the app updated when we graduate and login for them. (Or have AI be the admin). Terms of service, usage policy, privacy policy, legal disclaimer etc. Wants: A social media feed (from instagram) where bar’s posts auto fill as posted. It can then be sorted by specific bar. Radius from the user. Ability for bar owners to input their information themselves about their specific bars. Coordinate with bars and monetization & app promotion strategies. Moderators going through reports and have the ability to update bar info. Moderator login to the app. To recruit admins from other cities/towns we can have an application process with a contract and incentivize them with a % of the profit from their area. Potential customer login/account for rewards and promotions from bars? Age verification from that. Connector between event planners/bands with to bars through app Sponsored page that has 3 sponsored bars (bidded out each week/month or something) and 3 sponsored events/bands. Scaling for the future.. A one stop app that consolidates all relevant information about bars within a preset distance from Boone/App State for users to easily search through specials, events, times, etc.
2
+
3
+
4
+ There should be an admin page to configure the main website like the bars, specials, events.
5
+
6
+ There should also be a way to pull instagram feeds from the bars into a section in the app.