move select via external JS (CSP fix); rows show id/owner/config + ws counts

Asset/css/workspaceorg.css

@@ -38,12 +38,40 @@
     font-style: italic;
 }
 
-.wso-table td {
-    vertical-align: middle;
+/* One project row: id (+ config dropdown) / title / owner on the left, move control on the right,
+   separated by a light horizontal line. */
+.wso-row {
+    display: flex;
+    align-items: center;
+    justify-content: space-between;
+    padding: 6px 2px;
+    border-bottom: 1px solid #eee;
+}
+
+.wso-row-main {
+    display: flex;
+    align-items: baseline;
+    flex-wrap: wrap;
+}
+
+.wso-id {
+    margin-right: 8px;
+    color: #777;
+}
+
+.wso-title {
+    margin-right: 12px;
+    font-weight: bold;
+}
+
+.wso-owner {
+    color: #999;
+    font-size: 0.9em;
 }
 
 .wso-move {
-    width: 220px;
+    flex: 0 0 auto;
+    margin-left: 12px;
     text-align: right;
 }
 

Asset/js/workspaceorg.js

@@ -0,0 +1,26 @@
+/*
+ * WorkspaceOrg -- submit the per-project "move to workspace" form when its dropdown changes.
+ *
+ * Kanboard's default CSP is `default-src 'self'` (no 'unsafe-inline' for scripts), so an inline
+ * onchange="" attribute is blocked and does nothing. The change handler must live in an external
+ * script served from 'self', which is what this file is.
+ */
+(function () {
+    "use strict";
+
+    function init() {
+        var selects = document.querySelectorAll(".wso-move-form select");
+
+        for (var i = 0; i < selects.length; i++) {
+            selects[i].addEventListener("change", function () {
+                this.form.submit();
+            });
+        }
+    }
+
+    if (document.readyState === "loading") {
+        document.addEventListener("DOMContentLoaded", init);
+    } else {
+        init();
+    }
+})();