Skip to content

Commit 58e0bad

Browse files
committed
UX: Botones 'Crear' y 'Probar' en cada widget + navegación directa a tabs del admin
1 parent 4c48458 commit 58e0bad

2 files changed

Lines changed: 47 additions & 29 deletions

File tree

admin.html

Lines changed: 12 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -624,6 +624,18 @@ <h3 class="text-sm font-semibold text-slate-900">Vista Previa</h3>
624624
generateTemporizadorURL();
625625
generateSemanaURL();
626626
generateSorteoURL();
627+
628+
// Abrir tab desde hash de URL
629+
const hash = window.location.hash.replace('#', '');
630+
const tabMapping = {
631+
'cuenta-regresiva': 'temporizador',
632+
'semanas': 'semana',
633+
'sorteo': 'sorteo'
634+
};
635+
636+
if (tabMapping[hash]) {
637+
switchTab(tabMapping[hash]);
638+
}
627639
});
628640

629641
// Cambiar tabs

index.html

Lines changed: 35 additions & 29 deletions
Original file line numberDiff line numberDiff line change
@@ -120,21 +120,23 @@ <h3 class="text-lg font-semibold text-slate-900">Cuenta Regresiva</h3>
120120
</div>
121121

122122
<!-- Actions -->
123-
<div class="flex gap-2">
124-
<a href="cuentaregresiva.html?title=Año Nuevo 2026&y=2026&m=1&d=1"
125-
target="_blank"
126-
class="flex-1 inline-flex items-center justify-center gap-2 px-4 py-2 bg-slate-900 text-white text-sm font-medium rounded-lg hover:bg-slate-800 transition">
123+
<div class="grid grid-cols-2 gap-2">
124+
<a href="admin.html#cuenta-regresiva"
125+
class="inline-flex items-center justify-center gap-2 px-4 py-2.5 bg-blue-600 text-white text-sm font-semibold rounded-lg hover:bg-blue-700 transition">
127126
<svg class="w-4 h-4" fill="none" stroke="currentColor" viewBox="0 0 24 24">
128-
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M10 6H6a2 2 0 00-2 2v10a2 2 0 002 2h10a2 2 0 002-2v-4M14 4h6m0 0v6m0-6L10 14"></path>
127+
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 4v16m8-8H4"></path>
129128
</svg>
130-
Abrir Demo
129+
Crear
131130
</a>
132-
<button onclick="copyToClipboard('cuentaregresiva.html')"
133-
class="px-4 py-2 border border-slate-300 text-slate-700 text-sm font-medium rounded-lg hover:bg-slate-50 transition">
131+
<a href="cuentaregresiva.html?title=Año Nuevo 2026&y=2026&m=1&d=1"
132+
target="_blank"
133+
class="inline-flex items-center justify-center gap-2 px-4 py-2.5 border-2 border-slate-300 text-slate-700 text-sm font-semibold rounded-lg hover:bg-slate-50 transition">
134134
<svg class="w-4 h-4" fill="none" stroke="currentColor" viewBox="0 0 24 24">
135-
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M8 16H6a2 2 0 01-2-2V6a2 2 0 012-2h8a2 2 0 012 2v2m-6 12h8a2 2 0 002-2v-8a2 2 0 00-2-2h-8a2 2 0 00-2 2v8a2 2 0 002 2z"></path>
135+
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M14.752 11.168l-3.197-2.132A1 1 0 0010 9.87v4.263a1 1 0 001.555.832l3.197-2.132a1 1 0 000-1.664z"></path>
136+
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M21 12a9 9 0 11-18 0 9 9 0 0118 0z"></path>
136137
</svg>
137-
</button>
138+
Probar
139+
</a>
138140
</div>
139141
</div>
140142

@@ -195,20 +197,22 @@ <h3 class="text-lg font-semibold text-slate-900">Calculador de Semanas</h3>
195197
</div>
196198

197199
<!-- Actions -->
198-
<div class="flex gap-2">
199-
<a href="#" onclick="openSemanaDemo(); return false;"
200-
class="flex-1 inline-flex items-center justify-center gap-2 px-4 py-2 bg-slate-900 text-white text-sm font-medium rounded-lg hover:bg-slate-800 transition">
200+
<div class="grid grid-cols-2 gap-2">
201+
<a href="admin.html#semanas"
202+
class="inline-flex items-center justify-center gap-2 px-4 py-2.5 bg-blue-600 text-white text-sm font-semibold rounded-lg hover:bg-blue-700 transition">
201203
<svg class="w-4 h-4" fill="none" stroke="currentColor" viewBox="0 0 24 24">
202-
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M10 6H6a2 2 0 00-2 2v10a2 2 0 002 2h10a2 2 0 002-2v-4M14 4h6m0 0v6m0-6L10 14"></path>
204+
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 4v16m8-8H4"></path>
203205
</svg>
204-
Abrir Demo
206+
Crear
205207
</a>
206-
<button onclick="copyToClipboard('semana.html')"
207-
class="px-4 py-2 border border-slate-300 text-slate-700 text-sm font-medium rounded-lg hover:bg-slate-50 transition">
208+
<a href="#" onclick="openSemanaDemo(); return false;"
209+
class="inline-flex items-center justify-center gap-2 px-4 py-2.5 border-2 border-slate-300 text-slate-700 text-sm font-semibold rounded-lg hover:bg-slate-50 transition">
208210
<svg class="w-4 h-4" fill="none" stroke="currentColor" viewBox="0 0 24 24">
209-
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M8 16H6a2 2 0 01-2-2V6a2 2 0 012-2h8a2 2 0 012 2v2m-6 12h8a2 2 0 002-2v-8a2 2 0 00-2-2h-8a2 2 0 00-2 2v8a2 2 0 002 2z"></path>
211+
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M14.752 11.168l-3.197-2.132A1 1 0 0010 9.87v4.263a1 1 0 001.555.832l3.197-2.132a1 1 0 000-1.664z"></path>
212+
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M21 12a9 9 0 11-18 0 9 9 0 0118 0z"></path>
210213
</svg>
211-
</button>
214+
Probar
215+
</a>
212216
</div>
213217
</div>
214218

@@ -269,21 +273,23 @@ <h3 class="text-lg font-semibold text-slate-900">Sorteo Interactivo</h3>
269273
</div>
270274

271275
<!-- Actions -->
272-
<div class="flex gap-2">
273-
<a href="sorteo.html?list=Benja,María,Tomás,Ana,Pedro&time=3&win=3"
274-
target="_blank"
275-
class="flex-1 inline-flex items-center justify-center gap-2 px-4 py-2 bg-slate-900 text-white text-sm font-medium rounded-lg hover:bg-slate-800 transition">
276+
<div class="grid grid-cols-2 gap-2">
277+
<a href="admin.html#sorteo"
278+
class="inline-flex items-center justify-center gap-2 px-4 py-2.5 bg-blue-600 text-white text-sm font-semibold rounded-lg hover:bg-blue-700 transition">
276279
<svg class="w-4 h-4" fill="none" stroke="currentColor" viewBox="0 0 24 24">
277-
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M10 6H6a2 2 0 00-2 2v10a2 2 0 002 2h10a2 2 0 002-2v-4M14 4h6m0 0v6m0-6L10 14"></path>
280+
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 4v16m8-8H4"></path>
278281
</svg>
279-
Abrir Demo
282+
Crear
280283
</a>
281-
<button onclick="copyToClipboard('sorteo.html')"
282-
class="px-4 py-2 border border-slate-300 text-slate-700 text-sm font-medium rounded-lg hover:bg-slate-50 transition">
284+
<a href="sorteo.html?list=Benja,María,Tomás,Ana,Pedro&time=3&win=3"
285+
target="_blank"
286+
class="inline-flex items-center justify-center gap-2 px-4 py-2.5 border-2 border-slate-300 text-slate-700 text-sm font-semibold rounded-lg hover:bg-slate-50 transition">
283287
<svg class="w-4 h-4" fill="none" stroke="currentColor" viewBox="0 0 24 24">
284-
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M8 16H6a2 2 0 01-2-2V6a2 2 0 012-2h8a2 2 0 012 2v2m-6 12h8a2 2 0 002-2v-8a2 2 0 00-2-2h-8a2 2 0 00-2 2v8a2 2 0 002 2z"></path>
288+
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M14.752 11.168l-3.197-2.132A1 1 0 0010 9.87v4.263a1 1 0 001.555.832l3.197-2.132a1 1 0 000-1.664z"></path>
289+
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M21 12a9 9 0 11-18 0 9 9 0 0118 0z"></path>
285290
</svg>
286-
</button>
291+
Probar
292+
</a>
287293
</div>
288294
</div>
289295

0 commit comments

Comments
 (0)