From d98e9f8f0519e8a5f39913e04a38f0424d89fdc3 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E4=BE=9D=E7=91=AA=E8=B2=93?= <imacat@mail.imacat.idv.tw>
Date: Sun, 26 Feb 2023 07:44:48 +0800
Subject: [PATCH] Added the accounting-dragged class to replace the
 list-group-item-dark class when reordering with drag-and-drop, because the
 dragged list may not be a list group.

---
 src/accounting/static/css/style.css               | 4 ++++
 src/accounting/static/js/drag-and-drop-reorder.js | 8 ++++----
 2 files changed, 8 insertions(+), 4 deletions(-)

diff --git a/src/accounting/static/css/style.css b/src/accounting/static/css/style.css
index b014f4d..188bf89 100644
--- a/src/accounting/static/css/style.css
+++ b/src/accounting/static/css/style.css
@@ -34,6 +34,10 @@
     color: inherit;
     padding-right: 0;
 }
+.accounting-dragged {
+    color: #141619;
+    background-color: #D3D3D4;
+}
 
 /** The card layout */
 .accounting-card {
diff --git a/src/accounting/static/js/drag-and-drop-reorder.js b/src/accounting/static/js/drag-and-drop-reorder.js
index e2b17c1..9f8141e 100644
--- a/src/accounting/static/js/drag-and-drop-reorder.js
+++ b/src/accounting/static/js/drag-and-drop-reorder.js
@@ -46,14 +46,14 @@ function initializeMouseDragAndDropReordering(list, onReorder) {
         item.draggable = true;
         item.addEventListener("dragstart", function () {
             dragged = item;
-            dragged.classList.add("list-group-item-dark");
+            dragged.classList.add("accounting-dragged");
         });
         item.addEventListener("dragover", function () {
             onDragOver(dragged, item);
             onReorder();
         });
         item.addEventListener("dragend", function () {
-            dragged.classList.remove("list-group-item-dark");
+            dragged.classList.remove("accounting-dragged");
             dragged = null;
         });
     });
@@ -70,7 +70,7 @@ function initializeTouchDragAndDropReordering(list, onReorder) {
     const items = Array.from(list.children);
     items.forEach(function (item) {
         item.addEventListener("touchstart", function () {
-            item.classList.add("list-group-item-dark");
+            item.classList.add("accounting-dragged");
         });
         item.addEventListener("touchmove", function (event) {
             const touch = event.targetTouches[0];
@@ -79,7 +79,7 @@ function initializeTouchDragAndDropReordering(list, onReorder) {
             onReorder();
         });
         item.addEventListener("touchend", function () {
-            item.classList.remove("list-group-item-dark");
+            item.classList.remove("accounting-dragged");
         });
     });
 }