revert notifications position
This commit is contained in:
parent
bae6c16a6b
commit
12f3e16b18
|
|
@ -634,90 +634,6 @@ input.list-header-checkbox:checked::after {
|
|||
background-position: center;
|
||||
}
|
||||
|
||||
/* ==========================================================================
|
||||
Notification Bell — Top-right position
|
||||
========================================================================== */
|
||||
|
||||
/* Hide original notification button in sidebar */
|
||||
.sidebar-notification {
|
||||
display: none !important;
|
||||
}
|
||||
|
||||
/* Fixed wrapper */
|
||||
.jey-topright-wrapper {
|
||||
position: fixed;
|
||||
top: 16px;
|
||||
right: 24px;
|
||||
z-index: 1039;
|
||||
}
|
||||
|
||||
/* Bell button */
|
||||
.jey-topright-bell {
|
||||
position: relative;
|
||||
width: 36px;
|
||||
height: 36px;
|
||||
border-radius: 50%;
|
||||
background: var(--card-bg, #fff);
|
||||
border: 1px solid var(--border-color, #e2e2e2);
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
cursor: pointer;
|
||||
box-shadow: 0 1px 4px rgba(0,0,0,0.08);
|
||||
transition: box-shadow 0.2s, background 0.2s;
|
||||
color: var(--text-muted, #74808b);
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
.jey-topright-bell:hover {
|
||||
background: var(--subtle-fg, #f5f5f5);
|
||||
box-shadow: 0 2px 8px rgba(0,0,0,0.12);
|
||||
color: var(--text-color, #333);
|
||||
}
|
||||
|
||||
/* Unread count badge */
|
||||
.jey-notif-badge {
|
||||
position: absolute;
|
||||
top: -4px;
|
||||
right: -4px;
|
||||
background: var(--red-500, #e53e3e);
|
||||
color: #fff;
|
||||
font-size: 10px;
|
||||
font-weight: 600;
|
||||
min-width: 16px;
|
||||
height: 16px;
|
||||
line-height: 16px;
|
||||
border-radius: 8px;
|
||||
text-align: center;
|
||||
padding: 0 4px;
|
||||
pointer-events: none;
|
||||
}
|
||||
|
||||
/* Notification dropdown panel */
|
||||
.jey-topright-wrapper .dropdown-notifications {
|
||||
display: block;
|
||||
position: absolute;
|
||||
top: 44px;
|
||||
right: 0;
|
||||
width: 360px;
|
||||
border-radius: 12px;
|
||||
box-shadow: 0 8px 24px rgba(0,0,0,0.12), 0 2px 6px rgba(0,0,0,0.04);
|
||||
background: var(--card-bg, #fff);
|
||||
border: 1px solid var(--border-color, #e2e2e2);
|
||||
max-height: 70vh;
|
||||
overflow-y: auto;
|
||||
}
|
||||
|
||||
.jey-topright-wrapper .dropdown-notifications.hidden {
|
||||
display: none !important;
|
||||
}
|
||||
|
||||
@media (max-width: 400px) {
|
||||
.jey-topright-wrapper .dropdown-notifications {
|
||||
width: calc(100vw - 32px);
|
||||
}
|
||||
}
|
||||
|
||||
/* ==========================================================================
|
||||
Hide "Getting Started" onboarding panels
|
||||
========================================================================== */
|
||||
|
|
|
|||
|
|
@ -777,106 +777,6 @@
|
|||
$(document).on("page-change", addReloadButton);
|
||||
})();
|
||||
|
||||
/* ==========================================================================
|
||||
Notification Bell — Move to top-right corner
|
||||
========================================================================== */
|
||||
|
||||
(function () {
|
||||
"use strict";
|
||||
|
||||
function moveNotifications() {
|
||||
var dropdown = document.querySelector(".standard-items-sections .dropdown-notifications, .body-sidebar .dropdown-notifications:not(.jey-moved)");
|
||||
var wrapper = document.querySelector(".jey-topright-wrapper");
|
||||
|
||||
// A new dropdown appeared after page rebuild — move it into existing wrapper
|
||||
if (dropdown && wrapper) {
|
||||
dropdown.classList.add("jey-moved", "hidden");
|
||||
dropdown.parentNode.removeChild(dropdown);
|
||||
var old = wrapper.querySelector(".dropdown-notifications");
|
||||
if (old) old.remove();
|
||||
wrapper.appendChild(dropdown);
|
||||
return;
|
||||
}
|
||||
|
||||
if (wrapper) return; // already set up
|
||||
if (!dropdown) return; // nothing to move yet
|
||||
|
||||
// --- First-time setup ---
|
||||
wrapper = document.createElement("div");
|
||||
wrapper.className = "jey-topright-wrapper";
|
||||
|
||||
var bell = document.createElement("button");
|
||||
bell.className = "jey-topright-bell btn-reset";
|
||||
bell.setAttribute("title", __("Notifications"));
|
||||
bell.innerHTML =
|
||||
'<svg xmlns="http://www.w3.org/2000/svg" width="18" height="18" viewBox="0 0 24 24" ' +
|
||||
'fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">' +
|
||||
'<path d="M18 8A6 6 0 0 0 6 8c0 7-3 9-3 9h18s-3-2-3-9"/>' +
|
||||
'<path d="M13.73 21a2 2 0 0 1-3.46 0"/>' +
|
||||
'</svg>';
|
||||
wrapper.appendChild(bell);
|
||||
|
||||
dropdown.classList.add("jey-moved", "hidden");
|
||||
dropdown.parentNode.removeChild(dropdown);
|
||||
wrapper.appendChild(dropdown);
|
||||
|
||||
document.body.appendChild(wrapper);
|
||||
|
||||
function updateBadge() {
|
||||
var dd = wrapper.querySelector(".dropdown-notifications");
|
||||
if (!dd) return;
|
||||
var unread = dd.querySelectorAll(".notification-item.unread").length;
|
||||
var badge = bell.querySelector(".jey-notif-badge");
|
||||
if (unread > 0) {
|
||||
if (!badge) {
|
||||
badge = document.createElement("span");
|
||||
badge.className = "jey-notif-badge";
|
||||
bell.appendChild(badge);
|
||||
}
|
||||
badge.textContent = unread > 9 ? "9+" : unread;
|
||||
} else if (badge) {
|
||||
badge.remove();
|
||||
}
|
||||
}
|
||||
|
||||
bell.addEventListener("click", function (e) {
|
||||
e.preventDefault();
|
||||
e.stopPropagation();
|
||||
var dd = wrapper.querySelector(".dropdown-notifications");
|
||||
if (dd) dd.classList.toggle("hidden");
|
||||
updateBadge();
|
||||
});
|
||||
|
||||
document.addEventListener("click", function (e) {
|
||||
if (!wrapper.contains(e.target)) {
|
||||
var dd = wrapper.querySelector(".dropdown-notifications");
|
||||
if (dd) dd.classList.add("hidden");
|
||||
}
|
||||
});
|
||||
|
||||
wrapper.addEventListener("click", function (e) {
|
||||
if (e.target.closest(".close-notification-dialogue")) {
|
||||
var dd = wrapper.querySelector(".dropdown-notifications");
|
||||
if (dd) dd.classList.add("hidden");
|
||||
}
|
||||
});
|
||||
|
||||
updateBadge();
|
||||
var obs = new MutationObserver(updateBadge);
|
||||
obs.observe(dropdown, { childList: true, subtree: true, attributes: true, attributeFilter: ["class"] });
|
||||
}
|
||||
|
||||
$(document).ready(function () {
|
||||
moveNotifications();
|
||||
var tries = 0;
|
||||
var poll = setInterval(function () {
|
||||
moveNotifications();
|
||||
if (++tries > 30) clearInterval(poll);
|
||||
}, 300);
|
||||
});
|
||||
$(document).on("page-change", moveNotifications);
|
||||
})();
|
||||
|
||||
/* ==========================================================================
|
||||
Fix: nested menus left orphaned when parent menu is toggled closed
|
||||
(sidebar-header app-switcher → Workspaces submenu stays on screen)
|
||||
|
|
|
|||
Loading…
Reference in New Issue