From 3cd625854f9dc71235a432703ba82abfc5d1a3fc Mon Sep 17 00:00:00 2001
From: anapnoe <124302297+anapnoe@users.noreply.github.com>
Date: Fri, 24 Feb 2023 21:49:18 +0200
Subject: [PATCH] settings page styles

---
 javascript/ui.js |  3 +++
 modules/ui.py    | 15 ++++++---------
 style.css        | 24 ++++++++++++++++++++++++
 3 files changed, 33 insertions(+), 9 deletions(-)

diff --git a/javascript/ui.js b/javascript/ui.js
index 7f2cc504..ce3d1162 100644
--- a/javascript/ui.js
+++ b/javascript/ui.js
@@ -275,6 +275,9 @@ onUiUpdate(function(){
             gradioApp().querySelectorAll('#settings > div').forEach(function(elem){
                 elem.style.display = "block";
             })
+			gradioApp().querySelectorAll('#settings > div > div > div').forEach(function(elem){
+                elem.style.maxHeight  = "none";
+            })		
         }
     }
 	
diff --git a/modules/ui.py b/modules/ui.py
index d0c87897..5bb05735 100644
--- a/modules/ui.py
+++ b/modules/ui.py
@@ -1080,16 +1080,12 @@ def create_ui():
             with gr.Column(variant='panel', elem_id="png_2img_settings"):             
                 with gr.Column(elem_id="png_2img_settings_scroll"): 
                     image = gr.Image(elem_id="pnginfo_image", label="Source", source="upload", interactive=True, type="pil")
-            
-            
+                      
                 for tabname, button in buttons.items():
                     parameters_copypaste.register_paste_params_button(parameters_copypaste.ParamBinding(
                         paste_button=button, tabname=tabname, source_text_component=generation_info, source_image_component=image,
                     ))
-                
-             
-                    
-
+ 
         image.change(
             fn=wrap_gradio_call(modules.extras.run_pnginfo),
             inputs=[image],
@@ -1589,6 +1585,7 @@ def create_ui():
         current_tab = None
         current_row = None
         with gr.Tabs(elem_id="settings"):
+        
             for i, (k, item) in enumerate(opts.data_labels.items()):
                 section_must_be_skipped = item.section[0] is None
 
@@ -1597,12 +1594,12 @@ def create_ui():
 
                     if current_tab is not None:
                         current_row.__exit__()
-                        current_tab.__exit__()
+                        current_tab.__exit__()                       
 
-                    gr.Group()
+                    #gr.Group()
                     current_tab = gr.TabItem(elem_id="settings_{}".format(elem_id), label=text)
                     current_tab.__enter__()
-                    current_row = gr.Column(variant='compact')
+                    current_row = gr.Column(variant='panel', elem_id="{}_settings_2img_settings".format(elem_id))
                     current_row.__enter__()
 
                     previous_section = item.section
diff --git a/style.css b/style.css
index b55e40db..3a6543ca 100644
--- a/style.css
+++ b/style.css
@@ -1566,6 +1566,26 @@ canvas[key=mask] {
     display:none;
 }
 
+[id$="train_tabs_2img_settings"] > div:first-child {
+  margin-bottom: var(--outside-gap-size);
+}
+
+[id$="settings_2img_settings"] {
+	max-height: calc(100vh - 245px);
+    overflow-y: auto;
+}
+
+[id$="settings_2img_settings"]::before
+{
+	display:none;
+}
+
+[id$="settings_2img_settings"] button {
+	height:auto;
+}
+#settings>div {
+    padding-top:0;
+}
 /****************/
 /* Results View */
 /****************/
@@ -2648,6 +2668,10 @@ ul.list-none {
 		order:1;
 	}
 	
+	[id$="settings_2img_settings"] {
+		max-height: none;
+	}
+		
 	
 
 }