main panel positioning

Signed-off-by: Vladimir Mandic <mandic00@live.com>

CHANGELOG.md

@@ -7,6 +7,7 @@
   - add option: force dtype on load  
     use to force model components to override loading with desired dtype regardless of component config  
 - **UI**
+  - improve main panel positioning: portrait/landscape
   - StandardUI: marked as legacy
   - ModernUI: old txt2img and img2img tabs are marked as legacy and hidden by default
 - **Internal**
@@ -22,6 +23,7 @@
   - `ui` networks details scrollbars
   - `onnxruntime` handle invalid version
   - `onnxruntime` mark all import paths as non-critical
+  - `measure` handle current kanvas stage
 
 ## Update for 2026-06-16
 

TODO.md

@@ -27,6 +27,8 @@
 - Auto handle scheduler `prediction_type`
 - Cache models in memory
 - JSON image metadata
+- Remove `directml`
+- Remove `olive-ai`
 - Integrate natural language image search: [ImageDB](https://github.com/vladmandic/imagedb)
 - Unify *huggingface* and *diffusers* model folders
 

modules/ui_definitions.py

@@ -558,7 +558,6 @@ def create_settings(cmd_opts):
 
         'uiux_separator_appearance': OptionInfo("<h2>Appearance</h2>", "", gr.HTML),
         "uiux_grid_image_size": OptionInfo(150, "Grid image size", gr.Slider, {"minimum": 64, "maximum": 1024, "step": 1}),
-        "uiux_panel_min_width": OptionInfo(35, "Panel minimum width", gr.Number),
         "uiux_hide_legacy": OptionInfo(True, "Hide legacy tabs"),
         "uiux_persist_layout": OptionInfo(True, "Persist UI layout"),
         "uiux_no_slider_layout": OptionInfo(False, "Hide input range sliders"),

modules/ui_sections.py

@@ -99,7 +99,7 @@ def create_resolution_inputs(tab, default_width=1024, default_height=1024):
 
 
 def create_caption_button(tab: str, inputs: list | None = None, outputs: str | None = None, what: str = ''):
-    button_caption = gr.Button(ui_symbols.caption, elem_id=f"{tab}_caption_{what}", elem_classes=['caption'])
+    button_caption = gr.Button(ui_symbols.caption, elem_id=f"{tab}_caption_{what}", elem_classes=['caption', 'image-fit'])
     if inputs is not None and outputs is not None:
         button_caption.click(fn=caption.caption, inputs=inputs, outputs=[outputs])
     return button_caption

ui/css/sdnext.css

@@ -74,7 +74,7 @@
   --sd-text-font: 'IBM Plex Mono', monospace;
   --sd-button-font: 'NotoSans', sans-serif;
   --sd-image-fit: scale-down;
-  --sd-panel-min-width: 30em;
+  --sd-panel-min-width: 256px;
   --sd-grid-image-size: 150px;
 }
 
@@ -1596,6 +1596,10 @@ table.settings-value-table td {
   display: none !important;
 }
 
+.caption {
+  right: 6em;
+}
+
 #modelmerger_interp_description {
   margin-bottom: 1em;
   margin-top: 1em;

ui/dist/sdnext.mjs

@@ -11662,6 +11662,10 @@ function currentImageResolutionimg2img(_a, _b, scaleBy) {
   return img ? [img.naturalWidth, img.naturalHeight, scaleBy] : [0, 0, scaleBy];
 }
 function currentImageResolutioncontrol(_a, _b, scaleBy) {
+  if (window.kanvas) {
+    const active2 = window.kanvas.stages?.getActiveStage();
+    return [active2?.width || 0, active2?.height || 0, scaleBy];
+  }
   const img = gradioApp().querySelector('#control-tab-input > div[style="display: block;"] img');
   return img ? [img.naturalWidth, img.naturalHeight, scaleBy] : [0, 0, scaleBy];
 }
@@ -15908,7 +15912,6 @@ async function initStartup() {
   startupPromises.push(Promise.resolve(applyStyles()));
   startupPromises.push(Promise.resolve(initIndexDB()));
   startupPromises.push(Promise.resolve(initTableSorter()));
-  log("HERE", window.opts.theme_type);
   if (window.opts.theme_type !== "Modern") addLegacyNotice();
   const t1 = performance.now();
   log("initStartup", Math.round(1e3 * (t1 - t0) / 1e6));

ui/startup.ts

@@ -108,7 +108,6 @@ async function initStartup() {
   startupPromises.push(Promise.resolve(initIndexDB()));
   startupPromises.push(Promise.resolve(initTableSorter()));
 
-  log('HERE', window.opts.theme_type);
   if (window.opts.theme_type !== 'Modern') addLegacyNotice();
 
   const t1 = performance.now();

ui/ui.ts

@@ -702,6 +702,10 @@ function currentImageResolutionimg2img(_a, _b, scaleBy) {
 }
 
 function currentImageResolutioncontrol(_a, _b, scaleBy) {
+  if (window.kanvas) {
+    const active = window.kanvas.stages?.getActiveStage();
+    return [active?.width || 0, active?.height || 0, scaleBy];
+  }
   const img = gradioApp().querySelector('#control-tab-input > div[style="display: block;"] img');
   return img ? [img.naturalWidth, img.naturalHeight, scaleBy] : [0, 0, scaleBy];
 }