stable-diffusion-webui icon indicating copy to clipboard operation
stable-diffusion-webui copied to clipboard

[Bug]: Some settings label is too long they break quicksettings

Open R-N opened this issue 2 years ago • 4 comments

Is there an existing issue for this?

  • [X] I have searched the existing issues and checked the recent builds/commits

What happened?

Some settings label is too long they break quicksettings

image

Steps to reproduce the problem

  1. Go to settings
  2. Insert "training_write_csv_every" into quicksettings list
  3. Reload gradio
  4. Check the quicksettings

What should have happened?

Quicksettings height or field will adjust to long label names. Or the label is shortened with tooltip for full label.

Commit where the problem happens

737eb28

What platforms do you use to access UI ?

Other/Cloud

What browsers do you use to access the UI ?

Google Chrome

Command Line Arguments

--autolaunch --ckpt {workspace3}/novelai/final_pruned.ckpt --deepdanbooru --disable-safe-unpickle  --no-half-vae

Additional information, context and logs

No response

R-N avatar Oct 28 '22 14:10 R-N

Same here. It makes quick settings completely unusable. Here I am trying to use the output directory setting, and the text in the textbox is unreadable. You can hardly see it's there:

UnusableQuickSettings

Barnplaid avatar Oct 29 '22 13:10 Barnplaid

+1 image

Eugenii10 avatar Nov 03 '22 12:11 Eugenii10

I'm not strong in CSS, but I have managed to get acceptable results on my screen (1080p 100% scale) with this user.css (place it near the webui.py):

#quicksettings .gr-box > div > div > input.gr-text-input {
    top: 1.88em;
}

#quicksettings .gr-box > input[type="range"] {
    top: 3.5em;
    position: absolute;
}

You have to close (console window) and restart the UI after that. It seems that "Restart Gradio..." orange button in the "Settings" tab doesn't reload user.css styles.

image

Eugenii10 avatar Nov 03 '22 12:11 Eugenii10

For directories I decided to go with per mode options for better fit and organization, although it means editing 3 lines. I modified Eugenii10's css to better fit my use case. top: 0.10em & top: 1.25em respectively. quicksettings Trying some other quick settings, I tested show images per step. Definitely too long, but I temporarily modified the comment in modules/shared.py for a better fit. quicksettings-shared Going to revert, but hopefully the wrapping on settings will get fixed soon. I would love to load up on these quick settings.

RassilonSleeps avatar Nov 11 '22 08:11 RassilonSleeps