more shrink, and a + t2

This commit is contained in:
2026-06-28 16:45:55 -03:00
parent 8b97480e2e
commit e9681201c0
3 changed files with 20 additions and 7 deletions

View File

@@ -13,12 +13,12 @@
* breathing room). A fixed-px budget is more reliable than a proportional vh value * 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. * because that chrome is a fixed height regardless of screen size.
* *
* Tune the single number below (120px) if the scrollbar is still clipped or if you * Tune the single number below (170px) if the scrollbar is still clipped or if you
* want the columns taller. * want the columns taller.
* *
* The selector is intentionally more specific than core's single-class rule, and * 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). * uses !important, so this override wins even alongside a theme (e.g. Essential).
*/ */
#board td .board-task-list.board-task-list-compact { #board td .board-task-list.board-task-list-compact {
max-height: calc(100vh - 120px) !important; max-height: calc(100vh - 170px) !important;
} }

View File

@@ -13,6 +13,12 @@ class Plugin extends Base
$this->hook->on('template:layout:css', array( $this->hook->on('template:layout:css', array(
'template' => 'plugins/ShrinkVertically/Asset/css/shrink-vertically.css', 'template' => 'plugins/ShrinkVertically/Asset/css/shrink-vertically.css',
)); ));
// Append a "+" to the two vertical-collapse menu labels so it is visible
// that the behaviour is modified by this plugin.
$this->hook->on('template:layout:js', array(
'template' => 'plugins/ShrinkVertically/Asset/js/shrink-vertically.js',
));
} }
public function getPluginName() public function getPluginName()

View File

@@ -25,16 +25,23 @@ list:
```css ```css
#board td .board-task-list.board-task-list-compact { #board td .board-task-list.board-task-list-compact {
max-height: calc(100vh - 120px) !important; max-height: calc(100vh - 170px) !important;
} }
``` ```
The `120px` reserves room for the page header, the board column header, the horizontal The `170px` 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 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. proportional value because that chrome is a fixed height regardless of screen size.
It changes nothing else: no data, no JavaScript, no database migration. The override only The override only applies while columns are collapsed (when core adds the
applies while columns are collapsed (when core adds the `board-task-list-compact` class). `board-task-list-compact` class). It changes no data and runs no database migration.
## Menu labels
So it is obvious the collapsed behaviour comes from this plugin and not from core, a
small script (via `template:layout:js`) appends a `+` to the two gear-menu items, so they
read "Collapse vertically+" and "Expand vertically+". It only edits the rendered link
text, so it works in any locale.
## Requirements ## Requirements
@@ -48,7 +55,7 @@ from the folder name). Reload the board; no build step, no configuration.
## Tuning ## Tuning
Edit the single `120px` value in `Asset/css/shrink-vertically.css`. Increase it if the Edit the single `170px` 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 scrollbar is still clipped (for example with a taller theme header); decrease it to make
the collapsed columns taller. the collapsed columns taller.