Actualizar calendario.html

This commit is contained in:
2026-02-16 19:19:14 +00:00
parent 0e98728fe4
commit d4d3e47dcd

View File

@@ -52,6 +52,35 @@
.fc-today-button { background-color: #0f172a !important; color: white !important; } .fc-today-button { background-color: #0f172a !important; color: white !important; }
.fc-timegrid-col.fc-day-today { background-color: #f8fafc !important; } .fc-timegrid-col.fc-day-today { background-color: #f8fafc !important; }
/* ESTILO PARA EL POPOVER (La ventanita gris pequeña al pulsar "+X más") */
.fc-popover {
border: none !important;
border-radius: 1rem !important;
box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 8px 10px -6px rgba(0, 0, 0, 0.1) !important;
overflow: hidden;
}
.fc-popover-header {
background-color: #3b82f6 !important; /* Azul corporativo */
color: white !important;
font-weight: 900 !important;
text-transform: uppercase;
padding: 0.75rem 1rem !important;
font-size: 0.8rem !important;
letter-spacing: 0.05em;
}
.fc-popover-body {
padding: 0.75rem !important;
background-color: #f8fafc !important; /* Fondo gris muy claro */
}
.fc-popover-close-icon {
color: white !important;
opacity: 0.7;
}
.fc-popover-close-icon:hover { opacity: 1; }
</style> </style>
</head> </head>
<body class="bg-gray-50 text-gray-800 font-sans antialiased overflow-hidden text-left"> <body class="bg-gray-50 text-gray-800 font-sans antialiased overflow-hidden text-left">
@@ -258,7 +287,7 @@
}, },
events: calendarEvents, events: calendarEvents,
// Diseño HTML interno de cada cajita del calendario // Diseño HTML interno de cada cajita del calendario (VERSIÓN COMPACTA)
eventContent: function(arg) { eventContent: function(arg) {
const timeText = arg.timeText; const timeText = arg.timeText;
const title = arg.event.title; const title = arg.event.title;
@@ -266,12 +295,12 @@
return { return {
html: ` html: `
<div class="flex flex-col h-full justify-start p-1.5 text-white overflow-hidden"> <div class="flex flex-col h-full justify-start p-1 text-white overflow-hidden font-sans">
<div class="flex justify-between items-start mb-1"> <div class="flex justify-between items-center mb-0.5">
<span class="text-[10px] font-black bg-white/20 px-1.5 rounded-md leading-tight">${timeText}</span> <span class="text-[9px] font-black bg-black/10 px-1.5 py-0.5 rounded-md leading-none whitespace-nowrap">${timeText}</span>
<p class="text-[9px] font-bold opacity-90 truncate ml-1"><i data-lucide="user" class="w-2.5 h-2.5 inline mr-0.5"></i>${op}</p>
</div> </div>
<p class="text-xs font-black leading-tight tracking-tight mb-1 truncate">${title}</p> <p class="text-[10px] font-black leading-tight tracking-tight truncate">${title}</p>
<p class="text-[9px] font-bold opacity-90 truncate"><i data-lucide="user" class="w-2.5 h-2.5 inline mr-0.5"></i>${op}</p>
</div>` </div>`
}; };
}, },