From bda2ecdbf58fd33b4ad3036ed5cc13eef02747ae Mon Sep 17 00:00:00 2001
From: AUTOMATIC1111 <16777216c@gmail.com>
Date: Fri, 3 Nov 2023 19:44:57 +0300
Subject: [PATCH 01/16] Merge pull request #13839 from
 AUTOMATIC1111/httpx==0.24.1

requirements_versions httpx==0.24.1
---
 requirements_versions.txt | 1 +
 1 file changed, 1 insertion(+)

diff --git a/requirements_versions.txt b/requirements_versions.txt
index f8ae1f385ae..e84bd4270a8 100644
--- a/requirements_versions.txt
+++ b/requirements_versions.txt
@@ -29,3 +29,4 @@ torch
 torchdiffeq==0.2.3
 torchsde==0.2.5
 transformers==4.30.2
+httpx==0.24.1

From 4afaaf8a020c1df457bcf7250cb1c7f609699fa7 Mon Sep 17 00:00:00 2001
From: AUTOMATIC1111 <16777216c@gmail.com>
Date: Fri, 3 Nov 2023 19:50:14 +0300
Subject: [PATCH 02/16] add changelog entry

---
 CHANGELOG.md | 5 +++++
 1 file changed, 5 insertions(+)

diff --git a/CHANGELOG.md b/CHANGELOG.md
index 1cd3572c8e0..2c72359fc42 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -1,3 +1,8 @@
+## 1.6.1
+
+### Bug Fixes:
+ * fix an error causing the webui to fail to start ([#13839](https://github.com/AUTOMATIC1111/stable-diffusion-webui/pull/13839))
+
 ## 1.6.0
 
 ### Features:

From e4b4ff9fadc5d8abaff031038f2eddd75cadd0fc Mon Sep 17 00:00:00 2001
From: anapnoe <124302297+anapnoe@users.noreply.github.com>
Date: Fri, 3 Nov 2023 21:05:28 +0200
Subject: [PATCH 03/16] show labels for aside, main, page tabs option setting

---
 .../html/templates/template-app-root.html     |  1 +
 .../template-aside-extra-networks.html        |  6 ++-
 .../templates/template-extras-params.html     |  2 +-
 .../templates/template-img2img-params.html    |  2 +-
 .../html/templates/template-train-params.html |  2 +-
 .../templates/template-txt2img-params.html    |  2 +-
 .../javascript/anapnoe_sd_uiux_core.js        | 44 ++++++++++++++++++-
 .../scripts/anapnoe_sd_uiux.py                |  4 +-
 extensions-builtin/anapnoe-sd-uiux/style.css  | 24 ++++++++++
 9 files changed, 79 insertions(+), 8 deletions(-)

diff --git a/extensions-builtin/anapnoe-sd-uiux/html/templates/template-app-root.html b/extensions-builtin/anapnoe-sd-uiux/html/templates/template-app-root.html
index 78e5e3fecdb..77cb68065cc 100644
--- a/extensions-builtin/anapnoe-sd-uiux/html/templates/template-app-root.html
+++ b/extensions-builtin/anapnoe-sd-uiux/html/templates/template-app-root.html
@@ -9,6 +9,7 @@
                         <polygon
                             points="17.3,11.7 15.8,11.7 20.2,19.3 3.8,19.3 12,5.2 14.2,9 15.8,9 12,2.5 1.5,20.7 22.5,20.7 	" />
                     </svg>
+                    <span>Anapnoe</span>
                 </button>
             </div>
             <div id="main_nav_content" class="layout-content">
diff --git a/extensions-builtin/anapnoe-sd-uiux/html/templates/template-aside-extra-networks.html b/extensions-builtin/anapnoe-sd-uiux/html/templates/template-aside-extra-networks.html
index 2a70aef9efa..a2a5ce9da1f 100644
--- a/extensions-builtin/anapnoe-sd-uiux/html/templates/template-aside-extra-networks.html
+++ b/extensions-builtin/anapnoe-sd-uiux/html/templates/template-aside-extra-networks.html
@@ -1,6 +1,6 @@
 <div id="accordion-aside" iconTrigger="#mask-icon-acc-arrow" class="accordion accordion-vertical no-drag">
     <div class="accordion-bar">
-		<button id="ae-button" class="ae-button">
+		<button id="acc-arrow-button" class="ae-button">
 			<div id="mask-icon-acc-arrow" class="mask-icon accordion-icon icon-arrow-down">
 			</div>
 		</button>
@@ -10,24 +10,28 @@
 				<a title="Use via API" target="_blank" href="/docs" >
 					<div title ="Use via API" class="mask-icon icon-rocket">			
 					</div>
+                    <span>Use via API</span>
 				</a>
 			</button>
 			<button class="ae-button">
 				<a title="Github" target="_blank" href="https://github.com/anapnoe/stable-diffusion-webui-ux">
 					<div class="mask-icon icon-github">			
 					</div>
+                    <span>Github</span>
 				</a>
 			</button>
 			<button class="ae-button">
 				<a title="Gradio" target="_blank" href="https://gradio.app" >
 					<div class="mask-icon icon-gradio">			
 					</div>
+                    <span>Gradio</span>
 				</a>
 			</button>
 			<button class="ae-button">
 				<a title="Reload UI" href="/" onclick="javascript:gradioApp().getElementById('settings_restart_gradio').click(); return false">
 					<div class="mask-icon icon-reload">			
 					</div>
+                    <span>Reload UI</span>
 				</a>
 			</button>
 			<div class="flexbox col spacer-v">
diff --git a/extensions-builtin/anapnoe-sd-uiux/html/templates/template-extras-params.html b/extensions-builtin/anapnoe-sd-uiux/html/templates/template-extras-params.html
index ad35a05c6f4..b48933603be 100644
--- a/extensions-builtin/anapnoe-sd-uiux/html/templates/template-extras-params.html
+++ b/extensions-builtin/anapnoe-sd-uiux/html/templates/template-extras-params.html
@@ -10,7 +10,7 @@
                 <button title="Extras Results" tabItemId="#extras_results_mobile_tabitem" tabGroup="extras" id="extras_results_mobile" class="xtabs-tab mobile">
                     <div class="mask-icon icon-results">
                     </div>
-                    <span>Extras Results</span>
+                    <span>Results</span>
                 </button>
             </div>
             <div class="flexbox row flex-end">
diff --git a/extensions-builtin/anapnoe-sd-uiux/html/templates/template-img2img-params.html b/extensions-builtin/anapnoe-sd-uiux/html/templates/template-img2img-params.html
index f4c548d88b2..9db9c8fd63f 100644
--- a/extensions-builtin/anapnoe-sd-uiux/html/templates/template-img2img-params.html
+++ b/extensions-builtin/anapnoe-sd-uiux/html/templates/template-img2img-params.html
@@ -30,7 +30,7 @@
                 <button title="img2img Results" tabItemId="#img2img_results_mobile_tabitem" tabGroup="img2img" id="img2img_results_mobile" class="xtabs-tab mobile">
                     <div class="mask-icon icon-results">
                     </div>
-                    <span>img2img Results</span>
+                    <span>Results</span>
                 </button>
              <!--    <button tabItemId="#img2img_temp_tabitem" tabGroup="img2img" class="xtabs-tab">
                     <div id="mask-icon-28i" class="mask-icon icon-bug">
diff --git a/extensions-builtin/anapnoe-sd-uiux/html/templates/template-train-params.html b/extensions-builtin/anapnoe-sd-uiux/html/templates/template-train-params.html
index b17180d8022..0e7d558cfbb 100644
--- a/extensions-builtin/anapnoe-sd-uiux/html/templates/template-train-params.html
+++ b/extensions-builtin/anapnoe-sd-uiux/html/templates/template-train-params.html
@@ -10,7 +10,7 @@
                 <button title="train Results" tabItemId="#train_results_mobile_tabitem" tabGroup="train" id="train_results_mobile" class="xtabs-tab mobile">
                     <div class="mask-icon icon-results">
                     </div>
-                    <span>Train Results</span>
+                    <span>Results</span>
                 </button>
             </div>
             
diff --git a/extensions-builtin/anapnoe-sd-uiux/html/templates/template-txt2img-params.html b/extensions-builtin/anapnoe-sd-uiux/html/templates/template-txt2img-params.html
index ed6bc1d8713..d452bc8d68e 100644
--- a/extensions-builtin/anapnoe-sd-uiux/html/templates/template-txt2img-params.html
+++ b/extensions-builtin/anapnoe-sd-uiux/html/templates/template-txt2img-params.html
@@ -26,7 +26,7 @@
                 <button title="txt2img Results" tabItemId="#txt2img_results_mobile_tabitem" tabGroup="txt2img" id="txt2img_results_mobile" class="xtabs-tab mobile">
                     <div class="mask-icon icon-results">
                     </div>
-                    <span>txt2img Results</span>
+                    <span>Results</span>
                 </button>
                <!--  <button tabItemId="#txt2img_temp_tabitem" tabGroup="txt2img" class="xtabs-tab">
                     <div class="mask-icon icon-bug">
diff --git a/extensions-builtin/anapnoe-sd-uiux/javascript/anapnoe_sd_uiux_core.js b/extensions-builtin/anapnoe-sd-uiux/javascript/anapnoe_sd_uiux_core.js
index 8f5030a1812..b3bd9045589 100644
--- a/extensions-builtin/anapnoe-sd-uiux/javascript/anapnoe_sd_uiux_core.js
+++ b/extensions-builtin/anapnoe-sd-uiux/javascript/anapnoe_sd_uiux_core.js
@@ -1024,9 +1024,46 @@ function initDefaultComponents(content_div) {
     });
 
     uiux_no_slider_layout(window.opts.uiux_no_slider_layout);
-    
+
+    function uiux_show_labels_aside(value) {
+        if (value) {
+            anapnoe_app.classList.add("aside-labels");
+        } else {
+            anapnoe_app.classList.remove("aside-labels");
+        }
+    }
+    gradioApp().querySelector("#setting_uiux_show_labels_aside input").addEventListener("click", function (e) {
+        uiux_show_labels_aside(e.target.checked, true);
+    });
+    uiux_show_labels_aside(window.opts.uiux_show_labels_aside);
 
 
+    function uiux_show_labels_main(value) {
+        if (value) {
+            anapnoe_app.classList.add("main-labels");
+        } else {
+            anapnoe_app.classList.remove("main-labels");
+        }
+    }
+    gradioApp().querySelector("#setting_uiux_show_labels_main input").addEventListener("click", function (e) {
+        uiux_show_labels_main(e.target.checked, true);
+    });
+    uiux_show_labels_main(window.opts.uiux_show_labels_main);
+
+
+    function uiux_show_labels_tabs(value) {
+        if (value) {
+            anapnoe_app.classList.add("tab-labels");
+        } else {
+            anapnoe_app.classList.remove("tab-labels");
+        }
+    }
+    gradioApp().querySelector("#setting_uiux_show_labels_tabs input").addEventListener("click", function (e) {
+        uiux_show_labels_tabs(e.target.checked, true);
+    });
+    uiux_show_labels_tabs(window.opts.uiux_show_labels_tabs);
+    
+
 	// try to attach Logger Screen to main before full UIUXReady
 	const asideconsole = document.querySelector("#layout-console-log");
 	asideconsole.append(loggerUiUx);
@@ -1307,7 +1344,10 @@ function setupLogger() {
     console.log("Show ticks for input range slider: ", window.opts.uiux_show_input_range_ticks);
     console.log("Default layout: ", window.opts.uiux_default_layout);
     console.log("Disable transitions: ", window.opts.uiux_disable_transitions);
-    
+    console.log("Aside labels: ", window.opts.uiux_show_labels_aside);
+    console.log("Main labels: ", window.opts.uiux_show_labels_main);
+    console.log("Tabs labels: ", window.opts.uiux_show_labels_tabs);
+
 
 	const isFirefox = navigator.userAgent.toLowerCase().includes('firefox');
 	if(isFirefox){
diff --git a/extensions-builtin/anapnoe-sd-uiux/scripts/anapnoe_sd_uiux.py b/extensions-builtin/anapnoe-sd-uiux/scripts/anapnoe_sd_uiux.py
index 19b4462442b..6d3871add35 100644
--- a/extensions-builtin/anapnoe-sd-uiux/scripts/anapnoe_sd_uiux.py
+++ b/extensions-builtin/anapnoe-sd-uiux/scripts/anapnoe_sd_uiux.py
@@ -14,7 +14,9 @@
     "uiux_disable_transitions": shared.OptionInfo(False, "Disable transitions"),
     "uiux_default_layout": shared.OptionInfo("Auto", "Layout", gr.Radio, {"choices": ["Auto","Desktop", "Mobile"]}),    
     "uiux_ignore_overrides": shared.OptionInfo([], "Ignore Overrides", gr.CheckboxGroup, lambda: {"choices": [x[0] for x in infotext_to_setting_name_mapping]}),
-    
+    "uiux_show_labels_aside": shared.OptionInfo(False, "Show labels for aside tabs"),
+    "uiux_show_labels_main": shared.OptionInfo(False, "Show labels for main tabs"),
+    "uiux_show_labels_tabs": shared.OptionInfo(False, "Show labels for page tabs"),
  }))
 
 
diff --git a/extensions-builtin/anapnoe-sd-uiux/style.css b/extensions-builtin/anapnoe-sd-uiux/style.css
index 20d2c5c77b7..4ceeafcd676 100644
--- a/extensions-builtin/anapnoe-sd-uiux/style.css
+++ b/extensions-builtin/anapnoe-sd-uiux/style.css
@@ -2936,6 +2936,9 @@ iframe{
     padding: 0;
     background-color: transparent;
     line-height: 0;
+    display: flex;
+    align-items: center;
+    gap: 5px;
 }
 
 div#workspaces_tabitem > div {
@@ -3208,6 +3211,7 @@ input[type="checkbox"] {
     }
 }
 
+#sidebar_secondary_tabs a span,
 .default-desktop .mobile,
 .default-auto .mobile{
     display:none;
@@ -3226,6 +3230,26 @@ input[type="checkbox"] {
 #img2img_results_generate_tabitem .generate{
     flex-grow: 1;
 }
+.aside-labels #sidebar_secondary_tabs a span,
+.main-labels #main-nav .xtabs-tab span,
+.tab-labels [id$="2img_header"] span ,
+.aside-labels #accordion-aside .xtabs-tab span {
+    display: flex !important;
+}
+.main-labels #main-nav .xtabs-tab,
+.tab-labels [id$="2img_header"] .xtabs-tab,
+.aside-labels #accordion-aside .xtabs-tab {
+    justify-content: flex-start;
+}
+#acc-arrow-button,
+.aside-labels .accordion-bar > div{
+    width:100%;
+}
+
+.aside-labels div#sidebar_secondary_tabs button {
+    width: 100%;
+    justify-content: flex-start;
+}
 
 @media (max-width: 768px) {
     .xtabs-tab span {

From fa279663b09cff44c8ac5a07112621b8986d5e9a Mon Sep 17 00:00:00 2001
From: anapnoe <124302297+anapnoe@users.noreply.github.com>
Date: Sat, 4 Nov 2023 00:38:37 +0200
Subject: [PATCH 04/16] refactor option settings

---
 .../javascript/anapnoe_sd_uiux_core.js        | 57 +++++++++----------
 1 file changed, 28 insertions(+), 29 deletions(-)

diff --git a/extensions-builtin/anapnoe-sd-uiux/javascript/anapnoe_sd_uiux_core.js b/extensions-builtin/anapnoe-sd-uiux/javascript/anapnoe_sd_uiux_core.js
index b3bd9045589..aba55757d5f 100644
--- a/extensions-builtin/anapnoe-sd-uiux/javascript/anapnoe_sd_uiux_core.js
+++ b/extensions-builtin/anapnoe-sd-uiux/javascript/anapnoe_sd_uiux_core.js
@@ -576,33 +576,16 @@ function onUiUxReady(content_div){
 
 
 			setupGenerateObservers();
-
-			localStorage.setItem('UiUxComplete', true);
+            uiuxOptionSettings();
 
 			//const main_nav_content = document.querySelector('#main_nav_content');
 			//const sidebar_tabs = document.querySelector('#sidebar_tabs');
 			//main_nav_content.append(sidebar_tabs);
-			showContributors()
-
-            // sd max resolution output
-            function sdMaxOutputResolution(value) {
-                gradioApp().querySelectorAll('[id$="2img_width"] input,[id$="2img_height"] input').forEach((elem) => {
-                    elem.max = value;
-                })
-            }
-            gradioApp().querySelector("#setting_uiux_max_resolution_output").addEventListener('input', function (e) {
-                let intvalue = parseInt(e.target.value);
-                intvalue = Math.min(Math.max(intvalue, 512), 16384);
-                sdMaxOutputResolution(intvalue);					
-            })	
-            sdMaxOutputResolution(window.opts.uiux_max_resolution_output);
-
+			showContributors()           
             switchMobile();
+            
+            localStorage.setItem('UiUxComplete', true);
 			
-
-
-			
-
 		}
 	}, 500); 
 
@@ -651,8 +634,6 @@ function setupGenerateObservers(){
 
 }
 
-
-
 function initDefaultComponents(content_div) {
 	const anapnoe_app = document.querySelector(anapnoe_app_id);
 	content_div.querySelectorAll(`div.split`).forEach((el) => {
@@ -935,6 +916,30 @@ function initDefaultComponents(content_div) {
 
 	});
 
+
+	// try to attach Logger Screen to main before full UIUXReady
+	const asideconsole = document.querySelector("#layout-console-log");
+	asideconsole.append(loggerUiUx);
+	document.querySelector("#logger_screen")?.remove();
+
+
+}
+
+function uiuxOptionSettings(){
+
+    // sd max resolution output
+    function sdMaxOutputResolution(value) {
+        gradioApp().querySelectorAll('[id$="2img_width"] input,[id$="2img_height"] input').forEach((elem) => {
+            elem.max = value;
+        })
+    }
+    gradioApp().querySelector("#setting_uiux_max_resolution_output").addEventListener('input', function (e) {
+        let intvalue = parseInt(e.target.value);
+        intvalue = Math.min(Math.max(intvalue, 512), 16384);
+        sdMaxOutputResolution(intvalue);					
+    })	
+    sdMaxOutputResolution(window.opts.uiux_max_resolution_output);
+
 	// step ticks for performant input range
 	function uiux_show_input_range_ticks(value, interactive) {
 		if (value) {
@@ -1064,12 +1069,6 @@ function initDefaultComponents(content_div) {
     uiux_show_labels_tabs(window.opts.uiux_show_labels_tabs);
     
 
-	// try to attach Logger Screen to main before full UIUXReady
-	const asideconsole = document.querySelector("#layout-console-log");
-	asideconsole.append(loggerUiUx);
-	document.querySelector("#logger_screen")?.remove();
-
-
 }
 
 function setupOnLoadResources() {

From 815d6899739d77882a16c3503bf7a2e7d8cb6e6c Mon Sep 17 00:00:00 2001
From: anapnoe <124302297+anapnoe@users.noreply.github.com>
Date: Sat, 4 Nov 2023 01:32:55 +0200
Subject: [PATCH 05/16] fix alt-enter, control-enter key shortcuts for txt2img
 and img2img prompts

---
 .../javascript/anapnoe_sd_uiux_core.js             | 14 +++++++++-----
 1 file changed, 9 insertions(+), 5 deletions(-)

diff --git a/extensions-builtin/anapnoe-sd-uiux/javascript/anapnoe_sd_uiux_core.js b/extensions-builtin/anapnoe-sd-uiux/javascript/anapnoe_sd_uiux_core.js
index aba55757d5f..a389deba7b4 100644
--- a/extensions-builtin/anapnoe-sd-uiux/javascript/anapnoe_sd_uiux_core.js
+++ b/extensions-builtin/anapnoe-sd-uiux/javascript/anapnoe_sd_uiux_core.js
@@ -51,6 +51,15 @@ window.extraNetworksEditUserMetadata = function(event, tabname, extraPage, cardN
     //event.stopPropagation();
 }
 
+window.get_uiCurrentTabContent = function(){
+    //console.log(active_main_tab);
+    if(active_main_tab.id === "tab_txt2img"){
+        return document.getElementById("txt2img_tabitem");
+    }else if(active_main_tab.id === "tab_img2img"){
+        return document.getElementById("img2img_tabitem");
+    }
+}
+
 async function getContributors(repoName, page = 1) {  
     let request = await fetch(`https://api.github.com/repos/${repoName}/contributors?per_page=100&page=${page}`, {
         method: 'GET',
@@ -159,9 +168,7 @@ function mainTabs(element, tab) {
 		ntab.style.display = 'block';
 		//console.log(tab, ntab);
 		active_main_tab = ntab;
-
 	}
-	
 }
 
 function setAttrSelector(parent_elem, content_div, count, index, length) {
@@ -818,9 +825,6 @@ function initDefaultComponents(content_div) {
 			el.classList.add('active');
 			callToAction(el, tids, pid);
 
-           
-
-
 		});
 
 		const active = el.getAttribute("active");

From 1a968141aeb271b7c308bf0e80a0daa540021aad Mon Sep 17 00:00:00 2001
From: anapnoe <124302297+anapnoe@users.noreply.github.com>
Date: Sat, 4 Nov 2023 04:59:58 +0200
Subject: [PATCH 06/16] remove debounce from window resize event

---
 .../javascript/anapnoe_sd_uiux_core.js             | 14 +++++++++++---
 1 file changed, 11 insertions(+), 3 deletions(-)

diff --git a/extensions-builtin/anapnoe-sd-uiux/javascript/anapnoe_sd_uiux_core.js b/extensions-builtin/anapnoe-sd-uiux/javascript/anapnoe_sd_uiux_core.js
index a389deba7b4..9e847bb088b 100644
--- a/extensions-builtin/anapnoe-sd-uiux/javascript/anapnoe_sd_uiux_core.js
+++ b/extensions-builtin/anapnoe-sd-uiux/javascript/anapnoe_sd_uiux_core.js
@@ -98,13 +98,15 @@ const anapnoe_app_id = "#anapnoe_app";
 function detectMobile() {
     return ( ( window.innerWidth <= 768 ) );//&& ( window.innerHeight <= 600 ) );
 }
+/* 
 function debounce(func){
     var timer;
     return function(event){
       if(timer) clearTimeout(timer);
       timer = setTimeout(func,100,event);
     };
-}
+} 
+*/
 
 function applyDefaultLayout(isMobile){
     anapnoe_app.querySelectorAll("[mobile]").forEach((tabItem) => {   
@@ -140,10 +142,16 @@ function switchMobile(){
     //console.log(optslayout);
     anapnoe_app.classList.add(`default-${optslayout.toLowerCase()}`);
     if(optslayout === "Auto"){           
-        window.addEventListener("resize",debounce(function(e){
+        /*  
+        window.addEventListener("resize", debounce(function(e){
             const isMobile = detectMobile();
             applyDefaultLayout(isMobile);
-        }));
+        })); 
+        */
+        window.addEventListener('resize', function(event){
+            const isMobile = detectMobile();
+            applyDefaultLayout(isMobile);
+        });
         applyDefaultLayout(detectMobile());
     }else if(optslayout === "Mobile"){
         applyDefaultLayout(true);

From 9d387f4de01d6724b2b4fbd781a0987ed8569a80 Mon Sep 17 00:00:00 2001
From: anapnoe <124302297+anapnoe@users.noreply.github.com>
Date: Mon, 6 Nov 2023 10:41:48 +0200
Subject: [PATCH 07/16] added ignore overrides option setting

---
 .../templates/template-img2img-params.html    |  2 +-
 .../html/templates/template-pnginfo.html      |  2 +-
 .../templates/template-txt2img-params.html    |  2 +-
 .../javascript/anapnoe_sd_uiux_core.js        | 35 +++++++++++++++----
 .../scripts/anapnoe_sd_uiux.py                | 10 +++---
 extensions-builtin/anapnoe-sd-uiux/style.css  | 15 ++++++--
 6 files changed, 50 insertions(+), 16 deletions(-)

diff --git a/extensions-builtin/anapnoe-sd-uiux/html/templates/template-img2img-params.html b/extensions-builtin/anapnoe-sd-uiux/html/templates/template-img2img-params.html
index 9db9c8fd63f..e9b2606c732 100644
--- a/extensions-builtin/anapnoe-sd-uiux/html/templates/template-img2img-params.html
+++ b/extensions-builtin/anapnoe-sd-uiux/html/templates/template-img2img-params.html
@@ -319,7 +319,7 @@
                         </div>
                         <div data-selector="#img2img_enable" data-parent-selector="#tab_img2img" class="portal">
                         </div>
-                        <div data-selector="#img2img_override_settings_row" data-parent-selector="#tab_img2img" class="portal no-padding no-bg hide-empty">
+                        <div data-selector="#img2img_override_settings" data-parent-selector="#tab_img2img" class="portal no-padding no-bg hide-empty">
                         </div>
 						<div data-selector="#layout-img2img .gradio-accordion:has( div[id^='setting_'])" data-parent-selector="gradio-app" class="portal hide-empty">
                         </div>
diff --git a/extensions-builtin/anapnoe-sd-uiux/html/templates/template-pnginfo.html b/extensions-builtin/anapnoe-sd-uiux/html/templates/template-pnginfo.html
index f77ab7cb5bc..78a20c0fb47 100644
--- a/extensions-builtin/anapnoe-sd-uiux/html/templates/template-pnginfo.html
+++ b/extensions-builtin/anapnoe-sd-uiux/html/templates/template-pnginfo.html
@@ -1,7 +1,7 @@
 <div id="layout-pnginfo-group" class="flexbox col">
 	<div id="layout-pnginfo" class="layout">
 	  <div class="layout-header">
-		<div id="flexbox-10" class="flexbox row panel icons-bar center no-padding">
+		<div id="pnginfo_send_buttons" class="flexbox row panel icons-bar center no-padding">
 		<button id="ae-button-e77" class="ae-button" data-click="#txt2img_nav, #txt2img_params">
 		  <div id="portal-26" data-selector="#txt2img_tab" data-parent-selector="#tab_pnginfo" droppable="true" class="portal invisible">
 			<div id="icon-2" class="mask-icon icon-2txt2img">
diff --git a/extensions-builtin/anapnoe-sd-uiux/html/templates/template-txt2img-params.html b/extensions-builtin/anapnoe-sd-uiux/html/templates/template-txt2img-params.html
index d452bc8d68e..3b39c66cdc5 100644
--- a/extensions-builtin/anapnoe-sd-uiux/html/templates/template-txt2img-params.html
+++ b/extensions-builtin/anapnoe-sd-uiux/html/templates/template-txt2img-params.html
@@ -235,7 +235,7 @@
                                 </div>
                                 <div data-selector="#txt2img_hr" data-parent-selector="#tab_txt2img" class="portal">
                                 </div>
-                                <div data-selector="#txt2img_override_settings_row" data-parent-selector="#tab_txt2img" class="portal no-padding no-bg hide-empty">
+                                <div data-selector="#txt2img_override_settings" data-parent-selector="#tab_txt2img" class="portal no-padding no-bg hide-empty">
                                 </div>
 								<div data-selector="#layout-txt2img  .gradio-accordion:has( div[id^='setting_'])" data-parent-selector="gradio-app"
                                     class="portal hide-empty">
diff --git a/extensions-builtin/anapnoe-sd-uiux/javascript/anapnoe_sd_uiux_core.js b/extensions-builtin/anapnoe-sd-uiux/javascript/anapnoe_sd_uiux_core.js
index 9e847bb088b..30241e8566a 100644
--- a/extensions-builtin/anapnoe-sd-uiux/javascript/anapnoe_sd_uiux_core.js
+++ b/extensions-builtin/anapnoe-sd-uiux/javascript/anapnoe_sd_uiux_core.js
@@ -991,9 +991,9 @@ function uiuxOptionSettings(){
 	uiux_show_input_range_ticks(window.opts.uiux_show_input_range_ticks);
 
 
-    /* function remove_overrides(){	
+    function remove_overrides(){	
 		let checked_overrides = [];
-		gradioApp().querySelectorAll("#setting_ignore_overrides input").forEach(function (elem, i){
+		gradioApp().querySelectorAll("#setting_uiux_ignore_overrides input").forEach(function (elem, i){
 			if(elem.checked){
 				checked_overrides[i] = elem.nextElementSibling.innerHTML;
 			}			
@@ -1005,7 +1005,7 @@ function uiuxOptionSettings(){
 			let token_value = token_arr[1];
 			token_value = token_value.replaceAll(" ", "");	
 			
-			if(token_name.indexOf("Model hash") != -1){
+			/* if(token_name.indexOf("Model hash") != -1){
 				const info_label = gradioApp().querySelector("[id$='2img_override_settings'] label span");
 				info_label.innerHTML = "Override settings MDL: unknown";
 				for (let m=0; m<sdCheckpointModels.length; m++) {						
@@ -1015,7 +1015,7 @@ function uiuxOptionSettings(){
 						break;
 					}
 				}	
-			}
+			} */
 			if(checked_overrides.indexOf(token_name) != -1){				
 				token.querySelector(".token-remove").click();
 				gradioApp().querySelector("[id$='2img_override_settings']").classList.add("show");				
@@ -1024,9 +1024,31 @@ function uiuxOptionSettings(){
 			}			
 		})
 	}
-	gradioApp().querySelector("#setting_ignore_overrides").addEventListener('click', function (e) {
+	gradioApp().querySelector("#setting_uiux_ignore_overrides").addEventListener('click', function (e) {
 		setTimeout(function() { remove_overrides(); }, 100);		
-	}) */
+	})
+    /*     
+    gradioApp().querySelectorAll("#pnginfo_send_buttons button, #paste").forEach(function (elem) {
+      elem.addEventListener("click", function (e) {     
+        setTimeout(function () {
+            remove_overrides();
+        }, 500);
+      });
+    }); 
+    */
+    const overrides_observer = new MutationObserver(function(mutations) {
+        mutations.forEach(function(mutation) {
+            if(mutation.addedNodes){
+                //console.log(mutation.addedNodes.length + ' nodes added');
+                setTimeout(function() { remove_overrides(); }, 100);
+            }
+        });
+    });
+    
+    gradioApp().querySelectorAll("#txt2img_override_settings .wrap-inner, #img2img_override_settings .wrap_inner").forEach(function (elem) {
+        overrides_observer.observe(elem, { childList: true });
+    }); 
+    
 
     function uiux_no_slider_layout(value) {
         if (value) {
@@ -1358,6 +1380,7 @@ function setupLogger() {
     console.log("Aside labels: ", window.opts.uiux_show_labels_aside);
     console.log("Main labels: ", window.opts.uiux_show_labels_main);
     console.log("Tabs labels: ", window.opts.uiux_show_labels_tabs);
+ 
 
 
 	const isFirefox = navigator.userAgent.toLowerCase().includes('firefox');
diff --git a/extensions-builtin/anapnoe-sd-uiux/scripts/anapnoe_sd_uiux.py b/extensions-builtin/anapnoe-sd-uiux/scripts/anapnoe_sd_uiux.py
index 6d3871add35..7900b3652b5 100644
--- a/extensions-builtin/anapnoe-sd-uiux/scripts/anapnoe_sd_uiux.py
+++ b/extensions-builtin/anapnoe-sd-uiux/scripts/anapnoe_sd_uiux.py
@@ -3,9 +3,8 @@
 import gradio as gr
 import modules.scripts as scripts
 from modules import script_callbacks, shared
-from modules.generation_parameters_copypaste import infotext_to_setting_name_mapping
-
 
+mapping = [(info.infotext, k) for k, info in shared.opts.data_labels.items() if info.infotext]
 shared.options_templates.update(shared.options_section(('uiux_core', "Anapnoe UI-UX"), {
     "uiux_enable_console_log": shared.OptionInfo(False, "Enable console log"),
     "uiux_max_resolution_output": shared.OptionInfo(2048, "Max resolution output for txt2img and img2img"),
@@ -13,11 +12,11 @@
     "uiux_no_slider_layout": shared.OptionInfo(False, "No input range sliders"),
     "uiux_disable_transitions": shared.OptionInfo(False, "Disable transitions"),
     "uiux_default_layout": shared.OptionInfo("Auto", "Layout", gr.Radio, {"choices": ["Auto","Desktop", "Mobile"]}),    
-    "uiux_ignore_overrides": shared.OptionInfo([], "Ignore Overrides", gr.CheckboxGroup, lambda: {"choices": [x[0] for x in infotext_to_setting_name_mapping]}),
     "uiux_show_labels_aside": shared.OptionInfo(False, "Show labels for aside tabs"),
     "uiux_show_labels_main": shared.OptionInfo(False, "Show labels for main tabs"),
     "uiux_show_labels_tabs": shared.OptionInfo(False, "Show labels for page tabs"),
- }))
+    "uiux_ignore_overrides": shared.OptionInfo([], "Ignore Overrides", gr.CheckboxGroup, lambda: {"choices": list(mapping)})
+}))
 
 
 basedir = scripts.basedir() 
@@ -78,7 +77,10 @@ def get_files(folder, file_filter=[], file_list=[], split=False):
 
 def on_ui_tabs():
 
+    #print(mapping)
+
     with gr.Blocks(analytics_enabled=False) as anapnoe_sd_uiux_core: 
+        #override_settings = gr.CheckboxGroup(label="Ignore override settings", elem_id="ignore_overrides", choices=list(mapping))
         """ with gr.Row():
             with gr.Column(): 
                 with gr.Row():            
diff --git a/extensions-builtin/anapnoe-sd-uiux/style.css b/extensions-builtin/anapnoe-sd-uiux/style.css
index 4ceeafcd676..e6db658b854 100644
--- a/extensions-builtin/anapnoe-sd-uiux/style.css
+++ b/extensions-builtin/anapnoe-sd-uiux/style.css
@@ -431,6 +431,7 @@ body {
     outline: none;
 }
 
+*.gradio-checkboxgroup label,
 *.gradio-radio label {
     display: flex;
     align-items: center;
@@ -450,19 +451,19 @@ body {
     margin: 0;
     min-height: var(--ae-input-height);
 }
-
+*.gradio-checkboxgroup span,
 *.gradio-radio label span {
     margin: 0;
     white-space: nowrap;
     border: 0;
 }
-
+*.gradio-checkboxgroup .wrap,
 *.gradio-radio .wrap {
     gap: 5px;
     display: flex;
     flex-wrap: wrap;
 }
-
+*.gradio-checkboxgroup>span,
 *.gradio-radio>span {
     border: var(--ae-input-border-size) solid transparent;
     margin-bottom: 5px;
@@ -737,6 +738,7 @@ button:hover .mask-icon{
 :not(.portal)>.block.gradio-dropdown,
 :not(.portal)>.block.gradio-radio,
 :not(.portal)>.block.gradio-checkbox,
+:not(.portal)>.block.gradio-checkboxgroup,
 :not(.portal)>.block.gradio-textbox {
     background-color: var(--ae-panel-bg-color);
     padding: var(--ae-panel-padding);
@@ -3161,6 +3163,13 @@ input[type="checkbox"] {
 #train_tabitem .tabs{
     width:100%;
 }
+#setting_uiux_ignore_overrides {
+    min-width: 100%;
+}
+#img2img_override_settings,
+#txt2img_override_settings{
+    display:flex !important;
+}
 
 @-webkit-keyframes fade-out {
     0% {

From aff3c147990a732ad1223d2d4805980e9fa46ab8 Mon Sep 17 00:00:00 2001
From: anapnoe <124302297+anapnoe@users.noreply.github.com>
Date: Tue, 7 Nov 2023 10:00:58 +0200
Subject: [PATCH 08/16] Make text2img Metadata Panel to have max height #197

---
 .../html/templates/template-extras-results.html             | 2 +-
 .../html/templates/template-img2img-results.html            | 2 +-
 .../html/templates/template-txt2img-results.html            | 2 +-
 .../anapnoe-sd-uiux/javascript/anapnoe_sd_uiux_core.js      | 1 -
 .../anapnoe-sd-uiux/scripts/anapnoe_sd_uiux.py              | 2 +-
 extensions-builtin/anapnoe-sd-uiux/style.css                | 6 ++++++
 6 files changed, 10 insertions(+), 5 deletions(-)

diff --git a/extensions-builtin/anapnoe-sd-uiux/html/templates/template-extras-results.html b/extensions-builtin/anapnoe-sd-uiux/html/templates/template-extras-results.html
index 36a855abbb2..62d60a6c9c3 100644
--- a/extensions-builtin/anapnoe-sd-uiux/html/templates/template-extras-results.html
+++ b/extensions-builtin/anapnoe-sd-uiux/html/templates/template-extras-results.html
@@ -38,7 +38,7 @@
                   </button>
                 </div>
               </div>
-              <div id="acc-ec-3" class="accordion-container">
+              <div id="acc-ec-3" class="accordion-container .info-results-container">
                 <div id="flexbox-e4" class="flexbox col">
                   <div id="portal-e30" data-parent-selector="#tab_extras" data-selector="#html_info_x_extras" class="portal hide-empty">
                   </div>
diff --git a/extensions-builtin/anapnoe-sd-uiux/html/templates/template-img2img-results.html b/extensions-builtin/anapnoe-sd-uiux/html/templates/template-img2img-results.html
index ff6041c3e2f..f6db8500ef0 100644
--- a/extensions-builtin/anapnoe-sd-uiux/html/templates/template-img2img-results.html
+++ b/extensions-builtin/anapnoe-sd-uiux/html/templates/template-img2img-results.html
@@ -50,7 +50,7 @@
                   </button>
                 </div>
               </div>
-              <div id="acc-c-33" class="accordion-container">
+              <div id="acc-c-33" class="accordion-container info-results-container">
                 <div id="flexbox-43" class="flexbox col">
                   <div id="portal-293" data-parent-selector="#tab_img2img" data-selector="#download_files_img2img" data-vis="true" class="portal shrink hide-empty">
                   </div>
diff --git a/extensions-builtin/anapnoe-sd-uiux/html/templates/template-txt2img-results.html b/extensions-builtin/anapnoe-sd-uiux/html/templates/template-txt2img-results.html
index 0a7ae429e42..541f9ffe26f 100644
--- a/extensions-builtin/anapnoe-sd-uiux/html/templates/template-txt2img-results.html
+++ b/extensions-builtin/anapnoe-sd-uiux/html/templates/template-txt2img-results.html
@@ -51,7 +51,7 @@
                   </button>
                 </div>
               </div>
-              <div id="acc-c-3" class="accordion-container">
+              <div id="acc-c-3" class="accordion-container info-results-container">
                 <div id="flexbox-4" class="flexbox col">
                   <div id="portal-29" data-parent-selector="#tab_txt2img" data-selector="#download_files_txt2img" data-vis="true" class="portal shrink hide-empty">
                   </div>
diff --git a/extensions-builtin/anapnoe-sd-uiux/javascript/anapnoe_sd_uiux_core.js b/extensions-builtin/anapnoe-sd-uiux/javascript/anapnoe_sd_uiux_core.js
index 30241e8566a..7d1c228156b 100644
--- a/extensions-builtin/anapnoe-sd-uiux/javascript/anapnoe_sd_uiux_core.js
+++ b/extensions-builtin/anapnoe-sd-uiux/javascript/anapnoe_sd_uiux_core.js
@@ -1101,7 +1101,6 @@ function uiuxOptionSettings(){
         uiux_show_labels_tabs(e.target.checked, true);
     });
     uiux_show_labels_tabs(window.opts.uiux_show_labels_tabs);
-    
 
 }
 
diff --git a/extensions-builtin/anapnoe-sd-uiux/scripts/anapnoe_sd_uiux.py b/extensions-builtin/anapnoe-sd-uiux/scripts/anapnoe_sd_uiux.py
index 7900b3652b5..1b0f702f69b 100644
--- a/extensions-builtin/anapnoe-sd-uiux/scripts/anapnoe_sd_uiux.py
+++ b/extensions-builtin/anapnoe-sd-uiux/scripts/anapnoe_sd_uiux.py
@@ -14,7 +14,7 @@
     "uiux_default_layout": shared.OptionInfo("Auto", "Layout", gr.Radio, {"choices": ["Auto","Desktop", "Mobile"]}),    
     "uiux_show_labels_aside": shared.OptionInfo(False, "Show labels for aside tabs"),
     "uiux_show_labels_main": shared.OptionInfo(False, "Show labels for main tabs"),
-    "uiux_show_labels_tabs": shared.OptionInfo(False, "Show labels for page tabs"),
+    "uiux_show_labels_tabs": shared.OptionInfo(False, "Show labels for page tabs"),  
     "uiux_ignore_overrides": shared.OptionInfo([], "Ignore Overrides", gr.CheckboxGroup, lambda: {"choices": list(mapping)})
 }))
 
diff --git a/extensions-builtin/anapnoe-sd-uiux/style.css b/extensions-builtin/anapnoe-sd-uiux/style.css
index e6db658b854..adcd6971fdd 100644
--- a/extensions-builtin/anapnoe-sd-uiux/style.css
+++ b/extensions-builtin/anapnoe-sd-uiux/style.css
@@ -491,6 +491,7 @@ body {
     font-size: 13px;
     line-height: 16px;
     color: var(--ae-label-color);
+    overflow-wrap: anywhere;
 }
 
 *.gradio-image .image-container {
@@ -3260,6 +3261,11 @@ input[type="checkbox"] {
     justify-content: flex-start;
 }
 
+.info-results-container {
+    overflow-y: auto;
+    max-height:33vh;
+}
+
 @media (max-width: 768px) {
     .xtabs-tab span {
         display: none;

From 2a8a37015d40560ab54badd11bb4663259efd57f Mon Sep 17 00:00:00 2001
From: anapnoe <124302297+anapnoe@users.noreply.github.com>
Date: Wed, 8 Nov 2023 06:53:09 +0200
Subject: [PATCH 09/16] Update README.md

---
 README.md | 20 ++++++++++++++++++++
 1 file changed, 20 insertions(+)

diff --git a/README.md b/README.md
index 64f50bcc6c5..c85ad0c6a84 100644
--- a/README.md
+++ b/README.md
@@ -3,6 +3,26 @@ A bespoke, highly adaptable user interface for the Stable Diffusion, utilizing t
 
 ![](screenshot.png)
 
+## Optimizasions
+- Replacing all default Gradio stylesheets in the DOM with an optimized version that promote better visual coherence across components.
+- Eliminating inline styles and Svelte classes from the DOM to minimize clutter and improve efficiency.
+- Removing unnecessary "img2img Extra Networks" from the DOM to reduce duplicated images and event listeners.
+- Eradicating inline event listeners from "txt2img Extra Networks" cards and action buttons.
+- Applying an event delegation pattern to further streamline the code by consolidating event handling for "txt2img Extra Networks" cards and action buttons.
+
+## Features webui-ux 
+- A versatile micro-template engine that can be leveraged by other extensions
+- Customizable theme styles through a user-friendly configuration interface
+- Robust logging capabilities via built-in console logs
+- Option to ignore overrides
+- Support for tick marks on input range sliders for improved usability
+- Ability to switch between slider and number input modes, allowing users to enter values manually without displaying the slider.
+
+## Workspaces UI-UX (work in progress)
+The workspaces extension empowers you to create customized views and organize them according to your unique preferences. With an intuitive drag-and-drop interface, you can design workflows that are perfectly tailored to your specific requirements, giving you ultimate control over your work environment.
+
+![workspaces](https://github.com/anapnoe/stable-diffusion-webui-ux/assets/124302297/15db3c70-6fbf-4692-85f3-85cd8df58f47)
+
 ## Todo
 - Improve Mobile Support
 - Fullscreen Gallery Support

From f3e9aea676cb0bd6063e35a0a8eb87c13a909494 Mon Sep 17 00:00:00 2001
From: anapnoe <124302297+anapnoe@users.noreply.github.com>
Date: Wed, 8 Nov 2023 07:01:04 +0200
Subject: [PATCH 10/16] Update README.md

---
 README.md | 2 ++
 1 file changed, 2 insertions(+)

diff --git a/README.md b/README.md
index c85ad0c6a84..061ac0b32e9 100644
--- a/README.md
+++ b/README.md
@@ -23,6 +23,8 @@ The workspaces extension empowers you to create customized views and organize th
 
 ![workspaces](https://github.com/anapnoe/stable-diffusion-webui-ux/assets/124302297/15db3c70-6fbf-4692-85f3-85cd8df58f47)
 
+[Become a supporter and get early access to Workspaces for UI-UX.](https://buymeacoffee.com/dayanbayah)
+
 ## Todo
 - Improve Mobile Support
 - Fullscreen Gallery Support

From 8d281f9b4195ddcdf84e8e742633ed31a2ab14c3 Mon Sep 17 00:00:00 2001
From: anapnoe <124302297+anapnoe@users.noreply.github.com>
Date: Wed, 8 Nov 2023 07:45:04 +0200
Subject: [PATCH 11/16] add group container for override dropdown

---
 .../html/templates/template-img2img-params.html               | 4 +++-
 .../html/templates/template-txt2img-params.html               | 4 +++-
 2 files changed, 6 insertions(+), 2 deletions(-)

diff --git a/extensions-builtin/anapnoe-sd-uiux/html/templates/template-img2img-params.html b/extensions-builtin/anapnoe-sd-uiux/html/templates/template-img2img-params.html
index e9b2606c732..9f143d4c79d 100644
--- a/extensions-builtin/anapnoe-sd-uiux/html/templates/template-img2img-params.html
+++ b/extensions-builtin/anapnoe-sd-uiux/html/templates/template-img2img-params.html
@@ -319,7 +319,9 @@
                         </div>
                         <div data-selector="#img2img_enable" data-parent-selector="#tab_img2img" class="portal">
                         </div>
-                        <div data-selector="#img2img_override_settings" data-parent-selector="#tab_img2img" class="portal no-padding no-bg hide-empty">
+                        <div class="flexbox group row">
+                            <div data-selector="#img2img_override_settings" data-parent-selector="#tab_img2img" class="portal">
+                            </div>
                         </div>
 						<div data-selector="#layout-img2img .gradio-accordion:has( div[id^='setting_'])" data-parent-selector="gradio-app" class="portal hide-empty">
                         </div>
diff --git a/extensions-builtin/anapnoe-sd-uiux/html/templates/template-txt2img-params.html b/extensions-builtin/anapnoe-sd-uiux/html/templates/template-txt2img-params.html
index 3b39c66cdc5..7b00e5733b1 100644
--- a/extensions-builtin/anapnoe-sd-uiux/html/templates/template-txt2img-params.html
+++ b/extensions-builtin/anapnoe-sd-uiux/html/templates/template-txt2img-params.html
@@ -235,7 +235,9 @@
                                 </div>
                                 <div data-selector="#txt2img_hr" data-parent-selector="#tab_txt2img" class="portal">
                                 </div>
-                                <div data-selector="#txt2img_override_settings" data-parent-selector="#tab_txt2img" class="portal no-padding no-bg hide-empty">
+                                <div class="flexbox group row">
+                                    <div data-selector="#txt2img_override_settings" data-parent-selector="#tab_txt2img" class="portal">
+                                    </div>
                                 </div>
 								<div data-selector="#layout-txt2img  .gradio-accordion:has( div[id^='setting_'])" data-parent-selector="gradio-app"
                                     class="portal hide-empty">

From 86594e639044102b7e7aa2008ea3574015ba4a4a Mon Sep 17 00:00:00 2001
From: anapnoe <124302297+anapnoe@users.noreply.github.com>
Date: Wed, 8 Nov 2023 07:46:19 +0200
Subject: [PATCH 12/16] add mobile scale option setting

---
 .../javascript/anapnoe_sd_uiux_core.js        | 19 +++++++++++++++++++
 .../scripts/anapnoe_sd_uiux.py                |  5 +++--
 2 files changed, 22 insertions(+), 2 deletions(-)

diff --git a/extensions-builtin/anapnoe-sd-uiux/javascript/anapnoe_sd_uiux_core.js b/extensions-builtin/anapnoe-sd-uiux/javascript/anapnoe_sd_uiux_core.js
index 7d1c228156b..f9821104c55 100644
--- a/extensions-builtin/anapnoe-sd-uiux/javascript/anapnoe_sd_uiux_core.js
+++ b/extensions-builtin/anapnoe-sd-uiux/javascript/anapnoe_sd_uiux_core.js
@@ -1102,6 +1102,25 @@ function uiuxOptionSettings(){
     });
     uiux_show_labels_tabs(window.opts.uiux_show_labels_tabs);
 
+    
+    const comp_mobile_scale_range = gradioApp().querySelector("#setting_uiux_mobile_scale input[type=range]");
+    comp_mobile_scale_range.classList.add("hidden");
+    const comp_mobile_scale = gradioApp().querySelector("#setting_uiux_mobile_scale input[type=number]");
+    function uiux_mobile_scale(value) {
+        const viewport = document.head.querySelector('meta[name="viewport"]');
+        viewport.setAttribute("content", `width=device-width, initial-scale=1, shrink-to-fit=no, maximum-scale=${value}`);      
+    }
+    comp_mobile_scale.addEventListener("change", function (e) { 
+        //e.preventDefault();
+        //e.stopImmediatePropagation()
+        comp_mobile_scale.value = e.target.value;
+        window.updateInput(comp_mobile_scale);
+        console.log('change', e.target.value);
+        uiux_mobile_scale(e.target.value);   
+    });
+    
+    uiux_mobile_scale(window.opts.uiux_mobile_scale);
+
 }
 
 function setupOnLoadResources() {
diff --git a/extensions-builtin/anapnoe-sd-uiux/scripts/anapnoe_sd_uiux.py b/extensions-builtin/anapnoe-sd-uiux/scripts/anapnoe_sd_uiux.py
index 1b0f702f69b..8da680ac1cc 100644
--- a/extensions-builtin/anapnoe-sd-uiux/scripts/anapnoe_sd_uiux.py
+++ b/extensions-builtin/anapnoe-sd-uiux/scripts/anapnoe_sd_uiux.py
@@ -11,10 +11,11 @@
     "uiux_show_input_range_ticks": shared.OptionInfo(True, "Show ticks for input range slider"),
     "uiux_no_slider_layout": shared.OptionInfo(False, "No input range sliders"),
     "uiux_disable_transitions": shared.OptionInfo(False, "Disable transitions"),
-    "uiux_default_layout": shared.OptionInfo("Auto", "Layout", gr.Radio, {"choices": ["Auto","Desktop", "Mobile"]}),    
+    "uiux_default_layout": shared.OptionInfo("Auto", "Layout", gr.Radio, {"choices": ["Auto","Desktop", "Mobile"]}),  
+    "uiux_mobile_scale": shared.OptionInfo(0.7, "Mobile scale", gr.Slider, {"minimum": 0.5, "maximum": 1, "step": 0.05}),
     "uiux_show_labels_aside": shared.OptionInfo(False, "Show labels for aside tabs"),
     "uiux_show_labels_main": shared.OptionInfo(False, "Show labels for main tabs"),
-    "uiux_show_labels_tabs": shared.OptionInfo(False, "Show labels for page tabs"),  
+    "uiux_show_labels_tabs": shared.OptionInfo(False, "Show labels for page tabs"),
     "uiux_ignore_overrides": shared.OptionInfo([], "Ignore Overrides", gr.CheckboxGroup, lambda: {"choices": list(mapping)})
 }))
 

From af8bd62bc2126a8cb6f5fdbb95d1347c3d109b8a Mon Sep 17 00:00:00 2001
From: anapnoe <124302297+anapnoe@users.noreply.github.com>
Date: Wed, 8 Nov 2023 09:36:51 +0200
Subject: [PATCH 13/16] shrink space between split panes

---
 extensions-builtin/anapnoe-sd-uiux/style.css | 17 +++++++++++++++++
 1 file changed, 17 insertions(+)

diff --git a/extensions-builtin/anapnoe-sd-uiux/style.css b/extensions-builtin/anapnoe-sd-uiux/style.css
index adcd6971fdd..ac355558be2 100644
--- a/extensions-builtin/anapnoe-sd-uiux/style.css
+++ b/extensions-builtin/anapnoe-sd-uiux/style.css
@@ -3265,6 +3265,23 @@ input[type="checkbox"] {
     overflow-y: auto;
     max-height:33vh;
 }
+#layout_main_wrapper {
+    padding-left: 0;
+}
+.template > .layout {
+    padding-right: var(--ae-border-size);
+}
+
+.template > .full-height {
+    padding-left: var(--ae-border-size);
+    padding-right: var(--ae-border-size);
+}
+#split-right.v-expand{
+    margin-left: calc(var(--ae-border-size) * -1);
+}
+#split-right:not(.v-expand) #accordion-aside{
+    margin-left: var(--ae-border-size);
+}
 
 @media (max-width: 768px) {
     .xtabs-tab span {

From dd4a831d0bd26bbd58e02ed1eb4696d972dbc899 Mon Sep 17 00:00:00 2001
From: anapnoe <124302297+anapnoe@users.noreply.github.com>
Date: Wed, 8 Nov 2023 11:08:10 +0200
Subject: [PATCH 14/16] Update README.md

---
 README.md | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/README.md b/README.md
index 061ac0b32e9..cac91395137 100644
--- a/README.md
+++ b/README.md
@@ -13,7 +13,7 @@ A bespoke, highly adaptable user interface for the Stable Diffusion, utilizing t
 ## Features webui-ux 
 - A versatile micro-template engine that can be leveraged by other extensions
 - Customizable theme styles through a user-friendly configuration interface
-- Robust logging capabilities via built-in console logs
+- Built-in console log
 - Option to ignore overrides
 - Support for tick marks on input range sliders for improved usability
 - Ability to switch between slider and number input modes, allowing users to enter values manually without displaying the slider.

From 8ed49ca3b6c64c7dda3fa4c6c882dd1d792bc15b Mon Sep 17 00:00:00 2001
From: anapnoe <124302297+anapnoe@users.noreply.github.com>
Date: Mon, 13 Nov 2023 02:36:14 +0200
Subject: [PATCH 15/16] improve mobile support

---
 .../javascript/anapnoe_sd_uiux_core.js        | 12 ++++++++--
 extensions-builtin/anapnoe-sd-uiux/style.css  | 22 ++++++++++++++++++-
 2 files changed, 31 insertions(+), 3 deletions(-)

diff --git a/extensions-builtin/anapnoe-sd-uiux/javascript/anapnoe_sd_uiux_core.js b/extensions-builtin/anapnoe-sd-uiux/javascript/anapnoe_sd_uiux_core.js
index f9821104c55..dda43639644 100644
--- a/extensions-builtin/anapnoe-sd-uiux/javascript/anapnoe_sd_uiux_core.js
+++ b/extensions-builtin/anapnoe-sd-uiux/javascript/anapnoe_sd_uiux_core.js
@@ -135,6 +135,13 @@ function applyDefaultLayout(isMobile){
             }
         }           
     });
+
+    if(isMobile){ 
+        anapnoe_app.querySelector(".accordion-vertical.expand #mask-icon-acc-arrow")?.click();
+        anapnoe_app.classList.add("default-mobile");
+    }else{
+        anapnoe_app.classList.remove("default-mobile");
+    }
 }
 
 function switchMobile(){
@@ -153,12 +160,12 @@ function switchMobile(){
             applyDefaultLayout(isMobile);
         });
         applyDefaultLayout(detectMobile());
+
     }else if(optslayout === "Mobile"){
         applyDefaultLayout(true);
     }else{
         applyDefaultLayout(false);
-    }
-    
+    }   
 }
 
 
@@ -599,6 +606,7 @@ function onUiUxReady(content_div){
 			showContributors()           
             switchMobile();
             
+            
             localStorage.setItem('UiUxComplete', true);
 			
 		}
diff --git a/extensions-builtin/anapnoe-sd-uiux/style.css b/extensions-builtin/anapnoe-sd-uiux/style.css
index ac355558be2..90c022e2e7b 100644
--- a/extensions-builtin/anapnoe-sd-uiux/style.css
+++ b/extensions-builtin/anapnoe-sd-uiux/style.css
@@ -1863,7 +1863,9 @@ button.active .icon-sort {
     -webkit-mask-image: url(./html/svg/computer-line.svg);
 }
 
-
+.icon-menuadd{
+    -webkit-mask-image: url(./html/svg/menu-add-fill.svg);
+}
 
 #contributors_grid {
     gap: 5px;
@@ -3245,6 +3247,7 @@ input[type="checkbox"] {
 .tab-labels [id$="2img_header"] span ,
 .aside-labels #accordion-aside .xtabs-tab span {
     display: flex !important;
+    text-transform: capitalize;
 }
 .main-labels #main-nav .xtabs-tab,
 .tab-labels [id$="2img_header"] .xtabs-tab,
@@ -3282,6 +3285,23 @@ input[type="checkbox"] {
 #split-right:not(.v-expand) #accordion-aside{
     margin-left: var(--ae-border-size);
 }
+[toggle] .wrap{
+    display:none;
+}
+
+.default-mobile #split-right:not(.v-expand) { 
+    position: fixed;
+    inset: var(--ae-panel-padding);
+    z-index: 999;
+    background-color: var(--ae-main-bg-color);
+    outline: var(--ae-border-size) solid var(--ae-main-bg-color);
+}
+.default-mobile #split-right:not(.v-expand) #accordion-aside {
+    margin-left: var(--ae-panel-padding);
+}
+.default-mobile .template > .full-height {
+    padding: var(--ae-panel-padding);
+}
 
 @media (max-width: 768px) {
     .xtabs-tab span {

From da22a58aaeb6fe71046221c5068da9303db8314c Mon Sep 17 00:00:00 2001
From: anapnoe <124302297+anapnoe@users.noreply.github.com>
Date: Tue, 14 Nov 2023 23:51:37 +0200
Subject: [PATCH 16/16] fix gradio video component and canvas fit for inpaint

---
 extensions-builtin/anapnoe-sd-uiux/style.css | 67 +++++++++++++++-----
 1 file changed, 51 insertions(+), 16 deletions(-)

diff --git a/extensions-builtin/anapnoe-sd-uiux/style.css b/extensions-builtin/anapnoe-sd-uiux/style.css
index 90c022e2e7b..0feddc05801 100644
--- a/extensions-builtin/anapnoe-sd-uiux/style.css
+++ b/extensions-builtin/anapnoe-sd-uiux/style.css
@@ -514,9 +514,9 @@ body {
     position: relative;
 } */
 
-* [data-testid="image"] img {
+/* * [data-testid="image"] img {
     max-height: 40vh;
-}
+} */
 
 *.block {
     border: 0 !important;
@@ -768,16 +768,49 @@ button:hover .mask-icon{
     display: flex;
     justify-content: center;
     align-items: center;
-    min-height: 25vh;
+    min-height: 15vh;
     width: 100%;
     height: 100%;
+    position: absolute !important;
+    top:0;
+}
+:not(.portal)>.gradio-video .wrap{
+    position: relative !important;
+    z-index: 0;
 }
-
 [data-testid="block-info"] {
     display: flex;
     flex-direction: column;
     text-wrap: wrap;
 }
+.gradio-video .controls .inner{
+ display: flex;
+    max-height: 25px;
+    gap: 5px;
+    align-items: center;   
+}
+.gradio-video .controls .inner > *{
+    display: flex;
+    text-wrap: nowrap;
+}
+.gradio-video .controls .inner > progress{
+    display: flex;
+    flex-grow: 1;
+    min-width: 50%;
+}
+.gradio-video .controls .inner > [role="button"]{  
+    max-width: 20px;
+}
+.gradio-video .controls {
+    width: 100%;
+    padding: 5px;
+}
+.gradio-video .svelte-19sk1im{
+    position: absolute;
+    z-index: 2;
+    padding: var(--ae-panel-padding);
+    right: var(--ae-panel-padding);
+}
 
 *.gradio-dropdown {
     overflow: visible !important;
@@ -1421,12 +1454,14 @@ li.item span {
     width: 100%;
 }
 
+* .gradio-video video,
 * [data-testid="image"] img {
     object-fit: contain;
     width: 100%;
     height: 100%;
 }
 
+* .gradio-video .wrap,
 * [data-testid="image"] .wrap {
     display: flex;
     flex-direction: column;
@@ -2681,7 +2716,7 @@ span.star_count b {
 .tabs_extensions td:nth-child(1) a {
     font-size: 14px;
 }
-
+.gradio-video,
 .gradio-image {
     height: 100%;
     width: 100%;
@@ -2799,23 +2834,23 @@ span.star_count b {
 
   
   .image-container img.absolute-img {
-    /* position: relative !important; */
-    position: absolute !important;
+    position: relative !important;
+   /*  position: absolute !important; */
   }
   
-  .image-container img {
+  /* .image-container img {
     max-height: 50vh !important;
-  }
+  } */
   
   .image-container {
-    min-height: 25vh !important;
+    min-height: 15vh !important;
    /*  height: auto !important; */
     display: flex;
     position:relative;
   }
-  .image-container:has(canvas) {
+  /* .image-container:has(canvas) {
     min-height: 50vh !important;
-  }
+  } */
   
   .absolute-img {
     position: relative;
@@ -2827,12 +2862,11 @@ span.star_count b {
   }
   
   div[data-testid="image"] canvas {
-    width: auto !important;
-    height: 100% !important;
+    width: 100%!important;
+    height: auto !important;
     position: absolute !important;
-   /*  top: 0 !important;
-    left: 0 !important; */
     border: 0 !important;
+    inset: 0;
   }
   
  
@@ -2884,6 +2918,7 @@ flex-grow:1;
 .group-row > *{
     border-radius: 0 !important;
 }
+
 .group-row > *:last-child button,
 .group-row > *:last-child{
     border-top-right-radius: var(--ae-border-radius) !important;