README first draft
This commit is contained in:
91
README.md
91
README.md
@@ -1,19 +1,40 @@
|
|||||||
# Skeleton -- a Kanboard plugin template
|
# ShrinkVertically -- keep the board horizontal scrollbar visible
|
||||||
|
|
||||||
A minimal, working Kanboard plugin that you copy and rename as the starting point for a
|
A tiny Kanboard plugin that fixes the vertically-collapsed board view so the bottom
|
||||||
real plugin. By itself it does only one trivial thing: it renders the word "Skeleton" at
|
horizontal scrollbar stays on screen.
|
||||||
the top of every page. It changes no data and runs no database migration.
|
|
||||||
|
|
||||||
## What it demonstrates
|
## The problem
|
||||||
|
|
||||||
- A complete `Plugin.php` registration class with all the metadata Kanboard shows in
|
Kanboard's board gear menu has an "expand vertically / collapse vertically" toggle. When
|
||||||
Settings -> Plugins (name, description, author, version, homepage, compatible version).
|
collapsed, each column gets a limited height so the horizontal scrollbar sits closer.
|
||||||
- A template hook (`template:layout:top`) that injects a template into the page.
|
Core implements this with a single rule:
|
||||||
- Asset hooks (`template:layout:css` and `template:layout:js`) that load a stylesheet and
|
|
||||||
a script. They are empty for now but prove the injection path works -- handy when a real
|
```css
|
||||||
plugin needs custom CSS or JS.
|
.board-task-list-compact { max-height: 90vh; }
|
||||||
- The standard plugin directory layout, with stub folders (`Controller/`, `Model/`,
|
```
|
||||||
`Schema/`, `Locale/`, `Test/`) ready to grow into.
|
|
||||||
|
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.
|
||||||
|
|
||||||
|
## The fix
|
||||||
|
|
||||||
|
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:
|
||||||
|
|
||||||
|
```css
|
||||||
|
#board td .board-task-list.board-task-list-compact {
|
||||||
|
max-height: calc(100vh - 120px) !important;
|
||||||
|
}
|
||||||
|
```
|
||||||
|
|
||||||
|
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.
|
||||||
|
|
||||||
|
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).
|
||||||
|
|
||||||
## Requirements
|
## Requirements
|
||||||
|
|
||||||
@@ -21,45 +42,15 @@ the top of every page. It changes no data and runs no database migration.
|
|||||||
|
|
||||||
## Installation
|
## Installation
|
||||||
|
|
||||||
No build step and no dependencies.
|
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.
|
||||||
|
|
||||||
1. Copy this folder into your Kanboard installation as `plugins/Skeleton/`.
|
## Tuning
|
||||||
2. Reload any page. The word "Skeleton" appears at the top.
|
|
||||||
3. Confirm it under Settings -> Plugins.
|
|
||||||
|
|
||||||
To uninstall, delete `plugins/Skeleton/`. Nothing else is left behind.
|
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
|
||||||
## Directory layout
|
the collapsed columns taller.
|
||||||
|
|
||||||
```
|
|
||||||
Skeleton/
|
|
||||||
Plugin.php Registration and hook wiring (the only required file).
|
|
||||||
README.md
|
|
||||||
LICENSE AGPL-3.0.
|
|
||||||
Template/
|
|
||||||
layout/header.php The visible "Skeleton" word.
|
|
||||||
Asset/
|
|
||||||
css/skeleton.css Loaded via template:layout:css.
|
|
||||||
js/skeleton.js Loaded via template:layout:js.
|
|
||||||
Controller/ Stub for future request handlers.
|
|
||||||
Model/ Stub for future business logic / DB access.
|
|
||||||
Schema/ Stub for future database migrations.
|
|
||||||
Locale/ Stub for future translations (e.g. pt_BR/, fr_FR/).
|
|
||||||
Test/ Stub for future unit tests.
|
|
||||||
```
|
|
||||||
|
|
||||||
## How to fork this into a new plugin
|
|
||||||
|
|
||||||
1. Copy the folder and rename it, e.g. `plugins/MyPlugin/`. The folder name must match the
|
|
||||||
namespace and start with a capital letter.
|
|
||||||
2. In `Plugin.php`, change the namespace from `Kanboard\Plugin\Skeleton` to
|
|
||||||
`Kanboard\Plugin\MyPlugin`.
|
|
||||||
3. Update the metadata methods (`getPluginName`, `getPluginDescription`, `getPluginAuthor`,
|
|
||||||
`getPluginVersion`, `getPluginHomepage`, `getCompatibleVersion`).
|
|
||||||
4. Update the hook target paths: the lowercase prefix in `'skeleton:layout/header'` and the
|
|
||||||
`plugins/Skeleton/Asset/...` asset paths must match the new plugin name.
|
|
||||||
5. Replace `Template/layout/header.php` with your real template, or attach to a different
|
|
||||||
hook. See the Kanboard plugin hooks documentation for the full list of hook points.
|
|
||||||
|
|
||||||
## License
|
## License
|
||||||
|
|
||||||
|
|||||||
Reference in New Issue
Block a user