From f93547be18641039aca24e8166f0ed7d495da15e Mon Sep 17 00:00:00 2001 From: AUTOMATIC <16777216c@gmail.com> Date: Tue, 21 Mar 2023 08:18:14 +0300 Subject: [PATCH] hide delete button for single-item dropdown more stylistic changes --- modules/scripts.py | 15 +++++++++++++-- modules/ui.py | 2 ++ modules/ui_common.py | 2 +- style.css | 43 ++++++++++++++++++++++++++++++++++--------- 4 files changed, 50 insertions(+), 12 deletions(-) diff --git a/modules/scripts.py b/modules/scripts.py index 40d8dcc6f..8f55cf24a 100644 --- a/modules/scripts.py +++ b/modules/scripts.py @@ -513,6 +513,18 @@ def reload_scripts(): scripts_postproc = scripts_postprocessing.ScriptPostprocessingRunner() +def add_classes_to_gradio_component(comp): + """ + this adds gradio-* to the component for css styling (ie gradio-button to gr.Button), as well as some others + """ + + comp.elem_classes = ["gradio-" + comp.get_block_name(), *(comp.elem_classes or [])] + + if getattr(comp, 'multiselect', False): + comp.elem_classes.append('multiselect') + + + def IOComponent_init(self, *args, **kwargs): if scripts_current is not None: scripts_current.before_component(self, **kwargs) @@ -521,8 +533,7 @@ def IOComponent_init(self, *args, **kwargs): res = original_IOComponent_init(self, *args, **kwargs) - # this adds gradio-* to every component for css styling (ie gradio-button to gr.Button) - self.elem_classes = ["gradio-" + self.get_block_name(), *(self.elem_classes or [])] + add_classes_to_gradio_component(self) script_callbacks.after_component_callback(self, **kwargs) diff --git a/modules/ui.py b/modules/ui.py index 6e0ac89f2..c5b0e8762 100644 --- a/modules/ui.py +++ b/modules/ui.py @@ -1601,11 +1601,13 @@ def create_ui(): for i, k, item in quicksettings_list: component = component_dict[k] + info = opts.data_labels[k] component.change( fn=lambda value, k=k: run_settings_single(value, key=k), inputs=[component], outputs=[component, text_settings], + show_progress=info.refresh is not None, ) text_settings.change( diff --git a/modules/ui_common.py b/modules/ui_common.py index d4e008293..7b752b45e 100644 --- a/modules/ui_common.py +++ b/modules/ui_common.py @@ -129,7 +129,7 @@ Requested path was: {f} generation_info = None with gr.Column(): - with gr.Row(elem_id=f"image_buttons_{tabname}"): + with gr.Row(elem_id=f"image_buttons_{tabname}", elem_classes="image-buttons"): open_folder_button = gr.Button(folder_symbol, visible=not shared.cmd_opts.hide_ui_dir_config) if tabname != "extras": diff --git a/style.css b/style.css index 692833bd1..677f03cd0 100644 --- a/style.css +++ b/style.css @@ -8,7 +8,7 @@ } .block.padded{ - padding: 0.2em 0.5em !important; + padding: 0 !important; } div.gradio-container{ @@ -38,7 +38,8 @@ div.form{ .block.gradio-textbox, .block.gradio-radio, .block.gradio-checkboxgroup, -.block.gradio-number +.block.gradio-number, +.block.gradio-colorpicker { border-width: 0 !important; box-shadow: none !important; @@ -46,11 +47,11 @@ div.form{ .gap.compact{ padding: 0; - gap: 0; + gap: 0.2em 0; } div.compact{ - gap: 0.5em; + gap: 1em; } .gradio-dropdown ul.options{ @@ -58,7 +59,10 @@ div.compact{ z-index: 3000; } -.gradio-dropdown label span:not(.has-info){ +.gradio-dropdown label span:not(.has-info), +.gradio-textbox label span:not(.has-info), +.gradio-number label span:not(.has-info) +{ margin-bottom: 0; } @@ -66,6 +70,14 @@ div.compact{ box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.05); } +.gradio-dropdown .token-remove.remove-all.remove-all{ + display: none; +} + +.gradio-dropdown.multiselect .token-remove.remove-all.remove-all{ + display: flex; +} + .gradio-slider input[type="number"]{ width: 6em; } @@ -81,6 +93,17 @@ div.gradio-html.min{ min-height: 0; } +.block.gradio-gallery{ + background: var(--input-background-fill); +} + +.gradio-container .prose a, .gradio-container .prose a:visited{ + color: unset; + text-decoration: none; +} + + + /* general styled components */ .gradio-button.tool{ @@ -188,9 +211,7 @@ div.gradio-html.min{ gap: 0.5em; } .interrogate-col > button{ - min-width: 8em; - max-width: 8em; - height: 5.45em; + flex: 1; } .generate-box{ @@ -241,6 +262,10 @@ div.gradio-html.min{ min-height: 480px !important; } +.image-buttons button{ + min-width: auto; +} + /* settings */ #quicksettings { @@ -254,7 +279,6 @@ div.gradio-html.min{ border: none; box-shadow: none; background: none; - margin-right: 10px; } #quicksettings .gradio-dropdown .wrap-inner{ @@ -286,6 +310,7 @@ div.gradio-html.min{ display: block; border: none; text-align: left; + white-space: initial; } #settings_result{ -- GitLab