From 5712d055d3bd7b8927947d1d5d94c2568a92394a Mon Sep 17 00:00:00 2001
From: Ruben Carlo Benante <rcb@beco.cc>
Date: Sun, 28 Jun 2026 17:12:25 -0300
Subject: [PATCH] feature add top horizontal scroll bar done VERSION v1.0
 release

---
 Asset/css/shrink-vertically.css | 16 ++++++++++++++++
 Plugin.php                      |  9 ++++++++-
 README.md                       | 28 ++++++++++++++++++++++------
 Template/config/show.php        |  7 +++++++
 VERSION                         |  2 +-
 5 files changed, 54 insertions(+), 8 deletions(-)

diff --git a/Asset/css/shrink-vertically.css b/Asset/css/shrink-vertically.css
index b4452f7..ead79b8 100644
--- a/Asset/css/shrink-vertically.css
+++ b/Asset/css/shrink-vertically.css
@@ -32,3 +32,19 @@
     max-height: calc(100vh - var(--sv-shrink-offset, 240px)) !important;
     min-height: 0 !important;
 }
+
+/*
+ * Optional top horizontal scrollbar (added by Asset/js/top-scrollbar.js when the
+ * "Add a top horizontal scrollbar" setting is enabled). The inner element is given a
+ * width equal to the board's scrollable width by the script; overflow-x: auto then
+ * produces a scrollbar whose range mirrors the board's own bottom scrollbar. The 1px
+ * inner height keeps the bar to just the scrollbar itself.
+ */
+.sv-top-scroll {
+    overflow-x: auto;
+    overflow-y: hidden;
+}
+
+.sv-top-scroll-inner {
+    height: 1px;
+}
diff --git a/Plugin.php b/Plugin.php
index 1caf471..ea405cb 100644
--- a/Plugin.php
+++ b/Plugin.php
@@ -25,6 +25,13 @@ class Plugin extends Base
 
         // Add a "Shrink Vertically" entry to the Settings sidebar.
         $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) {
+            $this->hook->on('template:layout:js', array(
+                'template' => 'plugins/ShrinkVertically/Asset/js/top-scrollbar.js',
+            ));
+        }
     }
 
     public function getPluginName()
@@ -44,7 +51,7 @@ class Plugin extends Base
 
     public function getPluginVersion()
     {
-        return '0.4.0';
+        return '1.0.0';
     }
 
     public function getPluginHomepage()
diff --git a/README.md b/README.md
index 96e4f0e..bfde41b 100644
--- a/README.md
+++ b/README.md
@@ -1,7 +1,9 @@
 # ShrinkVertically -- keep the board horizontal scrollbar visible
 
-A tiny Kanboard plugin that fixes the vertically-collapsed board view so the bottom
-horizontal scrollbar stays on screen.
+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".
 
 ## The problem
 
@@ -59,12 +61,26 @@ Copy this folder into your Kanboard installation as `plugins/ShrinkVertically/`.
 directory name must be exactly `ShrinkVertically` (Kanboard derives the plugin namespace
 from the folder name). Reload the board; no build step, no configuration.
 
+## Top horizontal scrollbar (optional)
+
+Kanboard's board scrolls horizontally inside `#board-container`, so its only horizontal
+scrollbar is at the very bottom of the board -- on a wide board you must scroll all the
+way down to move sideways. Enable "Add a top horizontal scrollbar" in the settings to get
+a second, mirrored scrollbar just above the columns. A small script
+(`Asset/js/top-scrollbar.js`, loaded only when the option is on) inserts a dummy scroll
+strip above `#board-container` and keeps its scroll position in sync with the board both
+ways.
+
 ## Settings
 
-Go to "Settings -> Shrink Vertically" to set the pixel offset. The value is 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.
+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.
+- **Add a top horizontal scrollbar to the board** -- toggles the mirrored top scrollbar
+  described above.
 
 ## License
 
diff --git a/Template/config/show.php b/Template/config/show.php
index 7d6c982..29054ca 100644
--- a/Template/config/show.php
+++ b/Template/config/show.php
@@ -13,6 +13,13 @@
         </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">
+            <?= t('Adds a second horizontal scrollbar above the columns, mirrored with the board scrollbar, so you do not have to scroll to the bottom to move sideways.') ?>
+        </p>
+    </fieldset>
+
     <div class="form-actions">
         <button type="submit" class="btn btn-blue"><?= t('Save') ?></button>
     </div>
diff --git a/VERSION b/VERSION
index bf2c90e..0015e6f 100644
--- a/VERSION
+++ b/VERSION
@@ -1 +1 @@
-ShrinkVertically v0.4
+ShrinkVertically v1.0