-
+
+
ID#123456789
-
StatusOpen
-
PriorityP1 Critical
-
AssigneeJDjdoe
-
Created2026-03-10
+
Created2026-03-10 09:14 UTC
-
Description
-
Storage array link-down on compute-storage-01. Affects prod write path. Investigate RAID controller firmware.
-
Activity
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
Add Comment
+
+
+
+
+
+
+
Activity
jdoe assigned ticket2h ago
@@ -161,8 +248,8 @@
@@ -293,14 +380,65 @@
@@ -1721,6 +1859,86 @@ Storage array link-down on `compute-storage-01`.
// Sidebar submenus (re-init for demo sidebar)
lt.sidebarSubmenus.init(document.querySelector('.lt-section-body'));
+ // ----- Notification bell dropdown -----
+ (function() {
+ const btn = document.getElementById('lt-notif-bell-btn');
+ const panel = document.getElementById('lt-notif-panel');
+ if (!btn || !panel) return;
+
+ function open() {
+ panel.setAttribute('aria-hidden', 'false');
+ btn.setAttribute('aria-expanded', 'true');
+ // Mark all as read visually
+ }
+ function close() {
+ panel.setAttribute('aria-hidden', 'true');
+ btn.setAttribute('aria-expanded', 'false');
+ }
+
+ btn.addEventListener('click', e => {
+ e.stopPropagation();
+ panel.getAttribute('aria-hidden') === 'false' ? close() : open();
+ });
+
+ // "Mark all read" button
+ const clearBtn = document.getElementById('lt-notif-clear-all');
+ if (clearBtn) clearBtn.addEventListener('click', () => {
+ panel.querySelectorAll('.lt-notif-item--unread').forEach(el => el.classList.remove('lt-notif-item--unread'));
+ panel.querySelectorAll('.lt-notif-dot').forEach(el => { el.classList.remove('lt-notif-dot'); el.classList.add('lt-notif-dot', 'lt-notif-dot--read'); });
+ lt.notif.clear('#lt-notif-bell');
+ lt.toast.info('All notifications marked as read');
+ });
+
+ // Individual item click
+ panel.querySelectorAll('.lt-notif-item').forEach(item => {
+ item.addEventListener('click', () => {
+ item.classList.remove('lt-notif-item--unread');
+ const dot = item.querySelector('.lt-notif-dot');
+ if (dot) { dot.classList.add('lt-notif-dot--read'); }
+ close();
+ });
+ });
+
+ // Close on outside click
+ document.addEventListener('click', e => {
+ if (!document.getElementById('lt-notif-bell').contains(e.target)) close();
+ });
+
+ // Esc close
+ document.addEventListener('keydown', e => { if (e.key === 'Escape') close(); });
+ }());
+
+ // ----- Generic dropdown toggle (Advanced filter + Bulk Actions) -----
+ document.querySelectorAll('.lt-dropdown-trigger').forEach(btn => {
+ const wrap = btn.closest('.lt-dropdown-wrap');
+ const panel = wrap && wrap.querySelector('.lt-dropdown-panel');
+ if (!panel) return;
+
+ btn.addEventListener('click', e => {
+ e.stopPropagation();
+ const isOpen = panel.getAttribute('aria-hidden') === 'false';
+ // Close all other dropdowns first
+ document.querySelectorAll('.lt-dropdown-panel[aria-hidden="false"]').forEach(p => {
+ p.setAttribute('aria-hidden', 'true');
+ const t = p.closest('.lt-dropdown-wrap').querySelector('.lt-dropdown-trigger');
+ if (t) t.setAttribute('aria-expanded', 'false');
+ });
+ if (!isOpen) {
+ panel.setAttribute('aria-hidden', 'false');
+ btn.setAttribute('aria-expanded', 'true');
+ }
+ });
+ });
+
+ // Close dropdowns on outside click / Esc
+ document.addEventListener('click', () => {
+ document.querySelectorAll('.lt-dropdown-panel[aria-hidden="false"]').forEach(p => {
+ p.setAttribute('aria-hidden', 'true');
+ const t = p.closest('.lt-dropdown-wrap').querySelector('.lt-dropdown-trigger');
+ if (t) t.setAttribute('aria-expanded', 'false');
+ });
+ });
+
// Tab bar switching
document.querySelectorAll('.lt-tab-bar').forEach(bar => {
bar.addEventListener('click', e => {
diff --git a/base.js b/base.js
index 77006fd..69342d7 100644
--- a/base.js
+++ b/base.js
@@ -105,9 +105,14 @@
closeEl.setAttribute('aria-label', 'Dismiss');
closeEl.addEventListener('click', () => _dismissToast(toast));
+ const progressEl = document.createElement('div');
+ progressEl.className = 'lt-toast-progress';
+ progressEl.style.animationDuration = duration + 'ms';
+
toast.appendChild(iconEl);
toast.appendChild(msgEl);
toast.appendChild(closeEl);
+ toast.appendChild(progressEl);
container.appendChild(toast);
const timer = setTimeout(() => _dismissToast(toast), duration);
@@ -2027,32 +2032,6 @@
},
};
- /* ================================================================
- MODULE 47 — TOAST ENHANCEMENTS
- Adds a drain progress bar to each toast.
- The original showToast already handles queuing (section 2).
- ================================================================ */
- // Patch showToast to inject a progress bar after each toast is created
- const _origShowToast = showToast;
- function showToast(message, type, duration) {
- duration = duration || 4000;
- const result = _origShowToast(message, type, duration);
- // Inject drain bar into the most recently added toast
- requestAnimationFrame(() => {
- const container = document.getElementById('lt-toast-container');
- if (!container) return;
- const toasts = container.querySelectorAll('.lt-toast');
- const last = toasts[toasts.length - 1];
- if (last && !last.querySelector('.lt-toast-progress')) {
- const bar = document.createElement('div');
- bar.className = 'lt-toast-progress';
- bar.style.animationDuration = duration + 'ms';
- last.appendChild(bar);
- }
- });
- return result;
- }
-
/* ================================================================
MODULE 48 — SIDEBAR SUBMENUS
Auto-inits .lt-sidebar-group elements.