Actualizar menu.html

This commit is contained in:
2026-02-22 22:03:52 +00:00
parent 5458e1b4ff
commit b0099777ea

View File

@@ -7,7 +7,14 @@
<script src="https://cdn.tailwindcss.com"></script>
<script src="https://unpkg.com/lucide@latest"></script>
<style>
body { background-color: #f4f7f9; -webkit-tap-highlight-color: transparent; }
/* VARIABLES CORPORATIVAS DINÁMICAS */
:root {
--primary: #2563eb;
--secondary: #f59e0b;
--app-bg: #f4f7f9;
}
body { background-color: var(--app-bg); -webkit-tap-highlight-color: transparent; }
.fade-in { animation: fadeIn 0.4s ease-out forwards; }
@keyframes fadeIn { from { opacity: 0; transform: translateY(15px); } to { opacity: 1; transform: translateY(0); } }
@@ -15,16 +22,20 @@
.main-content { padding-bottom: calc(env(safe-area-inset-bottom) + 30px); }
.app-card { box-shadow: 0 10px 25px -5px rgba(0, 0, 0, 0.05); }
/* Clases CSS dinámicas para aplicar las variables */
.bg-primary-dynamic { background-color: var(--primary) !important; }
.text-primary-dynamic { color: var(--primary) !important; }
</style>
</head>
<body class="text-slate-800 font-sans antialiased h-screen flex flex-col overflow-hidden relative">
<div class="absolute top-0 left-0 w-full h-48 bg-blue-600 rounded-b-[2.5rem] z-0"></div>
<div class="absolute top-0 left-0 w-full h-48 bg-primary-dynamic rounded-b-[2.5rem] z-0 transition-colors duration-500"></div>
<header class="px-6 pt-safe mt-8 pb-6 z-10 relative text-white shrink-0">
<div class="flex justify-between items-start mb-6">
<div>
<p class="text-[10px] font-black text-blue-200 uppercase tracking-widest mb-0.5" id="headerDate">HOY</p>
<p class="text-[10px] font-black text-white/70 uppercase tracking-widest mb-0.5" id="headerDate">HOY</p>
<h1 class="text-3xl font-black tracking-tight leading-none">Hola, <span id="opName"></span></h1>
</div>
@@ -80,7 +91,27 @@
? 'http://localhost:3000'
: 'https://integrarepara-api.integrarepara.es';
document.addEventListener("DOMContentLoaded", () => {
// --- SISTEMA DE TEMA DINÁMICO ---
async function applyTheme() {
try {
let theme = JSON.parse(localStorage.getItem('app_theme'));
const res = await fetch(`${API_URL}/config/company`, {
headers: { "Authorization": `Bearer ${localStorage.getItem("token")}` }
});
const data = await res.json();
if(data.ok && data.config && data.config.portal_settings && data.config.portal_settings.app_settings) {
theme = data.config.portal_settings.app_settings;
localStorage.setItem('app_theme', JSON.stringify(theme));
}
if(theme) {
document.documentElement.style.setProperty('--primary', theme.primary);
document.documentElement.style.setProperty('--secondary', theme.secondary);
document.documentElement.style.setProperty('--app-bg', theme.bg);
}
} catch (e) { console.warn("Usando tema por defecto"); }
}
document.addEventListener("DOMContentLoaded", async () => {
const token = localStorage.getItem("token");
const role = localStorage.getItem("role");
@@ -89,6 +120,9 @@
return;
}
// Aplicamos los colores corporativos de la empresa
await applyTheme();
lucide.createIcons();
const rawName = localStorage.getItem("userName") || "Operario";