Hugging Face's logo

Spaces:
PTRNL
/
ptc
Running

App Files Community
PTRNL commited on
Commit
2548232
·
verified ·
1 Parent(s): 15c03bd

Ahora que los destinos turisticos sean como un tipo tarjetas con una imagen - Follow Up Deployment

Browse files
Files changed (3) hide show
  1. README.md +7 -5
  2. index.html +739 -19
  3. prompts.txt +12 -0
README.md CHANGED
@@ -1,10 +1,12 @@
1
  ---
2
- title: Ptc
3
- emoji: 🐨
4
- colorFrom: yellow
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: ptc
3
+ emoji: 🐳
4
+ colorFrom: purple
5
+ colorTo: blue
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,739 @@
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="es">
3
+ <head>
4
+ <meta charset="UTF-8">
5
+ <meta name="viewport" content="width=device-width, initial-scale=1.0">
6
+ <title>Turismo El Salvador</title>
7
+ <script src="https://cdn.tailwindcss.com"></script>
8
+ <script src="https://cdn.jsdelivr.net/npm/chart.js"></script>
9
+ <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css">
10
+ <style>
11
+ .sidebar {
12
+ transition: all 0.3s;
13
+ }
14
+ .sidebar.collapsed {
15
+ width: 70px;
16
+ }
17
+ .sidebar.collapsed .nav-text {
18
+ display: none;
19
+ }
20
+ .sidebar.collapsed .logo-text {
21
+ display: none;
22
+ }
23
+ .content {
24
+ transition: all 0.3s;
25
+ }
26
+ .sidebar.collapsed + .content {
27
+ margin-left: 70px;
28
+ }
29
+ .chart-container {
30
+ height: 300px;
31
+ }
32
+ </style>
33
+ </head>
34
+ <body class="bg-gray-50">
35
+ <div class="flex h-screen overflow-hidden">
36
+ <!-- Sidebar -->
37
+ <div class="sidebar bg-blue-800 text-white w-64 flex-shrink-0">
38
+ <div class="p-4 flex items-center">
39
+ <i class="fas fa-umbrella-beach text-2xl mr-3"></i>
40
+ <span class="logo-text font-bold text-xl">Turismo SV</span>
41
+ </div>
42
+ <nav class="mt-6">
43
+ <div class="px-4 py-3 hover:bg-blue-700 cursor-pointer flex items-center active-nav" data-section="dashboard">
44
+ <i class="fas fa-chart-pie mr-3"></i>
45
+ <span class="nav-text">Dashboard</span>
46
+ </div>
47
+ <div class="px-4 py-3 hover:bg-blue-700 cursor-pointer flex items-center" data-section="viajes">
48
+ <i class="fas fa-suitcase-rolling mr-3"></i>
49
+ <span class="nav-text">Viajes</span>
50
+ </div>
51
+ <div class="px-4 py-3 hover:bg-blue-700 cursor-pointer flex items-center" data-section="empleados">
52
+ <i class="fas fa-users mr-3"></i>
53
+ <span class="nav-text">Empleados</span>
54
+ </div>
55
+ <div class="px-4 py-3 hover:bg-blue-700 cursor-pointer flex items-center" data-section="destinos">
56
+ <i class="fas fa-map-marked-alt mr-3"></i>
57
+ <span class="nav-text">Destinos</span>
58
+ </div>
59
+ <div class="px-4 py-3 hover:bg-blue-700 cursor-pointer flex items-center" data-section="facturas">
60
+ <i class="fas fa-file-invoice-dollar mr-3"></i>
61
+ <span class="nav-text">Facturas</span>
62
+ </div>
63
+ <div class="px-4 py-3 hover:bg-blue-700 cursor-pointer flex items-center" data-section="pagos">
64
+ <i class="fas fa-money-bill-wave mr-3"></i>
65
+ <span class="nav-text">Pagos</span>
66
+ </div>
67
+ <div class="px-4 py-3 hover:bg-blue-700 cursor-pointer flex items-center" data-section="reservaciones">
68
+ <i class="fas fa-calendar-check mr-3"></i>
69
+ <span class="nav-text">Reservaciones</span>
70
+ </div>
71
+ <div class="px-4 py-3 hover:bg-blue-700 cursor-pointer flex items-center" data-section="servicios">
72
+ <i class="fas fa-concierge-bell mr-3"></i>
73
+ <span class="nav-text">Servicios</span>
74
+ </div>
75
+ </nav>
76
+ </div>
77
+
78
+ <!-- Main Content -->
79
+ <div class="content flex-1 overflow-auto">
80
+ <!-- Header -->
81
+ <header class="bg-white shadow-sm p-4 flex justify-between items-center">
82
+ <h1 class="text-2xl font-semibold text-gray-800">Dashboard</h1>
83
+ <div class="flex items-center space-x-4">
84
+ <div class="relative">
85
+ <i class="fas fa-bell text-gray-600 cursor-pointer"></i>
86
+ <span class="absolute -top-1 -right-1 bg-red-500 text-white text-xs rounded-full h-4 w-4 flex items-center justify-center">3</span>
87
+ </div>
88
+ <div class="flex items-center">
89
+ <img src="https://randomuser.me/api/portraits/women/44.jpg" alt="Profile" class="h-8 w-8 rounded-full mr-2">
90
+ <span class="text-gray-700">Admin</span>
91
+ </div>
92
+ </div>
93
+ </header>
94
+
95
+ <!-- Dashboard Content -->
96
+ <main class="p-6">
97
+ <div class="section-content" id="dashboard-section">
98
+ <!-- Stats Cards -->
99
+ <div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-4 gap-6 mb-8">
100
+ <div class="bg-white rounded-lg shadow p-6">
101
+ <div class="flex items-center">
102
+ <div class="p-3 rounded-full bg-blue-100 text-blue-600 mr-4">
103
+ <i class="fas fa-suitcase-rolling text-xl"></i>
104
+ </div>
105
+ <div>
106
+ <p class="text-gray-500">Viajes activos</p>
107
+ <h3 class="text-2xl font-bold">24 <span class="text-sm font-normal text-green-600">(+12% vs mes pasado)</span></h3>
108
+ </div>
109
+ </div>
110
+ </div>
111
+ <div class="bg-white rounded-lg shadow p-6">
112
+ <div class="flex items-center">
113
+ <div class="p-3 rounded-full bg-green-100 text-green-600 mr-4">
114
+ <i class="fas fa-dollar-sign text-xl"></i>
115
+ </div>
116
+ <div>
117
+ <p class="text-gray-500">Ingresos mensuales</p>
118
+ <h3 class="text-2xl font-bold">$12,450 <span class="text-sm font-normal text-red-600">(-5% vs mes pasado)</span></h3>
119
+ </div>
120
+ </div>
121
+ </div>
122
+ <div class="bg-white rounded-lg shadow p-6">
123
+ <div class="flex items-center">
124
+ <div class="p-3 rounded-full bg-purple-100 text-purple-600 mr-4">
125
+ <i class="fas fa-users text-xl"></i>
126
+ </div>
127
+ <div>
128
+ <p class="text-gray-500">Clientes nuevos</p>
129
+ <h3 class="text-2xl font-bold">18 <span class="text-sm font-normal text-green-600">(+20% vs mes pasado)</span></h3>
130
+ </div>
131
+ </div>
132
+ </div>
133
+ <div class="bg-white rounded-lg shadow p-6">
134
+ <div class="flex items-center">
135
+ <div class="p-3 rounded-full bg-yellow-100 text-yellow-600 mr-4">
136
+ <i class="fas fa-calendar-check text-xl"></i>
137
+ </div>
138
+ <div>
139
+ <p class="text-gray-500">Reservaciones</p>
140
+ <h3 class="text-2xl font-bold">32 <span class="text-sm font-normal text-green-600">(+8% vs mes pasado)</span></h3>
141
+ </div>
142
+ </div>
143
+ </div>
144
+ </div>
145
+
146
+ <!-- Charts -->
147
+ <div class="grid grid-cols-1 lg:grid-cols-2 gap-6 mb-8">
148
+ <div class="bg-white rounded-lg shadow p-6">
149
+ <h3 class="text-lg font-semibold mb-4">Viajes por destino</h3>
150
+ <div class="chart-container">
151
+ <canvas id="destinationsChart"></canvas>
152
+ </div>
153
+ </div>
154
+ <div class="bg-white rounded-lg shadow p-6">
155
+ <h3 class="text-lg font-semibold mb-4">Ingresos mensuales</h3>
156
+ <div class="chart-container">
157
+ <canvas id="revenueChart"></canvas>
158
+ </div>
159
+ </div>
160
+ </div>
161
+
162
+ <!-- Destinos destacados -->
163
+ <div class="bg-white rounded-lg shadow p-6 mb-8">
164
+ <h3 class="text-lg font-semibold mb-4">Destinos Turísticos de El Salvador</h3>
165
+ <div class="grid grid-cols-1 md:grid-cols-3 gap-4">
166
+ <div class="border rounded-lg p-4">
167
+ <h4 class="font-medium text-blue-600 mb-2">Ruta de las Flores</h4>
168
+ <p class="text-gray-600 text-sm mb-2"><i class="fas fa-map-marker-alt mr-2"></i>Departamento: Sonsonate</p>
169
+ <p class="text-gray-600 text-sm mb-2"><i class="fas fa-info-circle mr-2"></i>Pueblos coloniales: Juayúa, Apaneca, Ataco</p>
170
+ <p class="text-gray-600 text-sm mb-2"><i class="fas fa-star mr-2"></i>Atractivos: Cafetales, gastronomía, festivales</p>
171
+ <p class="text-gray-600 text-sm">Es un recorrido pintoresco por pueblos coloniales famosos por sus cafetales y festivales gastronómicos los fines de semana. La ruta ofrece paisajes montañosos, clima fresco y artesanías locales.</p>
172
+ </div>
173
+ <div class="border rounded-lg p-4">
174
+ <h4 class="font-medium text-blue-600 mb-2">Playa El Tunco</h4>
175
+ <p class="text-gray-600 text-sm">La playa más famosa para surfistas, con ambiente bohemio, hoteles boutique, restaurantes y espectaculares atardeceres sobre el Océano Pacífico.</p>
176
+ </div>
177
+ <div class="border rounded-lg p-4">
178
+ <h4 class="font-medium text-blue-600 mb-2">Lago de Coatepeque</h4>
179
+ <p class="text-gray-600 text-sm">Hermoso lago de origen volcánico con aguas cristalinas que cambian de color, ideal para deportes acuáticos, paseos en bote y relajarse en sus hoteles con vista al lago.</p>
180
+ </div>
181
+ </div>
182
+ </div>
183
+
184
+ <!-- Más información -->
185
+ <div class="bg-white rounded-lg shadow p-6">
186
+ <h3 class="text-lg font-semibold mb-4">¿Por qué visitar El Salvador?</h3>
187
+ <div class="space-y-4">
188
+ <p class="text-gray-600">El Salvador, conocido como "El Pulgarcito de América", ofrece una gran diversidad en un territorio pequeño: playas paradisíacas, volcanes imponentes, pueblos coloniales y una rica cultura.</p>
189
+ <p class="text-gray-600">Nuestros tours incluyen:</p>
190
+ <ul class="list-disc list-inside text-gray-600 space-y-2">
191
+ <li>Guías turísticos certificados</li>
192
+ <li>Transporte seguro y cómodo</li>
193
+ <li>Alimentación típica incluida</li>
194
+ <li>Seguro médico básico</li>
195
+ <li>Acceso a los mejores miradores y atracciones</li>
196
+ </ul>
197
+ </div>
198
+ </div>
199
+ </div>
200
+
201
+ <!-- Viajes Section -->
202
+ <div class="section-content hidden" id="viajes-section">
203
+ <div class="bg-white rounded-lg shadow overflow-hidden">
204
+ <div class="p-6 border-b border-gray-200">
205
+ <h2 class="text-xl font-semibold text-gray-800">Viajes Turísticos</h2>
206
+ </div>
207
+ <div class="overflow-x-auto">
208
+ <table class="min-w-full divide-y divide-gray-200">
209
+ <thead class="bg-gray-50">
210
+ <tr>
211
+ <th class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">Código</th>
212
+ <th class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">Nombre</th>
213
+ <th class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">Destino</th>
214
+ <th class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">Fecha</th>
215
+ <th class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">Precio</th>
216
+ <th class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">Estado</th>
217
+ </tr>
218
+ </thead>
219
+ <tbody class="bg-white divide-y divide-gray-200">
220
+ <tr>
221
+ <td class="px-6 py-4 whitespace-nowrap">VT001</td>
222
+ <td class="px-6 py-4 whitespace-nowrap">Tour Ruta de las Flores</td>
223
+ <td class="px-6 py-4 whitespace-nowrap">Apaneca</td>
224
+ <td class="px-6 py-4 whitespace-nowrap">15/07/2023</td>
225
+ <td class="px-6 py-4 whitespace-nowrap">$75.00</td>
226
+ <td class="px-6 py-4 whitespace-nowrap"><span class="px-2 py-1 text-xs rounded-full bg-green-100 text-green-800">Activo</span></td>
227
+ </tr>
228
+ <tr>
229
+ <td class="px-6 py-4 whitespace-nowrap">VT002</td>
230
+ <td class="px-6 py-4 whitespace-nowrap">Playa El Tunco</td>
231
+ <td class="px-6 py-4 whitespace-nowrap">La Libertad</td>
232
+ <td class="px-6 py-4 whitespace-nowrap">22/07/2023</td>
233
+ <td class="px-6 py-4 whitespace-nowrap">$60.00</td>
234
+ <td class="px-6 py-4 whitespace-nowrap"><span class="px-2 py-1 text-xs rounded-full bg-green-100 text-green-800">Activo</span></td>
235
+ </tr>
236
+ <tr>
237
+ <td class="px-6 py-4 whitespace-nowrap">VT003</td>
238
+ <td class="px-6 py-4 whitespace-nowrap">Lago de Coatepeque</td>
239
+ <td class="px-6 py-4 whitespace-nowrap">Santa Ana</td>
240
+ <td class="px-6 py-4 whitespace-nowrap">29/07/2023</td>
241
+ <td class="px-6 py-4 whitespace-nowrap">$85.00</td>
242
+ <td class="px-6 py-4 whitespace-nowrap"><span class="px-2 py-1 text-xs rounded-full bg-yellow-100 text-yellow-800">Próximo</span></td>
243
+ </tr>
244
+ <tr>
245
+ <td class="px-6 py-4 whitespace-nowrap">VT004</td>
246
+ <td class="px-6 py-4 whitespace-nowrap">Volcán Ilamatepec</td>
247
+ <td class="px-6 py-4 whitespace-nowrap">Santa Ana</td>
248
+ <td class="px-6 py-4 whitespace-nowrap">05/08/2023</td>
249
+ <td class="px-6 py-4 whitespace-nowrap">$90.00</td>
250
+ <td class="px-6 py-4 whitespace-nowrap"><span class="px-2 py-1 text-xs rounded-full bg-yellow-100 text-yellow-800">Próximo</span></td>
251
+ </tr>
252
+ </tbody>
253
+ </table>
254
+ </div>
255
+ <div class="p-4 border-t border-gray-200 flex justify-end">
256
+ <button class="bg-blue-600 hover:bg-blue-700 text-white px-4 py-2 rounded-md flex items-center">
257
+ <i class="fas fa-plus mr-2"></i> Nuevo Viaje
258
+ </button>
259
+ </div>
260
+ </div>
261
+ </div>
262
+
263
+ <!-- Empleados Section -->
264
+ <div class="section-content hidden" id="empleados-section">
265
+ <div class="bg-white rounded-lg shadow overflow-hidden">
266
+ <div class="p-6 border-b border-gray-200">
267
+ <h2 class="text-xl font-semibold text-gray-800">Empleados</h2>
268
+ </div>
269
+ <div class="overflow-x-auto">
270
+ <table class="min-w-full divide-y divide-gray-200">
271
+ <thead class="bg-gray-50">
272
+ <tr>
273
+ <th class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">ID</th>
274
+ <th class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">Nombre</th>
275
+ <th class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">Puesto</th>
276
+ <th class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">Teléfono</th>
277
+ <th class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">Email</th>
278
+ <th class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">Estado</th>
279
+ </tr>
280
+ </thead>
281
+ <tbody class="bg-white divide-y divide-gray-200">
282
+ <tr>
283
+ <td class="px-6 py-4 whitespace-nowrap">EMP001</td>
284
+ <td class="px-6 py-4 whitespace-nowrap">Carlos Martínez</td>
285
+ <td class="px-6 py-4 whitespace-nowrap">Guía turístico</td>
286
+ <td class="px-6 py-4 whitespace-nowrap">7123-4567</td>
287
+ <td class="px-6 py-4 whitespace-nowrap">carlos@tursv.com</td>
288
+ <td class="px-6 py-4 whitespace-nowrap"><span class="px-2 py-1 text-xs rounded-full bg-green-100 text-green-800">Activo</span></td>
289
+ </tr>
290
+ <tr>
291
+ <td class="px-6 py-4 whitespace-nowrap">EMP002</td>
292
+ <td class="px-6 py-4 whitespace-nowrap">Ana Rodríguez</td>
293
+ <td class="px-6 py-4 whitespace-nowrap">Coordinadora</td>
294
+ <td class="px-6 py-4 whitespace-nowrap">7890-1234</td>
295
+ <td class="px-6 py-4 whitespace-nowrap">ana@tursv.com</td>
296
+ <td class="px-6 py-4 whitespace-nowrap"><span class="px-2 py-1 text-xs rounded-full bg-green-100 text-green-800">Activo</span></td>
297
+ </tr>
298
+ <tr>
299
+ <td class="px-6 py-4 whitespace-nowrap">EMP003</td>
300
+ <td class="px-6 py-4 whitespace-nowrap">Luis Hernández</td>
301
+ <td class="px-6 py-4 whitespace-nowrap">Conductor</td>
302
+ <td class="px-6 py-4 whitespace-nowrap">7654-3210</td>
303
+ <td class="px-6 py-4 whitespace-nowrap">luis@tursv.com</td>
304
+ <td class="px-6 py-4 whitespace-nowrap"><span class="px-2 py-1 text-xs rounded-full bg-green-100 text-green-800">Activo</span></td>
305
+ </tr>
306
+ </tbody>
307
+ </table>
308
+ </div>
309
+ <div class="p-4 border-t border-gray-200 flex justify-end">
310
+ <button class="bg-blue-600 hover:bg-blue-700 text-white px-4 py-2 rounded-md flex items-center">
311
+ <i class="fas fa-plus mr-2"></i> Nuevo Empleado
312
+ </button>
313
+ </div>
314
+ </div>
315
+ </div>
316
+
317
+ <!-- Destinos Section -->
318
+ <div class="section-content hidden" id="destinos-section">
319
+ <div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-6">
320
+ <!-- Destination Card 1 -->
321
+ <div class="bg-white rounded-lg shadow overflow-hidden">
322
+ <img src="https://elsalvador.travel/wp-content/uploads/2020/12/playa-el-tunco-1.jpg" alt="El Tunco" class="w-full h-48 object-cover">
323
+ <div class="p-4">
324
+ <h3 class="text-lg font-semibold mb-2">Playa El Tunco</h3>
325
+ <p class="text-gray-600 mb-4">Famosa playa para surfear con ambiente bohemio y hermosos atardeceres.</p>
326
+ <div class="flex justify-between items-center">
327
+ <span class="text-blue-600 font-medium">$60.00</span>
328
+ <button class="text-blue-600 hover:text-blue-800">Ver detalles</button>
329
+ </div>
330
+ </div>
331
+ </div>
332
+
333
+ <!-- Destination Card 2 -->
334
+ <div class="bg-white rounded-lg shadow overflow-hidden">
335
+ <img src="https://elsalvador.travel/wp-content/uploads/2020/12/ruta-de-las-flores-1.jpg" alt="Ruta de las Flores" class="w-full h-48 object-cover">
336
+ <div class="p-4">
337
+ <h3 class="text-lg font-semibold mb-2">Ruta de las Flores</h3>
338
+ <p class="text-gray-600 mb-4">Pintoresca ruta con pueblos coloridos, cafetales y artesanías.</p>
339
+ <div class="flex justify-between items-center">
340
+ <span class="text-blue-600 font-medium">$75.00</span>
341
+ <button class="text-blue-600 hover:text-blue-800">Ver detalles</button>
342
+ </div>
343
+ </div>
344
+ </div>
345
+
346
+ <!-- Destination Card 3 -->
347
+ <div class="bg-white rounded-lg shadow overflow-hidden">
348
+ <img src="https://elsalvador.travel/wp-content/uploads/2020/12/lago-de-coatepeque-1.jpg" alt="Lago de Coatepeque" class="w-full h-48 object-cover">
349
+ <div class="p-4">
350
+ <h3 class="text-lg font-semibold mb-2">Lago de Coatepeque</h3>
351
+ <p class="text-gray-600 mb-4">Hermoso lago de origen volcánico con aguas cristalinas.</p>
352
+ <div class="flex justify-between items-center">
353
+ <span class="text-blue-600 font-medium">$85.00</span>
354
+ <button class="text-blue-600 hover:text-blue-800">Ver detalles</button>
355
+ </div>
356
+ </div>
357
+ </div>
358
+ </div>
359
+
360
+ <div class="mt-6 flex justify-end">
361
+ <button class="bg-blue-600 hover:bg-blue-700 text-white px-4 py-2 rounded-md flex items-center">
362
+ <i class="fas fa-plus mr-2"></i> Agregar Destino
363
+ </button>
364
+ </div>
365
+ </div>
366
+
367
+ <!-- Facturas Section -->
368
+ <div class="section-content hidden" id="facturas-section">
369
+ <div class="bg-white rounded-lg shadow overflow-hidden">
370
+ <div class="p-6 border-b border-gray-200">
371
+ <h2 class="text-xl font-semibold text-gray-800">Facturas</h2>
372
+ </div>
373
+ <div class="overflow-x-auto">
374
+ <table class="min-w-full divide-y divide-gray-200">
375
+ <thead class="bg-gray-50">
376
+ <tr>
377
+ <th class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">N° Factura</th>
378
+ <th class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">Cliente</th>
379
+ <th class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">Fecha</th>
380
+ <th class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">Monto</th>
381
+ <th class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">Estado</th>
382
+ <th class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">Acciones</th>
383
+ </tr>
384
+ </thead>
385
+ <tbody class="bg-white divide-y divide-gray-200">
386
+ <tr>
387
+ <td class="px-6 py-4 whitespace-nowrap">FAC-2023-001</td>
388
+ <td class="px-6 py-4 whitespace-nowrap">María González</td>
389
+ <td class="px-6 py-4 whitespace-nowrap">10/07/2023</td>
390
+ <td class="px-6 py-4 whitespace-nowrap">$150.00</td>
391
+ <td class="px-6 py-4 whitespace-nowrap"><span class="px-2 py-1 text-xs rounded-full bg-green-100 text-green-800">Pagada</span></td>
392
+ <td class="px-6 py-4 whitespace-nowrap">
393
+ <button class="text-blue-600 hover:text-blue-800 mr-2"><i class="fas fa-eye"></i></button>
394
+ <button class="text-green-600 hover:text-green-800"><i class="fas fa-download"></i></button>
395
+ </td>
396
+ </tr>
397
+ <tr>
398
+ <td class="px-6 py-4 whitespace-nowrap">FAC-2023-002</td>
399
+ <td class="px-6 py-4 whitespace-nowrap">Juan Pérez</td>
400
+ <td class="px-6 py-4 whitespace-nowrap">12/07/2023</td>
401
+ <td class="px-6 py-4 whitespace-nowrap">$225.00</td>
402
+ <td class="px-6 py-4 whitespace-nowrap"><span class="px-2 py-1 text-xs rounded-full bg-green-100 text-green-800">Pagada</span></td>
403
+ <td class="px-6 py-4 whitespace-nowrap">
404
+ <button class="text-blue-600 hover:text-blue-800 mr-2"><i class="fas fa-eye"></i></button>
405
+ <button class="text-green-600 hover:text-green-800"><i class="fas fa-download"></i></button>
406
+ </td>
407
+ </tr>
408
+ <tr>
409
+ <td class="px-6 py-4 whitespace-nowrap">FAC-2023-003</td>
410
+ <td class="px-6 py-4 whitespace-nowrap">Roberto Sánchez</td>
411
+ <td class="px-6 py-4 whitespace-nowrap">15/07/2023</td>
412
+ <td class="px-6 py-4 whitespace-nowrap">$180.00</td>
413
+ <td class="px-6 py-4 whitespace-nowrap"><span class="px-2 py-1 text-xs rounded-full bg-yellow-100 text-yellow-800">Pendiente</span></td>
414
+ <td class="px-6 py-4 whitespace-nowrap">
415
+ <button class="text-blue-600 hover:text-blue-800 mr-2"><i class="fas fa-eye"></i></button>
416
+ <button class="text-green-600 hover:text-green-800"><i class="fas fa-download"></i></button>
417
+ </td>
418
+ </tr>
419
+ </tbody>
420
+ </table>
421
+ </div>
422
+ <div class="p-4 border-t border-gray-200 flex justify-end">
423
+ <button class="bg-blue-600 hover:bg-blue-700 text-white px-4 py-2 rounded-md flex items-center">
424
+ <i class="fas fa-plus mr-2"></i> Nueva Factura
425
+ </button>
426
+ </div>
427
+ </div>
428
+ </div>
429
+
430
+ <!-- Pagos Section -->
431
+ <div class="section-content hidden" id="pagos-section">
432
+ <div class="bg-white rounded-lg shadow overflow-hidden">
433
+ <div class="p-6 border-b border-gray-200">
434
+ <h2 class="text-xl font-semibold text-gray-800">Pagos</h2>
435
+ </div>
436
+ <div class="overflow-x-auto">
437
+ <table class="min-w-full divide-y divide-gray-200">
438
+ <thead class="bg-gray-50">
439
+ <tr>
440
+ <th class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">ID Pago</th>
441
+ <th class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">Factura</th>
442
+ <th class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">Cliente</th>
443
+ <th class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">Fecha</th>
444
+ <th class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">Monto</th>
445
+ <th class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">Método</th>
446
+ </tr>
447
+ </thead>
448
+ <tbody class="bg-white divide-y divide-gray-200">
449
+ <tr>
450
+ <td class="px-6 py-4 whitespace-nowrap">PAG-001</td>
451
+ <td class="px-6 py-4 whitespace-nowrap">FAC-2023-001</td>
452
+ <td class="px-6 py-4 whitespace-nowrap">María González</td>
453
+ <td class="px-6 py-4 whitespace-nowrap">10/07/2023</td>
454
+ <td class="px-6 py-4 whitespace-nowrap">$150.00</td>
455
+ <td class="px-6 py-4 whitespace-nowrap">Tarjeta</td>
456
+ </tr>
457
+ <tr>
458
+ <td class="px-6 py-4 whitespace-nowrap">PAG-002</td>
459
+ <td class="px-6 py-4 whitespace-nowrap">FAC-2023-002</td>
460
+ <td class="px-6 py-4 whitespace-nowrap">Juan Pérez</td>
461
+ <td class="px-6 py-4 whitespace-nowrap">12/07/2023</td>
462
+ <td class="px-6 py-4 whitespace-nowrap">$225.00</td>
463
+ <td class="px-6 py-4 whitespace-nowrap">Efectivo</td>
464
+ </tr>
465
+ <tr>
466
+ <td class="px-6 py-4 whitespace-nowrap">PAG-003</td>
467
+ <td class="px-6 py-4 whitespace-nowrap">FAC-2023-004</td>
468
+ <td class="px-6 py-4 whitespace-nowrap">Laura Ramírez</td>
469
+ <td class="px-6 py-4 whitespace-nowrap">14/07/2023</td>
470
+ <td class="px-6 py-4 whitespace-nowrap">$120.00</td>
471
+ <td class="px-6 py-4 whitespace-nowrap">Transferencia</td>
472
+ </tr>
473
+ </tbody>
474
+ </table>
475
+ </div>
476
+ <div class="p-4 border-t border-gray-200 flex justify-end">
477
+ <button class="bg-blue-600 hover:bg-blue-700 text-white px-4 py-2 rounded-md flex items-center">
478
+ <i class="fas fa-plus mr-2"></i> Registrar Pago
479
+ </button>
480
+ </div>
481
+ </div>
482
+ </div>
483
+
484
+ <!-- Reservaciones Section -->
485
+ <div class="section-content hidden" id="reservaciones-section">
486
+ <div class="bg-white rounded-lg shadow overflow-hidden">
487
+ <div class="p-6 border-b border-gray-200">
488
+ <h2 class="text-xl font-semibold text-gray-800">Reservaciones</h2>
489
+ </div>
490
+ <div class="overflow-x-auto">
491
+ <table class="min-w-full divide-y divide-gray-200">
492
+ <thead class="bg-gray-50">
493
+ <tr>
494
+ <th class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">Código</th>
495
+ <th class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">Cliente</th>
496
+ <th class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">Viaje</th>
497
+ <th class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">Fecha</th>
498
+ <th class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">Personas</th>
499
+ <th class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">Estado</th>
500
+ </tr>
501
+ </thead>
502
+ <tbody class="bg-white divide-y divide-gray-200">
503
+ <tr>
504
+ <td class="px-6 py-4 whitespace-nowrap">RES-001</td>
505
+ <td class="px-6 py-4 whitespace-nowrap">María González</td>
506
+ <td class="px-6 py-4 whitespace-nowrap">Tour Ruta de las Flores</td>
507
+ <td class="px-6 py-4 whitespace-nowrap">15/07/2023</td>
508
+ <td class="px-6 py-4 whitespace-nowrap">2</td>
509
+ <td class="px-6 py-4 whitespace-nowrap"><span class="px-2 py-1 text-xs rounded-full bg-green-100 text-green-800">Confirmada</span></td>
510
+ </tr>
511
+ <tr>
512
+ <td class="px-6 py-4 whitespace-nowrap">RES-002</td>
513
+ <td class="px-6 py-4 whitespace-nowrap">Juan Pérez</td>
514
+ <td class="px-6 py-4 whitespace-nowrap">Playa El Tunco</td>
515
+ <td class="px-6 py-4 whitespace-nowrap">22/07/2023</td>
516
+ <td class="px-6 py-4 whitespace-nowrap">4</td>
517
+ <td class="px-6 py-4 whitespace-nowrap"><span class="px-2 py-1 text-xs rounded-full bg-green-100 text-green-800">Confirmada</span></td>
518
+ </tr>
519
+ <tr>
520
+ <td class="px-6 py-4 whitespace-nowrap">RES-003</td>
521
+ <td class="px-6 py-4 whitespace-nowrap">Roberto Sánchez</td>
522
+ <td class="px-6 py-4 whitespace-nowrap">Lago de Coatepeque</td>
523
+ <td class="px-6 py-4 whitespace-nowrap">29/07/2023</td>
524
+ <td class="px-6 py-4 whitespace-nowrap">3</td>
525
+ <td class="px-6 py-4 whitespace-nowrap"><span class="px-2 py-1 text-xs rounded-full bg-yellow-100 text-yellow-800">Pendiente</span></td>
526
+ </tr>
527
+ </tbody>
528
+ </table>
529
+ </div>
530
+ <div class="p-4 border-t border-gray-200 flex justify-end">
531
+ <button class="bg-blue-600 hover:bg-blue-700 text-white px-4 py-2 rounded-md flex items-center">
532
+ <i class="fas fa-plus mr-2"></i> Nueva Reservación
533
+ </button>
534
+ </div>
535
+ </div>
536
+ </div>
537
+
538
+ <!-- Servicios Section -->
539
+ <div class="section-content hidden" id="servicios-section">
540
+ <div class="mb-8">
541
+ <h2 class="text-xl font-semibold mb-4">Transportes</h2>
542
+ <div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-6">
543
+ <!-- Transport Card 1 -->
544
+ <div class="bg-white rounded-lg shadow overflow-hidden">
545
+ <img src="https://images.unsplash.com/photo-1544620347-c4fd4a3d5957?ixlib=rb-1.2.1&auto=format&fit=crop&w=500&q=60" alt="Autobús" class="w-full h-48 object-cover">
546
+ <div class="p-4">
547
+ <h3 class="text-lg font-semibold mb-2">Autobús Turístico</h3>
548
+ <p class="text-gray-600 mb-2"><i class="fas fa-users mr-2"></i> Capacidad: 40 personas</p>
549
+ <p class="text-gray-600 mb-4"><i class="fas fa-car mr-2"></i> Placa: P123456</p>
550
+ <div class="flex justify-between items-center">
551
+ <span class="text-green-600 font-medium">Disponible</span>
552
+ <button class="text-blue-600 hover:text-blue-800">Ver detalles</button>
553
+ </div>
554
+ </div>
555
+ </div>
556
+
557
+ <!-- Transport Card 2 -->
558
+ <div class="bg-white rounded-lg shadow overflow-hidden">
559
+ <img src="https://images.unsplash.com/photo-1502164980785-f8aa41d53611?ixlib=rb-1.2.1&auto=format&fit=crop&w=500&q=60" alt="Minibús" class="w-full h-48 object-cover">
560
+ <div class="p-4">
561
+ <h3 class="text-lg font-semibold mb-2">Minibús</h3>
562
+ <p class="text-gray-600 mb-2"><i class="fas fa-users mr-2"></i> Capacidad: 15 personas</p>
563
+ <p class="text-gray-600 mb-4"><i class="fas fa-car mr-2"></i> Placa: M654321</p>
564
+ <div class="flex justify-between items-center">
565
+ <span class="text-green-600 font-medium">Disponible</span>
566
+ <button class="text-blue-600 hover:text-blue-800">Ver detalles</button>
567
+ </div>
568
+ </div>
569
+ </div>
570
+
571
+ <!-- Transport Card 3 -->
572
+ <div class="bg-white rounded-lg shadow overflow-hidden">
573
+ <img src="https://images.unsplash.com/photo-1568605117036-5fe5e7bab0b7?ixlib=rb-1.2.1&auto=format&fit=crop&w=500&q=60" alt="Van" class="w-full h-48 object-cover">
574
+ <div class="p-4">
575
+ <h3 class="text-lg font-semibold mb-2">Van Ejecutiva</h3>
576
+ <p class="text-gray-600 mb-2"><i class="fas fa-users mr-2"></i> Capacidad: 8 personas</p>
577
+ <p class="text-gray-600 mb-4"><i class="fas fa-car mr-2"></i> Placa: V987654</p>
578
+ <div class="flex justify-between items-center">
579
+ <span class="text-red-600 font-medium">En mantenimiento</span>
580
+ <button class="text-blue-600 hover:text-blue-800">Ver detalles</button>
581
+ </div>
582
+ </div>
583
+ </div>
584
+ </div>
585
+
586
+ <div class="mt-6 flex justify-end">
587
+ <button class="bg-blue-600 hover:bg-blue-700 text-white px-4 py-2 rounded-md flex items-center">
588
+ <i class="fas fa-plus mr-2"></i> Agregar Transporte
589
+ </button>
590
+ </div>
591
+ </div>
592
+
593
+ <div class="mt-8">
594
+ <h2 class="text-xl font-semibold mb-4">Servicios en Eventos</h2>
595
+ <div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-6">
596
+ <!-- Event Card 1 -->
597
+ <div class="bg-white rounded-lg shadow overflow-hidden">
598
+ <img src="https://elsalvador.travel/wp-content/uploads/2020/12/festival-apaneca-1.jpg" alt="Festival Apaneca" class="w-full h-48 object-cover">
599
+ <div class="p-4">
600
+ <h3 class="text-lg font-semibold mb-2">Festival del Café</h3>
601
+ <p class="text-gray-600 mb-2"><i class="fas fa-map-marker-alt mr-2"></i> Apaneca</p>
602
+ <p class="text-gray-600 mb-2"><i class="fas fa-calendar-day mr-2"></i> 25-27 Agosto 2023</p>
603
+ <p class="text-gray-600 mb-4">Festival anual del café con degustaciones y actividades culturales.</p>
604
+ <div class="flex justify-between items-center">
605
+ <span class="text-blue-600 font-medium">20 cupos</span>
606
+ <button class="text-blue-600 hover:text-blue-800">Ver detalles</button>
607
+ </div>
608
+ </div>
609
+ </div>
610
+
611
+ <!-- Event Card 2 -->
612
+ <div class="bg-white rounded-lg shadow overflow-hidden">
613
+ <img src="https://elsalvador.travel/wp-content/uploads/2020/12/surf-city-1.jpg" alt="Surf City" class="w-full h-48 object-cover">
614
+ <div class="p-4">
615
+ <h3 class="text-lg font-semibold mb-2">Torneo de Surf</h3>
616
+ <p class="text-gray-600 mb-2"><i class="fas fa-map-marker-alt mr-2"></i> El Tunco</p>
617
+ <p class="text-gray-600 mb-2"><i class="fas fa-calendar-day mr-2"></i> 15-17 Septiembre 2023</p>
618
+ <p class="text-gray-600 mb-4">Competencia internacional de surf con participantes de todo el mundo.</p>
619
+ <div class="flex justify-between items-center">
620
+ <span class="text-blue-600 font-medium">35 cupos</span>
621
+ <button class="text-blue-600 hover:text-blue-800">Ver detalles</button>
622
+ </div>
623
+ </div>
624
+ </div>
625
+
626
+ <!-- Event Card 3 -->
627
+ <div class="bg-white rounded-lg shadow overflow-hidden">
628
+ <img src="https://elsalvador.travel/wp-content/uploads/2020/12/fiestas-aguilares-1.jpg" alt="Fiestas Aguilares" class="w-full h-48 object-cover">
629
+ <div class="p-4">
630
+ <h3 class="text-lg font-semibold mb-2">Fiestas Patronales</h3>
631
+ <p class="text-gray-600 mb-2"><i class="fas fa-map-marker-alt mr-2"></i> Santa Ana</p>
632
+ <p class="text-gray-600 mb-2"><i class="fas fa-calendar-day mr-2"></i> 20-26 Julio 2023</p>
633
+ <p class="text-gray-600 mb-4">Tradicionales fiestas patronales con ferias, música y gastronomía.</p>
634
+ <div class="flex justify-between items-center">
635
+ <span class="text-blue-600 font-medium">15 cupos</span>
636
+ <button class="text-blue-600 hover:text-blue-800">Ver detalles</button>
637
+ </div>
638
+ </div>
639
+ </div>
640
+ </div>
641
+
642
+ <div class="mt-6 flex justify-end">
643
+ <button class="bg-blue-600 hover:bg-blue-700 text-white px-4 py-2 rounded-md flex items-center">
644
+ <i class="fas fa-plus mr-2"></i> Agregar Evento
645
+ </button>
646
+ </div>
647
+ </div>
648
+ </main>
649
+ </div>
650
+ </div>
651
+
652
+ <script>
653
+ // Navigation between sections
654
+ document.querySelectorAll('nav div[data-section]').forEach(item => {
655
+ item.addEventListener('click', function() {
656
+ const section = this.getAttribute('data-section');
657
+
658
+ // Update active nav item
659
+ document.querySelectorAll('nav div').forEach(navItem => {
660
+ navItem.classList.remove('bg-blue-700', 'active-nav');
661
+ });
662
+ this.classList.add('bg-blue-700', 'active-nav');
663
+
664
+ // Update header title
665
+ const headerTitle = document.querySelector('header h1');
666
+ headerTitle.textContent = this.querySelector('.nav-text').textContent;
667
+
668
+ // Hide all sections
669
+ document.querySelectorAll('.section-content').forEach(section => {
670
+ section.classList.add('hidden');
671
+ });
672
+
673
+ // Show selected section
674
+ document.getElementById(`${section}-section`).classList.remove('hidden');
675
+ });
676
+ });
677
+
678
+ // Charts
679
+ document.addEventListener('DOMContentLoaded', function() {
680
+ // Destinations Chart
681
+ const destinationsCtx = document.getElementById('destinationsChart').getContext('2d');
682
+ const destinationsChart = new Chart(destinationsCtx, {
683
+ type: 'doughnut',
684
+ data: {
685
+ labels: ['Ruta de las Flores', 'El Tunco', 'Coatepeque', 'Volcán Ilamatepec', 'Suchitoto'],
686
+ datasets: [{
687
+ data: [15, 12, 8, 5, 7],
688
+ backgroundColor: [
689
+ '#3B82F6',
690
+ '#10B981',
691
+ '#F59E0B',
692
+ '#6366F1',
693
+ '#EC4899'
694
+ ],
695
+ borderWidth: 0
696
+ }]
697
+ },
698
+ options: {
699
+ responsive: true,
700
+ maintainAspectRatio: false,
701
+ plugins: {
702
+ legend: {
703
+ position: 'right'
704
+ }
705
+ }
706
+ }
707
+ });
708
+
709
+ // Revenue Chart
710
+ const revenueCtx = document.getElementById('revenueChart').getContext('2d');
711
+ const revenueChart = new Chart(revenueCtx, {
712
+ type: 'line',
713
+ data: {
714
+ labels: ['Ene', 'Feb', 'Mar', 'Abr', 'May', 'Jun', 'Jul'],
715
+ datasets: [{
716
+ label: 'Ingresos ($)',
717
+ data: [8500, 9200, 10500, 11200, 9800, 12450, 11800],
718
+ backgroundColor: 'rgba(59, 130, 246, 0.1)',
719
+ borderColor: '#3B82F6',
720
+ borderWidth: 2,
721
+ tension: 0.3,
722
+ fill: true
723
+ }]
724
+ },
725
+ options: {
726
+ responsive: true,
727
+ maintainAspectRatio: false,
728
+ scales: {
729
+ y: {
730
+ beginAtZero: true
731
+ }
732
+ }
733
+ }
734
+ });
735
+
736
+ });
737
+ </script>
738
+ <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://deepsite.hf.co/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://deepsite.hf.co" style="color: #fff;text-decoration: underline;" target="_blank" >DeepSite</a> - 🧬 <a href="https://deepsite.hf.co?remix=PTRNL/ptc" style="color: #fff;text-decoration: underline;" target="_blank" >Remix</a></p></body>
739
+ </html>
prompts.txt ADDED
@@ -0,0 +1,12 @@
 
 
 
 
 
 
 
 
 
 
 
 
 
1
+ Dame una pagina de viajes turisticos en el salvador en el cual contenga viajes, empleados, destinos, facturas, pagos, reservaciones, trasportes, eventos, y que en el apartado principal incluya unos graficos con respecto a la informacion de cada uno de los apartados mencionados con un navbar en vertical con cada apartado por separado y que el sistema sea minimalista y facil de entender
2
+ Podrias darme de otra manera la pagina y que en el navbar que al pasar el cursor se expandan las opciones
3
+ Podrias quitarme la opcion del contraer el menu y ponerlo de color azul con un logo de un autobus con el nombre de explorer world
4
+ Ahora dame una animacion en el navbar que al momento de pasar el cursor en alguna de las opciones que el menu se despliegue y cuando el cursor no este en el navbar que se contraiga
5
+ Dame el espacio con el navbar con el contenido principal
6
+ Dame la pagina de otra forma con las mismas caracteristicas con el navbar de color azul pero damelo de otra manera mas sencilla pero minimalista
7
+ Dame una pagina de viajes turisticos en el salvador en el cual contenga viajes, empleados, destinos, facturas, pagos, reservaciones, trasportes, eventos, y que en el apartado principal incluya unos graficos con respecto a la informacion de cada uno de los apartados mencionados con un navbar en vertical con cada apartado por separado y que el sistema sea minimalista y facil de entender
8
+ Puedes quitarme los 2 graficos de abajo y ponerme un poco de informacion acerca de los destinos
9
+ Quitame la opcion de contraer
10
+ Ahora puedes dejarme solo el apartado de empleados, viajes, destinos, facturas, pagos, reservaciones y servicios en el navbar y que servicios tenga el apartado de el transporte y el servicio que tendra cada evento y que en el apartado principla sigan las graficas pero que en los apartado de abajo me muestre destinos, donde esta ubicado el porque es un lugar turistico y mas informacion y que en el apartado de las estadisticas en la parte de abajo donde esta la informacion de cada de los apartado que te de un texto que diga cuanto a disminuido o aumentado
11
+ Ahora que los destinos turisticos sean como un tipo tarjetas con una imagen
12
+ Ahora que los destinos turisticos sean como un tipo tarjetas con una imagen