Add column vertical scrolling and set column height dynamically

3 files changed, 36 insertions, 18 deletions

diff --git a/assets/css/app.css b/assets/css/app.css
index 9c7e64c6..37dde05e 100644
--- a/assets/css/app.css
+++ b/assets/css/app.css
@@ -775,11 +775,11 @@ nav .active a {
     width: 120px; /* Width of swimlane column */
 }
 
-#board th.board-column {
+#board th.board-column-header {
     width: 240px; /* Width of other columns, in default [horizontal scrolling] view mode */
 }
 
-#board th.board-column.board-column-compact {
+#board th.board-column-header.board-column-compact {
     width: initial; /* Do not force the width of the columns in compact view mode */
 }
 
@@ -793,10 +793,6 @@ nav .active a {
     vertical-align: top;
 }
 
-#board td.task-limit-warning {
-    background-color: #DF5353;
-}
-
 /* column header */
 .board-add-icon {
     float: left;
@@ -838,6 +834,16 @@ nav .active a {
 .board-swimlane-title {
     vertical-align: top;
 }
+
+/* board task list */
+.board-task-list {
+    height: 500px;
+    overflow: auto;
+}
+
+.board-task-list-limit {
+    background-color: #DF5353;
+}
 /* task inside the board */
 .task-board {
     position: relative;
diff --git a/assets/css/print.css b/assets/css/print.css
index 768c9e25..9037ece2 100644
--- a/assets/css/print.css
+++ b/assets/css/print.css
@@ -181,11 +181,11 @@ th a:hover {
     width: 120px; /* Width of swimlane column */
 }
 
-#board th.board-column {
+#board th.board-column-header {
     width: 240px; /* Width of other columns, in default [horizontal scrolling] view mode */
 }
 
-#board th.board-column.board-column-compact {
+#board th.board-column-header.board-column-compact {
     width: initial; /* Do not force the width of the columns in compact view mode */
 }
 
@@ -199,10 +199,6 @@ th a:hover {
     vertical-align: top;
 }
 
-#board td.task-limit-warning {
-    background-color: #DF5353;
-}
-
 /* column header */
 .board-add-icon {
     float: left;
@@ -244,6 +240,16 @@ th a:hover {
 .board-swimlane-title {
     vertical-align: top;
 }
+
+/* board task list */
+.board-task-list {
+    height: 500px;
+    overflow: auto;
+}
+
+.board-task-list-limit {
+    background-color: #DF5353;
+}
 /* task inside the board */
 .task-board {
     position: relative;
diff --git a/assets/css/src/board.css b/assets/css/src/board.css
index a63e56b5..22de6c51 100644
--- a/assets/css/src/board.css
+++ b/assets/css/src/board.css
@@ -33,11 +33,11 @@
     width: 120px; /* Width of swimlane column */
 }
 
-#board th.board-column {
+#board th.board-column-header {
     width: 240px; /* Width of other columns, in default [horizontal scrolling] view mode */
 }
 
-#board th.board-column.board-column-compact {
+#board th.board-column-header.board-column-compact {
     width: initial; /* Do not force the width of the columns in compact view mode */
 }
 
@@ -51,10 +51,6 @@
     vertical-align: top;
 }
 
-#board td.task-limit-warning {
-    background-color: #DF5353;
-}
-
 /* column header */
 .board-add-icon {
     float: left;
@@ -96,3 +92,13 @@
 .board-swimlane-title {
     vertical-align: top;
 }
+
+/* board task list */
+.board-task-list {
+    height: 500px;
+    overflow: auto;
+}
+
+.board-task-list-limit {
+    background-color: #DF5353;
+}