feat(ui): add setting to keep the action bar visible while scrolling (#1095)

Adds a 'Keep Action Bar Visible' toggle (default off) under
Settings > Interface > Layout Settings. When enabled, the controls bar
(Refresh, Download, etc.) and the breadcrumb nav are wrapped in a shared
sticky container (.sticky-topbar) so both stay pinned as one unit; when
disabled, the wrapper is display: contents and the original behavior
(only the breadcrumb stays visible) is preserved.

static/css/layout.css

@@ -25,6 +25,23 @@
     box-shadow: var(--shadow-xs);
 }
 
+/* Wrapper around the controls bar and breadcrumb nav. With the sticky-controls
+   setting off it is transparent to layout (display: contents), preserving the
+   original behavior (only the breadcrumb stays visible). When enabled, the whole
+   wrapper sticks as one unit so the two bars can never drift apart. */
+.sticky-topbar {
+    display: contents;
+}
+
+body.sticky-controls .sticky-topbar {
+    display: block;
+    position: sticky;
+    top: 0;
+    z-index: calc(var(--z-header) - 1);
+    background: var(--bg-color);
+    box-shadow: var(--shadow-xs);
+}
+
 /* Responsive container for larger screens */
 @media (min-width: 2150px) {
     .container {

static/js/managers/SettingsManager.js

@@ -1047,6 +1047,12 @@ export class SettingsManager {
             groupByModelCheckbox.checked = !!state.global.settings.group_by_model;
         }
 
+        // Set sticky controls
+        const stickyControlsCheckbox = document.getElementById('stickyControls');
+        if (stickyControlsCheckbox) {
+            stickyControlsCheckbox.checked = !!state.global.settings.sticky_controls;
+        }
+
         // Set model name display setting
         const modelNameDisplaySelect = document.getElementById('modelNameDisplay');
         if (modelNameDisplaySelect) {
@@ -3396,6 +3402,10 @@ export class SettingsManager {
         const groupByModel = !!state.global.settings.group_by_model;
         document.body.classList.toggle('group-by-model', groupByModel);
 
+        // Apply sticky controls mode (keeps the action bar visible while scrolling)
+        const stickyControls = !!state.global.settings.sticky_controls;
+        document.body.classList.toggle('sticky-controls', stickyControls);
+
     }
 }
 

static/js/state/index.js

@@ -59,6 +59,7 @@ const DEFAULT_SETTINGS_BASE = Object.freeze({
     strip_lora_on_copy: false,
     use_new_license_icons: true,
     group_by_model: false,
+    sticky_controls: false,
     llm_provider: 'openai',
     llm_api_key: '',
     llm_api_base: '',