From 72681443a61018231eaa180a5d283e3825641219 Mon Sep 17 00:00:00 2001
From: Francois Ferrand <thetypz@gmail.com>
Date: Wed, 11 Mar 2015 10:20:32 +0100
Subject: Fix flickering and column sizes.

* Avoid flickering in default view mode, by properly setting the default (horizontal-scroll) layout
directly in CSS. This flickering was introduced with #675 pull request. This also fixes the layout
of the public board. Javascript is now used only to activate the 'compact' mode, thus still causing
a slight flickering, but in that mode only.
* Use fixed-layout on the table to improve layout and rendering speed.
* Slightly reduce the width of the swimlane header column, and make it fixed-width.
* Slightly simplify the Javascript/jQuery code for activating compact mode.

This is replaces pull request #688, with only the table layout fix, since I have no proper solution
for the scrolling problem.
---
 assets/css/app.css       | 25 +++++++++++++------------
 assets/css/src/board.css | 25 +++++++++++++------------
 2 files changed, 26 insertions(+), 24 deletions(-)

(limited to 'assets/css')

diff --git a/assets/css/app.css b/assets/css/app.css
index 4d2f4075..9705b64f 100644
--- a/assets/css/app.css
+++ b/assets/css/app.css
@@ -762,26 +762,27 @@ nav .active a {
 /* board table */
 #board-container {
     padding-bottom: 180px; /* Space to avoid dropdown menu truncated */
-}
-
-/* Board container classes for wide/compact view */
-.board-container-wide {
     overflow-x: scroll;
 }
 
 .board-container-compact {
-    overflow-x: hidden;
+    overflow-x: initial;
+}
+
+#board {
+    table-layout: fixed;
+}
+
+#board th {
+    width: 120px; /* Width of swimlane column */
 }
 
-/* Board table column for wide/compact view */
-.board-column-wide {
-    min-width: 240px;
-    max-width: 240px;
+#board th.board-column {
+    width: 240px; /* Width of other columns, in default [horizontal scrolling] view mode */
 }
 
-.board-column-compact {
-    min-width: 0px;
-    max-width: 0px;
+#board th.board-column.board-column-compact {
+    width: initial; /* Do not force the width of the columns in compact view mode */
 }
 
 #board th a {
diff --git a/assets/css/src/board.css b/assets/css/src/board.css
index f4aefa95..4309b178 100644
--- a/assets/css/src/board.css
+++ b/assets/css/src/board.css
@@ -21,26 +21,27 @@
 /* board table */
 #board-container {
     padding-bottom: 180px; /* Space to avoid dropdown menu truncated */
-}
-
-/* Board container classes for wide/compact view */
-.board-container-wide {
     overflow-x: scroll;
 }
 
 .board-container-compact {
-    overflow-x: hidden;
+    overflow-x: initial;
+}
+
+#board {
+    table-layout: fixed;
+}
+
+#board th {
+    width: 120px; /* Width of swimlane column */
 }
 
-/* Board table column for wide/compact view */
-.board-column-wide {
-    min-width: 240px;
-    max-width: 240px;
+#board th.board-column {
+    width: 240px; /* Width of other columns, in default [horizontal scrolling] view mode */
 }
 
-.board-column-compact {
-    min-width: 0px;
-    max-width: 0px;
+#board th.board-column.board-column-compact {
+    width: initial; /* Do not force the width of the columns in compact view mode */
 }
 
 #board th a {
-- 
cgit v1.2.3