Auto-adjust fits collapsed columns to the screen; dims manual offset (v1.6.0)

Template/config/show.php

@@ -11,6 +11,11 @@
         <p class="form-help">
             <?= t('Pixels reserved above and below the vertically collapsed board columns (page header, column header and the horizontal scrollbar). A larger value makes the columns shorter. Default: 240.') ?>
         </p>
+
+        <?= $this->form->checkbox('shrink_vertically_auto', t('Auto adjust (fit columns to the screen automatically)'), 1, isset($values['shrink_vertically_auto']) && $values['shrink_vertically_auto'] == 1, '', array('id' => 'form-shrink_vertically_auto')) ?>
+        <p class="form-help">
+            <?= t('When enabled, the collapsed column height is measured live on the board to fit the screen, so the right-side vertical scrollbar is not needed. The pixel offset above is then ignored (shown dimmed).') ?>
+        </p>
     </fieldset>
 
     <fieldset>
@@ -32,3 +37,23 @@
         <button type="submit" class="btn btn-blue"><?= t('Save') ?></button>
     </div>
 </form>
+
+<script>
+// Dim + disable the pixel-offset input while "Auto adjust" is checked (auto mode measures the height
+// live on the board, so the manual offset is inactive). Disabled inputs are not submitted; the
+// controller preserves the stored offset when it is absent, so the manual value is never lost.
+(function () {
+    "use strict";
+    var auto = document.getElementById("form-shrink_vertically_auto");
+    var offset = document.getElementById("form-shrink_vertically_offset");
+    if (! auto || ! offset) {
+        return;
+    }
+    function sync() {
+        offset.disabled = auto.checked;
+        offset.style.opacity = auto.checked ? "0.4" : "";
+    }
+    auto.addEventListener("change", sync);
+    sync();
+})();
+</script>