mirror of
https://github.com/Theodor-Springmann-Stiftung/musenalm.git
synced 2026-02-04 10:35:30 +00:00
better clckong and dragging behavior
This commit is contained in:
@@ -461,6 +461,22 @@
|
||||
});
|
||||
}
|
||||
|
||||
if (header) {
|
||||
header.addEventListener("click", (event) => {
|
||||
if (item.dataset.dragging === "true") {
|
||||
return;
|
||||
}
|
||||
if (item.classList.contains("data-editing") || item.dataset.contentTemp === "true") {
|
||||
return;
|
||||
}
|
||||
if (event.target.closest("button, a, select, input, textarea")) {
|
||||
return;
|
||||
}
|
||||
setCollapsed(item.dataset.collapsed !== "true");
|
||||
updateCollapseAllLabel();
|
||||
});
|
||||
}
|
||||
|
||||
if (editButton) {
|
||||
editButton.addEventListener("click", () => {
|
||||
if (item.querySelector("[data-role='content-edit']")) {
|
||||
@@ -710,6 +726,7 @@
|
||||
return;
|
||||
}
|
||||
draggedItem = item;
|
||||
item.dataset.dragging = "true";
|
||||
draggedItem.classList.add("opacity-60");
|
||||
list.style.rowGap = "0.75rem";
|
||||
list.style.paddingTop = "0.25rem";
|
||||
@@ -740,6 +757,7 @@
|
||||
list.addEventListener("dragend", () => {
|
||||
if (draggedItem) {
|
||||
draggedItem.classList.remove("opacity-60");
|
||||
draggedItem.dataset.dragging = "";
|
||||
}
|
||||
draggedItem = null;
|
||||
list.style.rowGap = "";
|
||||
|
||||
@@ -21,7 +21,7 @@
|
||||
<div data-role="content-item" class="relative {{ if $isNew }}data-new-content{{ end }} {{ if $openEdit }}data-editing{{ end }}" data-open-edit="{{ if $openEdit }}true{{ end }}" data-content-temp="{{ if $isNew }}true{{ end }}" data-content-id="{{ $contentID }}" data-collapsed="true">
|
||||
<div data-role="content-view" class="{{ if $openEdit }}hidden{{ end }} mt-2">
|
||||
<div class="border border-slate-200 bg-stone-100 rounded-xs overflow-hidden">
|
||||
<div class="flex items-center justify-between gap-4 border-b border-slate-200 bg-stone-100 px-3 py-2 cursor-grab" data-role="content-drag-handle" data-content-header="true" draggable="true" aria-label="Beitrag verschieben">
|
||||
<div class="flex items-center justify-between gap-4 border-b border-slate-200 bg-stone-100 px-3 py-2 cursor-pointer hover:bg-stone-200 transition-colors duration-75" data-role="content-drag-handle" data-content-header="true" draggable="true" aria-label="Beitrag verschieben">
|
||||
<div class="flex items-center gap-2 text-sm font-bold text-gray-800">
|
||||
<button type="button" class="text-slate-600 rounded-xs px-2 py-1 text-sm transition-colors hover:bg-stone-100 {{ if $isNew }}hidden{{ end }}" data-role="content-collapse-toggle" aria-label="Beitrag einklappen" aria-expanded="true">
|
||||
<i class="ri-arrow-up-s-line" data-role="content-collapse-icon"></i>
|
||||
|
||||
Reference in New Issue
Block a user