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.
This commit is contained in:
Francois Ferrand
2015-03-11 10:20:32 +01:00
parent d91b5d4aa3
commit 72681443a6
4 changed files with 32 additions and 30 deletions

View File

@@ -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 column for wide/compact view */
.board-column-wide {
min-width: 240px;
max-width: 240px;
#board {
table-layout: fixed;
}
.board-column-compact {
min-width: 0px;
max-width: 0px;
#board th {
width: 120px; /* Width of swimlane column */
}
#board th.board-column {
width: 240px; /* Width of other columns, in default [horizontal scrolling] view mode */
}
#board th.board-column.board-column-compact {
width: initial; /* Do not force the width of the columns in compact view mode */
}
#board th a {