more shrink, and a + t2
This commit is contained in:
@@ -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;
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -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()
|
||||||
|
|||||||
17
README.md
17
README.md
@@ -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.
|
||||||
|
|
||||||
|
|||||||
Reference in New Issue
Block a user