Lago/mc_cars_gmbh_infraestructure
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: replace toast notifications with a customizable popup for admin messages

Browse Source
This commit is contained in:
Jose Lago
2026-05-17 22:41:44 +02:00
parent 3ec79e1923
commit 387d2ba2ab
1 changed files with 37 additions and 14 deletions
Download Patch File Download Diff File Expand all files Collapse all files
frontend/admin.js
+37 -14
View File
@@ -75,24 +75,47 @@ function notify(message, duration = 3000) {
window.showToast(message, duration); window.showToast(message, duration);
return; return;
} }
showAdminToast(message, duration); showAdminPopup(message, duration);
} }
function showAdminToast(message, duration = 3000) { function showAdminPopup(message, duration = 3000) {
let toast = document.querySelector("#toast"); const host = document.querySelector("dialog[open]") || document.body;
if (!toast) { let popup = host.querySelector("[data-admin-notify-popup]");
toast = document.createElement("div"); if (!popup) {
toast.id = "toast"; popup = document.createElement("div");
toast.className = "toast"; popup.setAttribute("data-admin-notify-popup", "1");
toast.setAttribute("role", "status"); popup.setAttribute("role", "status");
toast.setAttribute("aria-live", "polite"); popup.setAttribute("aria-live", "polite");
document.body.appendChild(toast); popup.style.position = host.tagName === "DIALOG" ? "absolute" : "fixed";
popup.style.left = "50%";
popup.style.top = "50%";
popup.style.transform = "translate(-50%, -50%) scale(0.96)";
popup.style.minWidth = "320px";
popup.style.maxWidth = "min(92vw, 560px)";
popup.style.padding = "1rem 1.2rem";
popup.style.borderRadius = "12px";
popup.style.border = "1px solid var(--line)";
popup.style.background = "var(--bg-card)";
popup.style.color = "var(--text)";
popup.style.boxShadow = "0 16px 40px rgba(0,0,0,0.35)";
popup.style.textAlign = "center";
popup.style.fontSize = "1rem";
popup.style.fontWeight = "600";
popup.style.opacity = "0";
popup.style.zIndex = "3000";
popup.style.pointerEvents = "none";
popup.style.transition = "opacity 0.18s ease, transform 0.18s ease";
host.appendChild(popup);
} }
toast.textContent = message; popup.textContent = message;
toast.classList.add("show"); popup.style.opacity = "1";
setTimeout(() => { popup.style.transform = "translate(-50%, -50%) scale(1)";
toast.classList.remove("show");
clearTimeout(popup._hideTimer);
popup._hideTimer = setTimeout(() => {
popup.style.opacity = "0";
popup.style.transform = "translate(-50%, -50%) scale(0.96)";
}, duration); }, duration);
} }