05/24 Fix UI/UX

static/js/app.js

@@ -214,6 +214,52 @@ function getCsrfToken() {
   });
 }());
 
+/* ── Mobile sidebar toggle ─────────────────────────────────── */
+(function() {
+  var toggle   = document.getElementById('sidebar-toggle');
+  var backdrop = document.getElementById('sidebar-backdrop');
+  var sidebar  = document.getElementById('sidebar');
+  if (!toggle || !sidebar) return;
+
+  function openSidebar() {
+    sidebar.classList.add('open');
+    backdrop.classList.add('open');
+    document.body.style.overflow = 'hidden';
+  }
+  function closeSidebar() {
+    sidebar.classList.remove('open');
+    backdrop.classList.remove('open');
+    document.body.style.overflow = '';
+  }
+
+  toggle.addEventListener('click', openSidebar);
+  backdrop.addEventListener('click', closeSidebar);
+  sidebar.querySelectorAll('.nav-item').forEach(function(link) {
+    link.addEventListener('click', closeSidebar);
+  });
+}());
+
+/* ── Relative timestamps ───────────────────────────────────── */
+function timeAgo(dateStr) {
+  if (!dateStr) return '—';
+  var d    = new Date(dateStr.replace(' ', 'T'));
+  var diff = Math.round((Date.now() - d.getTime()) / 1000);
+  if (diff < 60)     return 'just now';
+  if (diff < 3600)   return Math.floor(diff / 60) + ' min ago';
+  if (diff < 86400)  return Math.floor(diff / 3600) + ' hr ago';
+  if (diff < 604800) return Math.floor(diff / 86400) + ' days ago';
+  return d.toLocaleDateString();
+}
+
+document.addEventListener('DOMContentLoaded', function() {
+  document.querySelectorAll('[data-ts]').forEach(function(el) {
+    var iso = el.dataset.ts;
+    if (!iso) return;
+    el.title = el.textContent.trim();
+    el.textContent = timeAgo(iso);
+  });
+});
+
 /* ── Generic fetch-based form submit (JSON response) ───────── */
 async function submitJson(url, data, method = 'POST') {
   const res = await fetch(url, {