Files
ShrinkVertically/README.md

58 lines
2.0 KiB
Markdown
Raw Permalink Normal View History

2026-06-28 16:37:10 -03:00
# ShrinkVertically -- keep the board horizontal scrollbar visible
2026-06-28 16:24:11 -03:00
2026-06-28 16:37:10 -03:00
A tiny Kanboard plugin that fixes the vertically-collapsed board view so the bottom
horizontal scrollbar stays on screen.
2026-06-28 16:24:11 -03:00
2026-06-28 16:37:10 -03:00
## The problem
2026-06-28 16:24:11 -03:00
2026-06-28 16:37:10 -03:00
Kanboard's board gear menu has an "expand vertically / collapse vertically" toggle. When
collapsed, each column gets a limited height so the horizontal scrollbar sits closer.
Core implements this with a single rule:
2026-06-28 16:24:11 -03:00
2026-06-28 16:37:10 -03:00
```css
.board-task-list-compact { max-height: 90vh; }
```
2026-06-28 16:24:11 -03:00
2026-06-28 16:37:10 -03:00
That `90vh` is measured from the top of the viewport and does not account for the page
header above the board. So even when collapsed, the column plus the header together
exceed the viewport height and the horizontal scrollbar is pushed below the fold.
2026-06-28 16:24:11 -03:00
2026-06-28 16:37:10 -03:00
## The fix
2026-06-28 16:24:11 -03:00
2026-06-28 16:37:10 -03:00
This plugin injects one CSS rule (via the `template:layout:css` hook) that replaces the
proportional `90vh` with a fixed-pixel budget for the chrome above and below the task
list:
2026-06-28 16:24:11 -03:00
2026-06-28 16:37:10 -03:00
```css
#board td .board-task-list.board-task-list-compact {
max-height: calc(100vh - 120px) !important;
}
```
2026-06-28 16:24:11 -03:00
2026-06-28 16:37:10 -03:00
The `120px` 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.
2026-06-28 16:24:11 -03:00
2026-06-28 16:37:10 -03:00
It changes nothing else: no data, no JavaScript, no database migration. The override only
applies while columns are collapsed (when core adds the `board-task-list-compact` class).
2026-06-28 16:24:11 -03:00
2026-06-28 16:37:10 -03:00
## Requirements
- Kanboard >= 1.2.0
## Installation
Copy this folder into your Kanboard installation as `plugins/ShrinkVertically/`. The
directory name must be exactly `ShrinkVertically` (Kanboard derives the plugin namespace
from the folder name). Reload the board; no build step, no configuration.
## Tuning
2026-06-28 16:24:11 -03:00
2026-06-28 16:37:10 -03:00
Edit the single `120px` 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.
2026-06-28 16:24:11 -03:00
## License
AGPL-3.0. See LICENSE.