enable queue by default

more stylistic changes

modules/shared.py

@@ -107,7 +107,8 @@ parser.add_argument("--cors-allow-origins-regex", type=str, help="Allowed CORS o
 parser.add_argument("--tls-keyfile", type=str, help="Partially enables TLS, requires --tls-certfile to fully function", default=None)
 parser.add_argument("--tls-certfile", type=str, help="Partially enables TLS, requires --tls-keyfile to fully function", default=None)
 parser.add_argument("--server-name", type=str, help="Sets hostname of server", default=None)
-parser.add_argument("--gradio-queue", action='store_true', help="Uses gradio queue; experimental option; breaks restart UI button")
+parser.add_argument("--gradio-queue", action='store_true', help="does not do anything", default=True)
+parser.add_argument("--no-gradio-queue", action='store_true', help="Disables gradio queue; causes the webpage to use http requests instead of websockets; was the defaul in earlier versions")
 parser.add_argument("--skip-version-check", action='store_true', help="Do not check versions of torch and xformers")
 parser.add_argument("--no-hashing", action='store_true', help="disable sha256 hashing of checkpoints to help loading performance", default=False)
 parser.add_argument("--no-download-sd-model", action='store_true', help="don't download SD1.5 model even if no model is found in --ckpt-dir", default=False)

modules/ui.py

@@ -478,7 +478,7 @@ def create_ui():
                                 width = gr.Slider(minimum=64, maximum=2048, step=8, label="Width", value=512, elem_id="txt2img_width")
                                 height = gr.Slider(minimum=64, maximum=2048, step=8, label="Height", value=512, elem_id="txt2img_height")
 
-                            with gr.Column(elem_id="txt2img_dimensions_row", scale=1):
+                            with gr.Column(elem_id="txt2img_dimensions_row", scale=1, elem_classes="dimensions-tools"):
                                 res_switch_btn = ToolButton(value=switch_values_symbol, elem_id="txt2img_res_switch_btn")
 
                             if opts.dimensions_and_batch_together:
@@ -758,7 +758,7 @@ def create_ui():
                                 width = gr.Slider(minimum=64, maximum=2048, step=8, label="Width", value=512, elem_id="img2img_width")
                                 height = gr.Slider(minimum=64, maximum=2048, step=8, label="Height", value=512, elem_id="img2img_height")
 
-                            with gr.Column(elem_id="img2img_dimensions_row", scale=1):
+                            with gr.Column(elem_id="img2img_dimensions_row", scale=1, elem_classes="dimensions-tools"):
                                 res_switch_btn = ToolButton(value=switch_values_symbol, elem_id="img2img_res_switch_btn")
 
                             if opts.dimensions_and_batch_together:

modules/ui_extensions.py

@@ -244,7 +244,7 @@ def refresh_available_extensions_from_data(hide_tags, sort_column):
             hidden += 1
             continue
 
-        install_code = f"""<input onclick="install_extension_from_index(this, '{html.escape(url)}')" type="button" value="{"Install" if not existing else "Installed"}" {"disabled=disabled" if existing else ""} class="gr-button gr-button-lg gr-button-secondary">"""
+        install_code = f"""<button onclick="install_extension_from_index(this, '{html.escape(url)}')" {"disabled=disabled" if existing else ""} class="lg secondary gradio-button custom-button">{"Install" if not existing else "Installed"}</button>"""
 
         tags_text = ", ".join([f"<span class='extension-tag' title='{tags.get(x, '')}'>{x}</span>" for x in extension_tags])
 

style.css

@@ -70,6 +70,15 @@ div.compact{
     box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.05);
 }
 
+.gradio-dropdown .wrap-inner.wrap-inner.wrap-inner{
+    flex-wrap: unset;
+}
+
+.gradio-dropdown .single-select{
+    white-space: nowrap;
+    overflow: hidden;
+}
+
 .gradio-dropdown .token-remove.remove-all.remove-all{
     display: none;
 }
@@ -125,6 +134,22 @@ div.gradio-html.min{
     min-width: auto;
 }
 
+button.custom-button{
+    border-radius: var(--button-large-radius);
+    padding: var(--button-large-padding);
+    font-weight: var(--button-large-text-weight);
+    border: var(--button-border-width) solid var(--button-secondary-border-color);
+    background: var(--button-secondary-background-fill);
+    color: var(--button-secondary-text-color);
+    font-size: var(--button-large-text-size);
+    display: inline-flex;
+    justify-content: center;
+    align-items: center;
+    transition: var(--button-transition);
+    box-shadow: var(--button-shadow);
+    text-align: center;
+}
+
 
 /* txt2img/img2img specific */
 
@@ -250,10 +275,11 @@ div.gradio-html.min{
     min-width: min(13.5em, 100%) !important;
 }
 
-[id$=_dimensions_row]{
+div.dimensions-tools{
     min-width: 0 !important;
     max-width: fit-content;
-    padding: 0 1em;
+    flex-direction: row;
+    align-content: center;
 }
 
 #mode_img2img .gradio-image > div.fixed-height, #mode_img2img .gradio-image > div.fixed-height img{
@@ -281,15 +307,6 @@ div.gradio-html.min{
     background: none;
 }
 
-#quicksettings .gradio-dropdown .wrap-inner{
-    flex-wrap: unset;
-}
-
-#quicksettings .gradio-dropdown .single-select{
-    white-space: nowrap;
-    overflow: hidden;
-}
-
 #settings{
     display: block;
 }

webui.py

@@ -240,7 +240,7 @@ def webui():
         shared.demo = modules.ui.create_ui()
         startup_timer.record("create ui")
 
-        if cmd_opts.gradio_queue:
+        if not cmd_opts.no_gradio_queue:
             shared.demo.queue(64)
 
         gradio_auth_creds = []