Sélection par séance, réordonnancement et exclusion vie du labo

assets/admin.css

@@ -138,6 +138,41 @@
     margin-top: 2px;
 }
 
+/* ---- Drag handle + reordering ---- */
+.thalim-nl-drag-handle {
+    flex-shrink: 0;
+    cursor: grab;
+    color: #c3c4c7;
+    font-size: 16px;
+    width: 16px;
+    height: 16px;
+    line-height: 1;
+    align-self: center;
+}
+
+.thalim-nl-post-row:hover .thalim-nl-drag-handle,
+.thalim-nl-seminar-title:hover .thalim-nl-drag-handle {
+    color: #8c8f94;
+}
+
+.thalim-nl-drag-handle:active {
+    cursor: grabbing;
+}
+
+.thalim-nl-sortable-placeholder {
+    border: 1px dashed #2271b1;
+    background: #f0f6fc;
+    border-radius: 3px;
+    height: 26px;
+    margin: 2px 0;
+}
+
+.ui-sortable-helper {
+    background: #fff;
+    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15);
+    border-radius: 3px;
+}
+
 .thalim-nl-post-title {
     flex: 1;
     font-size: 13px;
@@ -166,29 +201,37 @@
     white-space: nowrap;
 }
 
-/* ---- Séances list under seminars ---- */
-.thalim-nl-seances-list {
-    margin: 2px 0 6px 28px;
-    padding: 0;
-    list-style: none;
-    border-left: 2px solid #dcdcde;
-    padding-left: 12px;
+/* ---- Seminars: séances grouped under their seminar ---- */
+.thalim-nl-seminar-group {
+    margin-top: 18px;
 }
 
-.thalim-nl-seance-item {
-    padding: 3px 0;
-    font-size: 12px;
-    color: #50575e;
+.thalim-nl-seminar-group:first-child {
+    margin-top: 4px;
 }
 
-.thalim-nl-seance-title {
-    font-weight: 500;
+.thalim-nl-seminar-title {
+    display: flex;
+    align-items: baseline;
+    gap: 6px;
+    font-weight: 600;
+    font-size: 13px;
+    color: #1d2327;
+    padding: 5px 10px;
+    background: #f0f3f5;
+    border-radius: 3px;
 }
 
-.thalim-nl-seance-meta {
-    display: block;
-    color: #888;
-    font-size: 11px;
+.thalim-nl-seminar-title .thalim-nl-post-view {
+    margin-left: auto;
+}
+
+/* Séances hang under their seminar title, connected by a left rail */
+.thalim-nl-seance-row {
+    margin-left: 9px;
+    padding-left: 17px;
+    border-bottom: none;
+    border-left: 2px solid #e2e6ea;
 }
 
 /* ---- Empty state ---- */

assets/admin.js

@@ -2,6 +2,49 @@
 (function ($) {
     'use strict';
 
+    // -------------------------------------------------------------------------
+    // Drag-and-drop reordering of items within each category list.
+    // The submit order of checkboxes follows DOM order, and the exporter
+    // renders each section in stored order — so reordering rows here is enough
+    // for the new order to appear in the generated HTML after saving.
+    // -------------------------------------------------------------------------
+    function makeSortable($container, itemSelector) {
+        if (!$.fn.sortable) return;
+        $container.sortable({
+            items:                itemSelector,
+            handle:               '.thalim-nl-drag-handle',
+            axis:                 'y',
+            containment:          'parent',
+            tolerance:            'pointer',
+            cursor:               'grabbing',
+            opacity:              0.9,
+            placeholder:          'thalim-nl-sortable-placeholder',
+            forcePlaceholderSize: true,
+        });
+    }
+
+    function initSortable() {
+        var $root = $('#thalim-nl-sections-wrap');
+
+        $root.find('.thalim-nl-section-body').each(function () {
+            var $body = $(this);
+            if ($body.find('.thalim-nl-seminar-group').length) {
+                // Seminars: reorder whole seminars (séances stay chronological).
+                makeSortable($body, '> .thalim-nl-seminar-group');
+            } else {
+                // Normal categories: reorder post rows.
+                makeSortable($body, '> .thalim-nl-post-row');
+            }
+        });
+    }
+
+    // A click on the drag handle must not toggle its enclosing checkbox label.
+    $(document).on('click', '.thalim-nl-drag-handle', function (e) {
+        e.preventDefault();
+    });
+
+    $(initSortable);
+
     // -------------------------------------------------------------------------
     // Month change → AJAX reload sections + update TinyMCE intro
     // -------------------------------------------------------------------------
@@ -24,6 +67,7 @@
             if (!response.success) return;
 
             $wrap.html(response.data.html);
+            initSortable();
 
             // Update TinyMCE intro — do NOT re-render wp_editor
             var introEditor = typeof tinymce !== 'undefined' && tinymce.get('thalim_nl_intro');