[Bug]: minor cosmetic glitches

[PaulCoddington]

Is there an existing issue for this?

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

What happened?

The scrollable area containing Prompt, Sampling Method, etc, has a fade effect top and bottom.

This makes the Prompt accordion header 3D Windows-XP glassy style (less attractive) while all other accordion headers are flat (more attractive/modern). Likewise, the Script selection is partially faded out at the bottom edge.

Compare to the Themes pane where the scrollable area has no fade effect, resulting in sharp, clean, consistent appearance.

Also, checkboxes incorrectly have black backgrounds when they have focus but are set to False.

Steps to reproduce the problem

1. Select txt2img and/or img2img tabs.
2. Inspect scrollable area on left of page.

3. Compare to scrollable area of Themes pane.

4. Tab through accordions with checkboxes.

NB: Perhaps more easily observed with Inverted (light) themes with less vivid Primary color.

What should have happened?

All accordion headers should be flat, no control areas should be partly faded out.

Checkboxes that have focus should have a colored outline and not be filled with black backcolor.

Commit where the problem happens

23d460d

What platforms do you use to access the UI ?

Windows

What browsers do you use to access the UI ?

Microsoft Edge

Command Line Arguments

--opt-sdp-attention --opt-channelslast --skip-install --no-progressbar-hiding --autolaunch

List of extensions

a1111-sd-webui-lycoris a1111-sd-webui-tagcomplete clip-interrogator-ext multidiffusion-upscaler-for-automatic1111 sd-dynamic-thresholding sd-extension-aesthetic-scorer sd-extension-steps-animation sd-extension-system-info sd-webui-aspect-ratio-helper sd-webui-controlnet sd-webui-cutoff sd-webui-model-converter seed_travel stable-diffusion-webui-images-browser stable-diffusion-webui-rembg ultimate-upscale-for-automatic1111

Console logs

Launching Web UI with arguments: --opt-sdp-attention --opt-channelslast --skip-install --no-progressbar-hiding --autolaunch
No module 'xformers'. Proceeding without it.
ControlNet v1.1.139
ControlNet v1.1.139
Loading weights [6ce0161689] from C:\ProgramData\Stable Diffusion\sd-webui-ux\models\Stable-diffusion\v1-5-pruned-emaonly.safetensors
Creating model from config: C:\ProgramData\Stable Diffusion\sd-webui-ux\configs\v1-inference.yaml
LatentDiffusion: Running in eps-prediction mode
DiffusionWrapper has 859.52 M params.
Applying scaled dot product cross attention optimization.
Textual inversion embeddings loaded(0):
Model loaded in 4.3s (load weights from disk: 0.2s, create model: 0.4s, apply weights to model: 0.9s, apply channels_last: 0.6s, apply half(): 0.6s, move model to device: 0.7s, load textual inversion embeddings: 0.9s).
Running on local URL:  http://127.0.0.1:7860

To create a public link, set `share=True` in `launch()`.
Startup time: 15.8s (import torch: 2.0s, import gradio: 1.2s, import ldm: 0.5s, other imports: 1.1s, load scripts: 2.9s, load SD checkpoint: 4.7s, create ui: 3.0s, gradio launch: 0.3s).

Additional information

Windows 11

[PaulCoddington]

Additional: model cards dynamically resize larger when there are few models listed, but the low resolution of the preview is not always suited to further enlargement. It may be tidier to have model cards remain the same size regardless of how many are displayed in the pane.

[anapnoe]

you can use these hotfixes copy them to the user.css located in the root of webui-ux if it doesn't exist create it

for fade shadow none [id$="2img_settings"]::before {display:none;}

for the model cards 4 columns

[id$="2img_extra_networks_row"].aside .extra-network-cards {
    grid-template-columns: repeat(4, minmax(calc(var(--ae-extra-networks-card-size) * 20%), 1fr));
}

for the model cards 3 columns

[id$="2img_extra_networks_row"].aside .extra-network-cards {
    grid-template-columns: repeat(3, minmax(calc(var(--ae-extra-networks-card-size) * 25%), 1fr));
}