fixed sidebar newsletter

public/newsletter.php

@@ -61,23 +61,105 @@ $statusLabel = [
     <script src="https://cdn.jsdelivr.net/npm/sweetalert2@11"></script>
 
     <style>
-        .admin-card { border: none; border-radius: 14px; box-shadow: 0 4px 20px rgba(0, 0, 0, 0.06); }
+        .admin-card {
-        .admin-card .card-body { padding: 26px 30px; }
+            border: none;
-        .section-title { font-size: 15px; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; color: #6b7280; margin-bottom: 4px; }
+            border-radius: 14px;
-        .section-lead { color: #9ca3af; font-size: 14px; margin-bottom: 22px; }
+            box-shadow: 0 4px 20px rgba(0, 0, 0, 0.06);
-        .nl-table thead th { font-size: 12px; text-transform: uppercase; letter-spacing: .03em; color: #6b7280; }
+        }
-        .nl-table td { vertical-align: middle; }
+
-        .nl-title { font-weight: 600; color: #1f2937; }
+        .admin-card .card-body {
-        .nl-subject { display: block; font-size: 13px; color: #6b7280; }
+            padding: 26px 30px;
-        .st { display: inline-block; border-radius: 20px; padding: 3px 10px; font-size: 12px; font-weight: 600; white-space: nowrap; }
+        }
-        .st-none { background: #eef0f3; color: #4b5563; }
+
-        .st-new { background: #c4e1fb; color: #1a4f7a; }
+        .section-title {
-        .st-sending { background: #fbe4c4; color: #8a5a1a; }
+            font-size: 15px;
-        .st-sent { background: #cdfbc4; color: #1a7f2e; }
+            font-weight: 700;
-        .st-error { background: #fbc7c4; color: #a12820; }
+            letter-spacing: .04em;
-        .wp-list { max-height: 380px; overflow-y: auto; text-align: left; }
+            text-transform: uppercase;
-        .wp-item { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 9px 4px; border-bottom: 1px solid #f1f2f4; }
+            color: #6b7280;
-        .wp-item small { color: #9ca3af; }
+            margin-bottom: 4px;
+        }
+
+        .section-lead {
+            color: #9ca3af;
+            font-size: 14px;
+            margin-bottom: 22px;
+        }
+
+        .nl-table thead th {
+            font-size: 12px;
+            text-transform: uppercase;
+            letter-spacing: .03em;
+            color: #6b7280;
+        }
+
+        .nl-table td {
+            vertical-align: middle;
+        }
+
+        .nl-title {
+            font-weight: 600;
+            color: #1f2937;
+        }
+
+        .nl-subject {
+            display: block;
+            font-size: 13px;
+            color: #6b7280;
+        }
+
+        .st {
+            display: inline-block;
+            border-radius: 20px;
+            padding: 3px 10px;
+            font-size: 12px;
+            font-weight: 600;
+            white-space: nowrap;
+        }
+
+        .st-none {
+            background: #eef0f3;
+            color: #4b5563;
+        }
+
+        .st-new {
+            background: #c4e1fb;
+            color: #1a4f7a;
+        }
+
+        .st-sending {
+            background: #fbe4c4;
+            color: #8a5a1a;
+        }
+
+        .st-sent {
+            background: #cdfbc4;
+            color: #1a7f2e;
+        }
+
+        .st-error {
+            background: #fbc7c4;
+            color: #a12820;
+        }
+
+        .wp-list {
+            max-height: 380px;
+            overflow-y: auto;
+            text-align: left;
+        }
+
+        .wp-item {
+            display: flex;
+            align-items: center;
+            justify-content: space-between;
+            gap: 10px;
+            padding: 9px 4px;
+            border-bottom: 1px solid #f1f2f4;
+        }
+
+        .wp-item small {
+            color: #9ca3af;
+        }
     </style>
 </head>
 
@@ -101,6 +183,16 @@ $statusLabel = [
             </div>
         </header>
         <?php include('include/sidebar.php'); ?>
+        <header class="ishorizontal-topbar">
+            <div class="navbar-header">
+                <div class="d-flex"></div>
+            </div>
+            <div class="topnav">
+                <div class="container-fluid">
+                    <nav class="navbar navbar-light navbar-expand-lg topnav-menu"></nav>
+                </div>
+            </div>
+        </header>
 
         <div class="main-content">
             <div class="page-content">
@@ -136,7 +228,9 @@ $statusLabel = [
                                     </thead>
                                     <tbody>
                                         <?php if (!$drafts) : ?>
-                                            <tr><td colspan="4" class="text-center text-muted py-4">Nessuna newsletter. Creane una nuova o importane una da The Newsletter.</td></tr>
+                                            <tr>
+                                                <td colspan="4" class="text-center text-muted py-4">Nessuna newsletter. Creane una nuova o importane una da The Newsletter.</td>
+                                            </tr>
                                         <?php endif; ?>
                                         <?php foreach ($drafts as $d) :
                                             $wpId = $d['wp_email_id'] !== null ? (int) $d['wp_email_id'] : null;
@@ -189,15 +283,27 @@ $statusLabel = [
             const body = new FormData();
             body.append('action', action);
             Object.entries(data || {}).forEach(([k, v]) => body.append(k, v));
-            const r = await fetch(API, { method: 'POST', body, credentials: 'same-origin' });
+            const r = await fetch(API, {
+                method: 'POST',
+                body,
+                credentials: 'same-origin'
+            });
             let j = null;
-            try { j = await r.json(); } catch (e) { }
+            try {
+                j = await r.json();
+            } catch (e) {}
             if (!j || !j.success) throw new Error((j && j.message) || 'Errore del server.');
             return j;
         }
 
         function esc(s) {
-            return String(s ?? '').replace(/[&<>"']/g, c => ({ '&': '&amp;', '<': '&lt;', '>': '&gt;', '"': '&quot;', "'": '&#39;' }[c]));
+            return String(s ?? '').replace(/[&<>"']/g, c => ({
+                '&': '&amp;',
+                '<': '&lt;',
+                '>': '&gt;',
+                '"': '&quot;',
+                "'": '&#39;'
+            } [c]));
         }
 
         document.getElementById('btnNew').addEventListener('click', async () => {
@@ -212,16 +318,24 @@ $statusLabel = [
             });
             if (!r.isConfirmed) return;
             try {
-                const j = await api('create', { title: r.value });
+                const j = await api('create', {
+                    title: r.value
+                });
                 location.href = 'newsletter_editor.php?id=' + j.id;
-            } catch (e) { Swal.fire('Errore', e.message, 'error'); }
+            } catch (e) {
+                Swal.fire('Errore', e.message, 'error');
+            }
         });
 
         document.querySelectorAll('.js-dup').forEach(b => b.addEventListener('click', async () => {
             try {
-                const j = await api('duplicate', { id: b.dataset.id });
+                const j = await api('duplicate', {
+                    id: b.dataset.id
+                });
                 location.href = 'newsletter_editor.php?id=' + j.id;
-            } catch (e) { Swal.fire('Errore', e.message, 'error'); }
+            } catch (e) {
+                Swal.fire('Errore', e.message, 'error');
+            }
         }));
 
         document.querySelectorAll('.js-del').forEach(b => b.addEventListener('click', async () => {
@@ -235,25 +349,45 @@ $statusLabel = [
                 cancelButtonText: 'Annulla'
             });
             if (!r.isConfirmed) return;
-            try { await api('delete', { id: b.dataset.id }); location.reload(); } catch (e) { Swal.fire('Errore', e.message, 'error'); }
+            try {
+                await api('delete', {
+                    id: b.dataset.id
+                });
+                location.reload();
+            } catch (e) {
+                Swal.fire('Errore', e.message, 'error');
+            }
         }));
 
         document.getElementById('btnImport').addEventListener('click', async () => {
-            Swal.fire({ title: 'Carico le newsletter…', didOpen: () => Swal.showLoading() });
+            Swal.fire({
+                title: 'Carico le newsletter…',
+                didOpen: () => Swal.showLoading()
+            });
             let list;
             try {
-                const r = await fetch(API + '?action=list_wp', { credentials: 'same-origin' });
+                const r = await fetch(API + '?action=list_wp', {
+                    credentials: 'same-origin'
+                });
                 const j = await r.json();
                 if (!j.success) throw new Error(j.message);
                 list = j.emails;
-            } catch (e) { return Swal.fire('Errore', e.message || 'Impossibile leggere The Newsletter.', 'error'); }
+            } catch (e) {
+                return Swal.fire('Errore', e.message || 'Impossibile leggere The Newsletter.', 'error');
+            }
 
-            const labels = { new: 'bozza', sending: 'in invio', paused: 'in pausa', sent: 'inviata', error: 'errore' };
+            const labels = {
+                new: 'bozza',
+                sending: 'in invio',
+                paused: 'in pausa',
+                sent: 'inviata',
+                error: 'errore'
+            };
             const html = '<div class="wp-list">' + list.map(m =>
-                '<div class="wp-item"><div><strong>' + esc(m.subject || '(senza oggetto)') + '</strong><br>' +
+                    '<div class="wp-item"><div><strong>' + esc(m.subject || '(senza oggetto)') + '</strong><br>' +
-                '<small>n. ' + m.id + ' · ' + esc(labels[m.status] || m.status) + ' · ' + esc((m.created || '').slice(0, 10)) + '</small></div>' +
+                    '<small>n. ' + m.id + ' · ' + esc(labels[m.status] || m.status) + ' · ' + esc((m.created || '').slice(0, 10)) + '</small></div>' +
-                '<button class="btn btn-sm btn-primary js-imp" data-id="' + m.id + '">Importa</button></div>'
+                    '<button class="btn btn-sm btn-primary js-imp" data-id="' + m.id + '">Importa</button></div>'
-            ).join('') + '</div>' +
+                ).join('') + '</div>' +
                 '<p class="mt-3 mb-0" style="font-size:13px;color:#6b7280;">Le bozze non ancora inviate restano collegate: "Pubblica" aggiornerà quella stessa newsletter.</p>';
 
             Swal.fire({
@@ -267,9 +401,13 @@ $statusLabel = [
                         b.disabled = true;
                         b.textContent = '…';
                         try {
-                            const j = await api('import_wp', { wp_id: b.dataset.id });
+                            const j = await api('import_wp', {
+                                wp_id: b.dataset.id
+                            });
                             location.href = 'newsletter_editor.php?id=' + j.id;
-                        } catch (e) { Swal.fire('Errore', e.message, 'error'); }
+                        } catch (e) {
+                            Swal.fire('Errore', e.message, 'error');
+                        }
                     }));
                 }
             });
@@ -277,4 +415,4 @@ $statusLabel = [
     </script>
 </body>
 
-</html>
+</html>