101 lines
4.1 KiB
HTML
101 lines
4.1 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="es">
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
<title>{TITLE} - Comparador de Precios</title>
|
|
<link rel="icon" type="image/x-icon" href="../favicon.ico">
|
|
<link rel="stylesheet" href="../assets/css/tailwind.css">
|
|
</head>
|
|
<body class="bg-gray-50">
|
|
<!-- Navbar -->
|
|
<nav class="bg-indigo-600 shadow-lg" id="navbar">
|
|
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
|
|
<div class="flex justify-between h-16">
|
|
<div class="flex items-center">
|
|
<a href="../index.html" class="text-white text-xl font-bold flex items-center space-x-2">
|
|
<span>💰</span>
|
|
<span>Comparador de Precios</span>
|
|
</a>
|
|
</div>
|
|
<div class="flex items-center space-x-4">
|
|
<a href="./brasil.html" class="nav-link text-white hover:bg-indigo-700 px-4 py-2 rounded-lg font-medium transition" data-country="brasil">
|
|
🇧🇷 Brasil
|
|
</a>
|
|
<a href="./chile.html" class="nav-link text-white hover:bg-indigo-700 px-4 py-2 rounded-lg font-medium transition" data-country="chile">
|
|
🇨🇱 Chile
|
|
</a>
|
|
<button id="logoutBtn" class="text-white hover:bg-red-600 bg-red-500 px-4 py-2 rounded-lg font-medium transition">
|
|
Salir
|
|
</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</nav>
|
|
|
|
<!-- Header Section -->
|
|
<div class="bg-white shadow-sm border-b" id="page-header">
|
|
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 py-6">
|
|
<div class="flex items-center justify-between">
|
|
<div class="flex items-center space-x-4">
|
|
<div class="text-4xl" id="country-flag">{FLAG}</div>
|
|
<div>
|
|
<h1 class="text-3xl font-bold text-gray-800" id="page-title">{TITLE}</h1>
|
|
<p class="text-gray-600 mt-1">Bienvenido, <span id="nombreUsuario" class="font-semibold">{USER}</span></p>
|
|
</div>
|
|
</div>
|
|
<div class="flex items-center space-x-2">
|
|
<span class="text-sm text-gray-500">Última actualización:</span>
|
|
<span id="lastUpdate" class="text-sm font-medium text-gray-700">-</span>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Main Content -->
|
|
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 py-8">
|
|
<!-- Loading Spinner -->
|
|
<div id="loadingSpinner" class="loading-spinner flex items-center justify-center py-12">
|
|
<div class="animate-spin rounded-full h-12 w-12 border-b-2 border-indigo-600"></div>
|
|
</div>
|
|
|
|
<!-- Page Content -->
|
|
<div id="pageContent" class="hidden">
|
|
<!-- Aquí se insertará el contenido específico de cada página -->
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Footer -->
|
|
<footer class="bg-gray-100 border-t mt-16">
|
|
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 py-6">
|
|
<div class="flex items-center justify-between text-sm text-gray-600">
|
|
<div class="flex items-center space-x-4">
|
|
<span>© 2025 Comparador de Precios</span>
|
|
<span>•</span>
|
|
<span>Desarrollado con ❤️</span>
|
|
</div>
|
|
<div class="flex items-center space-x-4">
|
|
<span id="version">v2.0.0</span>
|
|
<span>•</span>
|
|
<span id="currentTime">-</span>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</footer>
|
|
|
|
<!-- Scripts -->
|
|
<script src="../assets/js/auth.js"></script>
|
|
<script src="../assets/js/layout.js"></script>
|
|
<script src="../assets/js/app.js"></script>
|
|
<script>
|
|
// Configurar layout para la página actual
|
|
LayoutManager.init({
|
|
title: '{TITLE}',
|
|
flag: '{FLAG}',
|
|
country: '{COUNTRY}',
|
|
user: '{USER}'
|
|
});
|
|
</script>
|
|
</body>
|
|
</html>
|