4 Commits

2 changed files with 13 additions and 5 deletions

View File

@@ -13,12 +13,20 @@
* breathing room). A fixed-px budget is more reliable than a proportional vh value
* because that chrome is a fixed height regardless of screen size.
*
* Tune the single number below (170px) if the scrollbar is still clipped or if you
* Tune the single number below (240px) if the scrollbar is still clipped or if you
* want the columns taller.
*
* The selector is intentionally more specific than core's single-class rule, and
* uses !important, so this override wins even alongside a theme (e.g. Essential).
*
* The min-height override is essential: Kanboard's drag-and-drop sets an INLINE
* min-height on each column equal to its full content height
* (BoardDragAndDrop.js: css("min-height", parent().height())). In CSS, min-height
* beats max-height, so that inline value keeps tall columns from shrinking and our
* max-height alone does nothing. A stylesheet !important overrides the inline
* (non-important) min-height, so we reset it to 0 and let max-height win.
*/
#board td .board-task-list.board-task-list-compact {
max-height: calc(100vh - 170px) !important;
max-height: calc(100vh - 240px) !important;
min-height: 0 !important;
}

View File

@@ -25,11 +25,11 @@ list:
```css
#board td .board-task-list.board-task-list-compact {
max-height: calc(100vh - 170px) !important;
max-height: calc(100vh - 240px) !important;
}
```
The `170px` reserves room for the page header, the board column header, the horizontal
The `240px` reserves room for the page header, the board column header, the horizontal
scrollbar, and a little breathing space. A fixed-pixel budget is more reliable than a
proportional value because that chrome is a fixed height regardless of screen size.
@@ -55,7 +55,7 @@ from the folder name). Reload the board; no build step, no configuration.
## Tuning
Edit the single `170px` value in `Asset/css/shrink-vertically.css`. Increase it if the
Edit the single `240px` value in `Asset/css/shrink-vertically.css`. Increase it if the
scrollbar is still clipped (for example with a taller theme header); decrease it to make
the collapsed columns taller.