diff --git a/website_sale_aplicoop/static/src/css/components/alerts.css b/website_sale_aplicoop/static/src/css/components/alerts.css index 574bac4..bb11925 100644 --- a/website_sale_aplicoop/static/src/css/components/alerts.css +++ b/website_sale_aplicoop/static/src/css/components/alerts.css @@ -77,36 +77,22 @@ /* ---------- Floating notification (_showNotification) ---------- */ -/* Was a 200-character inline style written from JS on every call. - * - * The `.alert` qualifier is load-bearing, not decoration. This addon's - * partials reach the page through @import, which the CSS spec hoists above - * every other rule in the bundle — so an equal-specificity Bootstrap rule - * always comes later and wins. `.alert` (0,1,0) therefore beat a bare - * `.eskaera-notification` (0,1,0) on `position`, pinning the toast to - * `relative` and leaving it in normal flow at the foot of , below the - * footer: every error and confirmation rendered off-screen. `.alert - * .eskaera-notification` (0,2,0) settles it without !important. - * - * `.fade` does the same to `transition`, and `.alert` to `padding` — which - * rides on Bootstrap's own custom properties here, as .badge-km and - * .product-card > .card already do. */ -.alert.eskaera-notification { - --alert-padding-x: var(--ac-space-lg); - --alert-padding-y: var(--ac-space-lg); +/* Was a 200-character inline style written from JS on every call. */ +.eskaera-notification { position: fixed; top: 5rem; right: var(--ac-space-md); z-index: var(--ac-z-notification); min-width: 18.75rem; max-width: 31.25rem; + padding: var(--ac-space-lg); font-size: var(--ac-text-md); box-shadow: var(--ac-shadow-lg); transition: opacity var(--ac-transition-normal); } @media (max-width: 576px) { - .alert.eskaera-notification { + .eskaera-notification { left: var(--ac-space-md); right: var(--ac-space-md); min-width: 0; @@ -115,7 +101,7 @@ @media (prefers-reduced-motion: reduce) { .toast-notification, - .alert.eskaera-notification { + .eskaera-notification { transition: none; } diff --git a/website_sale_aplicoop/static/src/js/infinite_scroll.js b/website_sale_aplicoop/static/src/js/infinite_scroll.js index e328b97..61735fc 100644 --- a/website_sale_aplicoop/static/src/js/infinite_scroll.js +++ b/website_sale_aplicoop/static/src/js/infinite_scroll.js @@ -132,10 +132,9 @@ console.log("[INFINITE_SCROLL] Script loaded!"); console.log("[INFINITE_SCROLL] eskaera-config element:", configEl); if (!configEl) { - // Expected on every eskaera page that has no product grid - // (orders list, checkout, ...): this script is loaded - // site-wide, not just on the shop page. - console.log("[INFINITE_SCROLL] No eskaera-config found, lazy loading disabled"); + console.error( + "[INFINITE_SCROLL] ❌ No eskaera-config found, lazy loading disabled" + ); return; } diff --git a/website_sale_aplicoop/static/src/js/website_sale.js b/website_sale_aplicoop/static/src/js/website_sale.js index 9978fc3..10eb073 100644 --- a/website_sale_aplicoop/static/src/js/website_sale.js +++ b/website_sale_aplicoop/static/src/js/website_sale.js @@ -738,13 +738,8 @@ "alert alert-" + type + " alert-dismissible fade show eskaera-notification"; // Announce it: errors and warnings are the whole point of this helper, // and without a live role a screen reader never hears them. - // The test was `type === "error"`, which no caller ever passes — the - // class has to name a Bootstrap variant, so failures come through as - // "danger". Every error was therefore announced politely, i.e. queued - // behind whatever the screen reader was already saying. - var isUrgent = type === "danger" || type === "warning"; - notification.setAttribute("role", isUrgent ? "alert" : "status"); - notification.setAttribute("aria-live", isUrgent ? "assertive" : "polite"); + notification.setAttribute("role", type === "error" ? "alert" : "status"); + notification.setAttribute("aria-live", type === "error" ? "assertive" : "polite"); notification.innerHTML = message + '