8 Commits
v1.0 ... v1.3.1

8 changed files with 66 additions and 15 deletions

2
.gitignore vendored Normal file
View File

@@ -0,0 +1,2 @@
PLAN-*

View File

@@ -48,3 +48,25 @@
.sv-top-scroll-inner {
height: 1px;
}
/*
* Make the top scrollbar thick enough to grab easily (touch / big fingers).
* WebKit/Blink (most desktop browsers and mobile Chrome/Safari) let us size the
* scrollbar; styling the thumb/track is needed for it to stay visible once customised.
* Thickness comes from the --sv-bar-size variable (Settings -> Shrink Vertically),
* injected in the page head; falls back to 25px. Chromium/WebKit only (Chrome/Edge/
* Safari, mobile Chrome/Safari); Firefox ignores ::-webkit-scrollbar and keeps its
* default thin bar -- accepted for now.
*/
.sv-top-scroll::-webkit-scrollbar {
height: var(--sv-bar-size, 25px);
}
.sv-top-scroll::-webkit-scrollbar-track {
background: rgba(0, 0, 0, 0.05);
}
.sv-top-scroll::-webkit-scrollbar-thumb {
background: rgba(0, 0, 0, 0.35);
border-radius: 6px;
}

View File

@@ -14,15 +14,21 @@ class ConfigController extends BaseController
const MIN_OFFSET = 0;
const MAX_OFFSET = 2000;
const DEFAULT_BAR_SIZE = 25;
const MIN_BAR_SIZE = 0;
const MAX_BAR_SIZE = 200;
public function show()
{
$offset = (int) $this->configModel->get('shrink_vertically_offset', self::DEFAULT_OFFSET);
$topScrollbar = (int) $this->configModel->get('shrink_vertically_top_scrollbar', 0);
$barSize = (int) $this->configModel->get('shrink_vertically_bar_size', self::DEFAULT_BAR_SIZE);
$topScrollbar = (int) $this->configModel->get('shrink_vertically_top_scrollbar', 1);
$this->response->html($this->helper->layout->config('shrinkVertically:config/show', array(
'title' => t('Settings').' > '.t('Shrink Vertically'),
'values' => array(
'shrink_vertically_offset' => $offset,
'shrink_vertically_bar_size' => $barSize,
'shrink_vertically_top_scrollbar' => $topScrollbar,
),
'errors' => array(),
@@ -36,10 +42,14 @@ class ConfigController extends BaseController
$offset = isset($values['shrink_vertically_offset']) ? (int) $values['shrink_vertically_offset'] : self::DEFAULT_OFFSET;
$offset = max(self::MIN_OFFSET, min(self::MAX_OFFSET, $offset));
$barSize = isset($values['shrink_vertically_bar_size']) ? (int) $values['shrink_vertically_bar_size'] : self::DEFAULT_BAR_SIZE;
$barSize = max(self::MIN_BAR_SIZE, min(self::MAX_BAR_SIZE, $barSize));
$topScrollbar = isset($values['shrink_vertically_top_scrollbar']) ? 1 : 0;
if ($this->configModel->save(array(
'shrink_vertically_offset' => $offset,
'shrink_vertically_bar_size' => $barSize,
'shrink_vertically_top_scrollbar' => $topScrollbar,
))) {
$this->flash->success(t('Settings saved successfully.'));

View File

@@ -27,7 +27,7 @@ class Plugin extends Base
$this->template->hook->attach('template:config:sidebar', 'shrinkVertically:config/sidebar');
// Optional: a second, mirrored horizontal scrollbar above the board columns.
if ((int) $this->configModel->get('shrink_vertically_top_scrollbar', 0) === 1) {
if ((int) $this->configModel->get('shrink_vertically_top_scrollbar', 1) === 1) {
$this->hook->on('template:layout:js', array(
'template' => 'plugins/ShrinkVertically/Asset/js/top-scrollbar.js',
));
@@ -51,7 +51,7 @@ class Plugin extends Base
public function getPluginVersion()
{
return '1.0.0';
return '1.3.1';
}
public function getPluginHomepage()

View File

@@ -1,9 +1,12 @@
# ShrinkVertically -- keep the board horizontal scrollbar visible
A small Kanboard plugin focused on the board's horizontal scrollbar. It fixes the
vertically-collapsed board view so the bottom scrollbar stays on screen, and can
optionally add a second, mirrored horizontal scrollbar above the columns. Both are
configurable under "Settings -> Shrink Vertically".
A small Kanboard plugin focused on the vertically-collapsed board view. It fixes the
collapse so the bottom horizontal scrollbar stays on screen, and can optionally add a
second mirrored scrollbar above the columns. Configurable under
"Settings -> Shrink Vertically".
Board drag/touch and column-gap options that used to live here have moved to the separate
`TweakDrag` plugin.
## The problem
@@ -73,14 +76,17 @@ ways.
## Settings
Go to "Settings -> Shrink Vertically":
These settings are global (per Kanboard instance) and admin-only. Go to
"Settings -> Shrink Vertically":
- **Vertical offset in pixels** -- pixels reserved around the collapsed columns. Stored in
the Kanboard configuration and injected in the page head as the `--sv-shrink-offset` CSS
variable. Increase it if the scrollbar is still clipped (for example with a taller theme
header); decrease it to make the collapsed columns taller. Default: 240.
- **Vertical offset in pixels** -- pixels reserved around the collapsed columns. Injected
in the page head as the `--sv-shrink-offset` CSS variable. Increase it if the scrollbar
is still clipped (for example with a taller theme header); decrease it to make the
collapsed columns taller. Default: 240.
- **Top Horizontal Scrollbar thickness in pixels** -- thickness of the top scrollbar
(Chromium/WebKit only). Injected as the `--sv-bar-size` CSS variable. Default: 25.
- **Add a top horizontal scrollbar to the board** -- toggles the mirrored top scrollbar
described above.
described above. Default: on.
## License

View File

@@ -13,6 +13,14 @@
</p>
</fieldset>
<fieldset>
<?= $this->form->label(t('Top Horizontal Scrollbar thickness in pixels'), 'shrink_vertically_bar_size') ?>
<?= $this->form->number('shrink_vertically_bar_size', $values, $errors) ?>
<p class="form-help">
<?= t('Thickness of the top horizontal scrollbar (Chromium/WebKit browsers only). Default: 25.') ?>
</p>
</fieldset>
<fieldset>
<?= $this->form->checkbox('shrink_vertically_top_scrollbar', t('Add a top horizontal scrollbar to the board'), 1, isset($values['shrink_vertically_top_scrollbar']) && $values['shrink_vertically_top_scrollbar'] == 1) ?>
<p class="form-help">

View File

@@ -1,3 +1,6 @@
<style type="text/css">
:root { --sv-shrink-offset: <?= (int) $this->app->config('shrink_vertically_offset', 240) ?>px; }
:root {
--sv-shrink-offset: <?= (int) $this->app->config('shrink_vertically_offset', 240) ?>px;
--sv-bar-size: <?= (int) $this->app->config('shrink_vertically_bar_size', 25) ?>px;
}
</style>

View File

@@ -1 +1 @@
ShrinkVertically v1.0
ShrinkVertically v1.3.1