From d36d072e05630a5dfc90039dc8118a37358c61f1 Mon Sep 17 00:00:00 2001 From: Seunghoon Lee Date: Fri, 23 Feb 2024 15:14:13 +0900 Subject: [PATCH 01/10] improve zluda installation --- installer.py | 46 +++++++++++++++++++++++++++++++++++++++++---- modules/cmd_args.py | 1 + modules/shared.py | 3 --- modules/zluda.py | 26 ++++++++++++++++++++----- 4 files changed, 64 insertions(+), 12 deletions(-) diff --git a/installer.py b/installer.py index 0aae1b9b8..b8c17f632 100644 --- a/installer.py +++ b/installer.py @@ -405,10 +405,14 @@ def check_torch(): log.debug(f'Torch allowed: cuda={allow_cuda} rocm={allow_rocm} ipex={allow_ipex} diml={allow_directml} openvino={allow_openvino}') torch_command = os.environ.get('TORCH_COMMAND', '') xformers_package = os.environ.get('XFORMERS_PACKAGE', 'none') + zluda_need_dll_patch = False def is_rocm_available(): if not allow_rocm: return False + if installed('torch-directml'): + log.debug('DirectML installation is detected. Skipping HIP SDK check.') + return False if platform.system() == 'Windows': hip_path = os.environ.get('HIP_PATH', None) return hip_path is not None and os.path.exists(os.path.join(hip_path, 'bin')) @@ -474,7 +478,15 @@ def is_rocm_available(): except Exception as e: log.debug(f'ROCm hipconfig failed: {e}') rocm_ver = None - if not is_windows: # remove after PyTorch built with ROCm for Windows is launched + if args.use_zluda: # ZLUDA is available on both Linux and Windows + torch_command = os.environ.get('TORCH_COMMAND', 'torch==2.2.0 torchvision --index-url https://download.pytorch.org/whl/cu118') + log.warning("Currently, ZLUDA support is experimental and unstable.") + zluda_need_dll_patch = is_windows and not installed('torch') + elif is_windows: # remove this check after PyTorch built with ROCm for Windows is released + log.warning("HIP SDK is detected, but there's no PyTorch release for Windows at this moment. If you are trying ZLUDA, please add '--use-zluda'.") + log.info('Using CPU-only torch') + torch_command = os.environ.get('TORCH_COMMAND', 'torch torchvision') + else: if rocm_ver in {"5.7"}: torch_command = os.environ.get('TORCH_COMMAND', f'torch torchvision --pre --index-url https://download.pytorch.org/whl/nightly/rocm{rocm_ver}') elif rocm_ver in {"5.5", "5.6"}: @@ -484,9 +496,6 @@ def is_rocm_available(): torch_command = os.environ.get('TORCH_COMMAND', 'torch torchvision --index-url https://download.pytorch.org/whl/rocm5.5') if rocm_ver is not None: install(os.environ.get('ONNXRUNTIME_PACKAGE', get_onnxruntime_source_for_rocm(arr)), "onnxruntime-training built with ROCm", ignore=True) - else: - log.info('Using CPU-only Torch') - torch_command = os.environ.get('TORCH_COMMAND', 'torch torchvision') xformers_package = os.environ.get('XFORMERS_PACKAGE', 'none') elif allow_ipex and (args.use_ipex or shutil.which('sycl-ls') is not None or shutil.which('sycl-ls.exe') is not None or os.environ.get('ONEAPI_ROOT') is not None or os.path.exists('/opt/intel/oneapi') or os.path.exists("C:/Program Files (x86)/Intel/oneAPI") or os.path.exists("C:/oneAPI")): args.use_ipex = True # pylint: disable=attribute-defined-outside-init @@ -539,11 +548,15 @@ def is_rocm_available(): install(torch_command, 'torch torchvision') install('onnxruntime-directml', 'onnxruntime-directml', ignore=True) else: + if args.use_zluda: + log.warning("Failed to initialize ZLUDA. There's no HIP SDK found in PATH.") log.info('Using CPU-only Torch') torch_command = os.environ.get('TORCH_COMMAND', 'torch torchvision') if 'torch' in torch_command and not args.version: log.debug(f'Installing torch: {torch_command}') install(torch_command, 'torch torchvision') + if zluda_need_dll_patch: + patch_dlls_for_zluda() else: try: import torch @@ -896,6 +909,31 @@ def get_onnxruntime_source_for_rocm(rocm_ver): return 'onnxruntime-gpu' +def patch_dlls_for_zluda(): + zluda_path = os.environ.get('ZLUDA', None) + if zluda_path is None: + paths = os.environ.get('PATH', '').split(';') + for path in paths: + if os.path.exists(os.path.join(path, 'zluda_redirect.dll')): + zluda_path = path + break + if zluda_path is None: + log.warning('Failed to automatically patch torch with ZLUDA. Could not find ZLUDA from PATH.') + return + venv_path = os.path.dirname(shutil.which('python')) + dlls_to_patch = { + 'cublas.dll': 'cublas64_11.dll', + 'cudnn.dll': 'cudnn64_8.dll', + 'cusparse.dll': 'cusparse64_11.dll', + 'nvrtc.dll': 'nvrtc64_112_0.dll', + } + try: + for k, v in dlls_to_patch.items(): + shutil.copyfile(os.path.join(zluda_path, k), os.path.join(venv_path, 'Lib', 'site-packages', 'torch', 'lib', v)) + except Exception as e: + log.warning(f'Failed to automatically patch torch with ZLUDA: {e}') + + # check version of the main repo and optionally upgrade it def check_version(offline=False, reset=True): # pylint: disable=unused-argument if args.skip_all: diff --git a/modules/cmd_args.py b/modules/cmd_args.py index 49025613c..dcec93c87 100644 --- a/modules/cmd_args.py +++ b/modules/cmd_args.py @@ -41,6 +41,7 @@ group.add_argument("--disable-queue", default=os.environ.get("SD_DISABLEQUEUE", False), action='store_true', help="Disable queues, default: %(default)s") group.add_argument('--debug', default=os.environ.get("SD_DEBUG", False), action='store_true', help = "Run installer with debug logging, default: %(default)s") group.add_argument('--use-directml', default=os.environ.get("SD_USEDIRECTML", False), action='store_true', help = "Use DirectML if no compatible GPU is detected, default: %(default)s") +group.add_argument('--use-zluda', default=os.environ.get("SD_USEZLUDA", False), action='store_true', help = "Force use ZLUDA, AMD GPUs only, default: %(default)s") group.add_argument("--use-openvino", default=os.environ.get("SD_USEOPENVINO", False), action='store_true', help="Use Intel OpenVINO backend, default: %(default)s") group.add_argument("--use-ipex", default=os.environ.get("SD_USEIPX", False), action='store_true', help="Force use Intel OneAPI XPU backend, default: %(default)s") group.add_argument("--use-cuda", default=os.environ.get("SD_USECUDA", False), action='store_true', help="Force use nVidia CUDA backend, default: %(default)s") diff --git a/modules/shared.py b/modules/shared.py index 526d27731..f07c079b5 100644 --- a/modules/shared.py +++ b/modules/shared.py @@ -407,9 +407,6 @@ def temp_disable_extensions(): "olive_vae_encoder_float32": OptionInfo(False, 'Olive force FP32 for VAE Encoder'), "olive_static_dims": OptionInfo(True, 'Olive use static dimensions'), "olive_cache_optimized": OptionInfo(True, 'Olive cache optimized models'), - - "zluda_sep": OptionInfo("

ZLUDA

(experimental)", "", gr.HTML, {"visible": devices.backend == "cuda"}), - "zluda_enable_cudnn": OptionInfo(False, 'ZLUDA enable cuDNN (restart required)', gr.Checkbox, {"visible": devices.backend == "cuda"}), })) options_templates.update(options_section(('advanced', "Inference Settings"), { diff --git a/modules/zluda.py b/modules/zluda.py index 795ea1f3e..6eb6f06bc 100644 --- a/modules/zluda.py +++ b/modules/zluda.py @@ -3,13 +3,29 @@ from modules import shared, devices +def test(device: torch.device): + try: + ten1 = torch.randn((2, 4,), device=device) + ten2 = torch.randn((4, 8,), device=device) + out = torch.mm(ten1, ten2) + return out.sum().is_nonzero() + except Exception: + return False + + def initialize_zluda(): - if platform.system() == "Windows" and devices.cuda_ok and torch.cuda.get_device_name(devices.get_optimal_device()).endswith("[ZLUDA]"): - shared.log.warning("Detected ZLUDA device. Currently, ZLUDA support is experimental and unstable.") - torch.backends.cudnn.enabled = shared.opts.zluda_enable_cudnn - if torch.backends.cudnn.enabled: - shared.log.warning("cuDNN with ZLUDA won't work at this moment. Please wait for future update.") + device = devices.get_optimal_device() + if platform.system() == "Windows" and devices.cuda_ok and torch.cuda.get_device_name(device).endswith("[ZLUDA]"): + torch.backends.cudnn.enabled = False torch.backends.cuda.enable_flash_sdp(False) torch.backends.cuda.enable_math_sdp(True) torch.backends.cuda.enable_mem_efficient_sdp(False) shared.opts.sdp_options = ['Math attention'] + devices.device_codeformer = devices.cpu + + if not test(device): + shared.log.error(f'ZLUDA device failed to pass basic operation test: index={device.index}, device_name={torch.cuda.get_device_name(device)}') + torch.cuda.is_available = lambda: False + devices.cuda_ok = False + devices.backend = 'cpu' + devices.device = devices.device_esrgan = devices.device_gfpgan = devices.device_interrogate = devices.cpu From 4448c3f8f61a30bd2df00555af542bab6ce30e12 Mon Sep 17 00:00:00 2001 From: Vladimir Mandic Date: Fri, 23 Feb 2024 10:02:53 -0500 Subject: [PATCH 02/10] cleanup --- installer.py | 22 +++++++++++----------- 1 file changed, 11 insertions(+), 11 deletions(-) diff --git a/installer.py b/installer.py index b8c17f632..af97fc898 100644 --- a/installer.py +++ b/installer.py @@ -430,7 +430,7 @@ def is_rocm_available(): xformers_package = os.environ.get('XFORMERS_PACKAGE', '--pre xformers' if opts.get('cross_attention_optimization', '') == 'xFormers' else 'none') install('onnxruntime-gpu', 'onnxruntime-gpu', ignore=True) elif is_rocm_available(): - is_windows = platform.system() == 'Windows' # provides more better logs for ZLUDA users and ROCm for Windows users in future. + is_windows = platform.system() == 'Windows' log.info('AMD ROCm toolkit detected') os.environ.setdefault('PYTORCH_HIP_ALLOC_CONF', 'garbage_collection_threshold:0.8,max_split_size_mb:512') if not is_windows: @@ -478,12 +478,13 @@ def is_rocm_available(): except Exception as e: log.debug(f'ROCm hipconfig failed: {e}') rocm_ver = None - if args.use_zluda: # ZLUDA is available on both Linux and Windows + if args.use_zluda: torch_command = os.environ.get('TORCH_COMMAND', 'torch==2.2.0 torchvision --index-url https://download.pytorch.org/whl/cu118') - log.warning("Currently, ZLUDA support is experimental and unstable.") + log.warning("ZLUDA support: experimental") zluda_need_dll_patch = is_windows and not installed('torch') - elif is_windows: # remove this check after PyTorch built with ROCm for Windows is released - log.warning("HIP SDK is detected, but there's no PyTorch release for Windows at this moment. If you are trying ZLUDA, please add '--use-zluda'.") + elif is_windows: # TODO TBD after ROCm for Windows is released + log.warning("HIP SDK is detected, but no Torch release for Windows available") + log.info("For ZLUDA support specify '--use-zluda'") log.info('Using CPU-only torch') torch_command = os.environ.get('TORCH_COMMAND', 'torch torchvision') else: @@ -492,8 +493,7 @@ def is_rocm_available(): elif rocm_ver in {"5.5", "5.6"}: torch_command = os.environ.get('TORCH_COMMAND', f'torch torchvision --index-url https://download.pytorch.org/whl/nightly/rocm{rocm_ver}') else: - # ROCm 5.5 is oldest for PyTorch 2.1 - torch_command = os.environ.get('TORCH_COMMAND', 'torch torchvision --index-url https://download.pytorch.org/whl/rocm5.5') + torch_command = os.environ.get('TORCH_COMMAND', 'torch torchvision --index-url https://download.pytorch.org/whl/rocm5.5') # ROCm 5.5 is oldest for PyTorch 2.1 if rocm_ver is not None: install(os.environ.get('ONNXRUNTIME_PACKAGE', get_onnxruntime_source_for_rocm(arr)), "onnxruntime-training built with ROCm", ignore=True) xformers_package = os.environ.get('XFORMERS_PACKAGE', 'none') @@ -549,14 +549,14 @@ def is_rocm_available(): install('onnxruntime-directml', 'onnxruntime-directml', ignore=True) else: if args.use_zluda: - log.warning("Failed to initialize ZLUDA. There's no HIP SDK found in PATH.") + log.warning("ZLUDA failed to initialize: no HIP SDK found") log.info('Using CPU-only Torch') torch_command = os.environ.get('TORCH_COMMAND', 'torch torchvision') if 'torch' in torch_command and not args.version: log.debug(f'Installing torch: {torch_command}') install(torch_command, 'torch torchvision') if zluda_need_dll_patch: - patch_dlls_for_zluda() + patch_zluda() else: try: import torch @@ -909,7 +909,7 @@ def get_onnxruntime_source_for_rocm(rocm_ver): return 'onnxruntime-gpu' -def patch_dlls_for_zluda(): +def patch_zluda(): zluda_path = os.environ.get('ZLUDA', None) if zluda_path is None: paths = os.environ.get('PATH', '').split(';') @@ -931,7 +931,7 @@ def patch_dlls_for_zluda(): for k, v in dlls_to_patch.items(): shutil.copyfile(os.path.join(zluda_path, k), os.path.join(venv_path, 'Lib', 'site-packages', 'torch', 'lib', v)) except Exception as e: - log.warning(f'Failed to automatically patch torch with ZLUDA: {e}') + log.warning(f'ZLUDA: failed to automatically patch torch: {e}') # check version of the main repo and optionally upgrade it From 69b0034852d223d9cb7d1e68c3a5f90fc001ff5c Mon Sep 17 00:00:00 2001 From: Vladimir Mandic Date: Fri, 23 Feb 2024 11:00:02 -0500 Subject: [PATCH 03/10] update default theme and add black-gray --- javascript/black-gray.css | 300 ++++++++++++++++++++++++++++++++++++++ javascript/black-teal.css | 70 +++++---- 2 files changed, 333 insertions(+), 37 deletions(-) create mode 100644 javascript/black-gray.css diff --git a/javascript/black-gray.css b/javascript/black-gray.css new file mode 100644 index 000000000..03e07cb63 --- /dev/null +++ b/javascript/black-gray.css @@ -0,0 +1,300 @@ +/* generic html tags */ +@font-face { font-family: 'NotoSans'; font-display: swap; font-style: normal; font-weight: 100; src: local('NotoSans'), url('notosans-nerdfont-regular.ttf') } +:root, .light, .dark { + --font: 'NotoSans'; + --font-mono: 'ui-monospace', 'Consolas', monospace; + --font-size: 16px; + --primary-50: #f0f0f0; + --primary-100: #e0e0e0; + --primary-200: #d0d0d0; + --primary-300: #b0b0b0; + --primary-400: #909090; + --primary-500: #707070; + --primary-600: #606060; + --primary-700: #404040; + --primary-800: #303030; + --primary-900: #202020; + --primary-950: #101010; + --highlight-color: var(--primary-200); + --inactive-color: var(--primary--800); + --body-text-color: var(--primary-100); + --body-text-color-subdued: var(--primary-300); + --background-color: var(--primary-950); + --background-fill-primary: var(--primary-700); + --input-padding: 4px; + --input-background-fill: var(--primary-800); + --input-shadow: none; + --button-primary-background-fill: var(--primary-600); + --button-primary-background-fill-hover: var(--primary-800); + --button-secondary-background-fill: var(--neutral-600); + --button-secondary-background-fill-hover: var(--neutral-800); + --block-title-text-color: var(--neutral-300); + --radius-sm: 0; + --radius-lg: 0; + --line-xs: 0.5em; + --line-sm: 1.0em; + --line-md: 1.3em; + --line-lg: 1.5em; +} + +:root { scrollbar-color: var(--highlight-color) var(--primary-800); } +html { font-size: var(--font-size); font-family: var(--font); } +body, button, input, select, textarea { font-family: var(--font); } +button { max-width: 400px; white-space: nowrap; } +img { background-color: var(--background-color); } + +input[type=range] { height: var(--line-xs) !important; appearance: none !important; margin-top: 0 !important; min-width: max(4em, 100%) !important; width: 100% !important; background: transparent !important; } +input[type=range]::-webkit-slider-runnable-track { width: 100% !important; height: var(--line-xs) !important; cursor: pointer !important; background: var(--input-background-fill) !important; border: 0px solid var(--primary-900) !important; } +input[type=range]::-moz-range-track { width: 100% !important; height: var(--line-xs) !important; cursor: pointer !important; background: var(--input-background-fill) !important; border: 0px solid var(--primary-900) !important; } +input[type=range]::-webkit-slider-thumb { border: 0px solid var(--primary-950)0 !important; height: var(--line-sm) !important; width: var(--line-sm) !important; background: var(--highlight-color) !important; cursor: pointer !important; appearance: none !important; margin-top: -4px; border-radius: 4px; } +input[type=range]::-moz-range-thumb { border: 0px solid var(--primary-950)0 !important; height: var(--line-sm) !important; width: var(--line-sm) !important; background: var(--highlight-color) !important; cursor: pointer !important; appearance: none !important; margin-top: -4px; border-radius: 4px; } + +::-webkit-scrollbar { width: 12px; height: 12px; } +::-webkit-scrollbar-track { background: var(--primary-800); } +::-webkit-scrollbar-thumb { background-color: var(--highlight-color); border-width: 0; } +div.form { border-width: 0; box-shadow: none; background: transparent; overflow: visible; } + +/* gradio style classes */ +fieldset .gr-block.gr-box, label.block span { padding: 0; margin-top: -4px; } +.border-2 { border-width: 0; } +.border-b-2 { border-bottom-width: 2px; border-color: var(--highlight-color) !important; padding-bottom: 2px; margin-bottom: 8px; } +.bg-white { color: lightyellow; background-color: var(--inactive-color); } +.gr-box { border-radius: var(--radius-sm) !important; background-color: var(--primary-950) !important; box-shadow: none; border-width: 0; padding: 4px; margin: 12px 0px 12px 0px } +.gr-button { font-weight: normal; box-shadow: none; font-size: 0.8rem; min-width: 32px; min-height: 32px; padding: 3px; margin: 3px; } +.gr-check-radio { background-color: var(--inactive-color); border-width: 0; border-radius: var(--radius-lg); box-shadow: none; } +.gr-check-radio:checked { background-color: var(--highlight-color); } +.gr-compact { background-color: var(--background-color); } +.gr-form { border-width: 0; } +.gr-input { background-color: var(--primary-300) !important; padding: 4px; margin: 4px; } +.gr-input-label { color: lightyellow; border-width: 0; background: transparent; padding: 2px !important; } +.gr-panel { background-color: var(--background-color); } +.eta-bar { display: none !important } +svg.feather.feather-image, .feather .feather-image { display: none } +.gap-2 { padding-top: 8px; } +.gr-box > div > div > input.gr-text-input { right: 0; width: 4em; padding: 0; top: -12px; border: none; max-height: 20px; } +.output-html { line-height: 1.2rem; overflow-x: hidden; } +.output-html > div { margin-bottom: 8px; } +.overflow-hidden .flex .flex-col .relative col .gap-4 { min-width: var(--left-column); max-width: var(--left-column); } /* this is a problematic one */ +.p-2 { padding: 0; } +.px-4 { padding-lefT: 1rem; padding-right: 1rem; } +.py-6 { padding-bottom: 0; } +.tabs { background-color: var(--background-color); } +.block.token-counter span { background-color: var(--input-background-fill) !important; border: none !important; font-size: 0.7rem; } +.tab-nav { zoom: 110%; margin-top: 10px; margin-bottom: 10px; border-bottom: 2px solid var(--highlight-color) !important; padding-bottom: 2px; } +.label-wrap { margin: 8px 0px 4px 0px; } +.gradio-button.tool { border: none; background: none; box-shadow: none; filter: hue-rotate(340deg) saturate(0.5); } +#tab_extensions table td, #tab_extensions table th, #tab_config table td, #tab_config table th { border: none; } +#tab_extensions table tr:hover, #tab_config table tr:hover { background-color: var(--neutral-500) !important; } +#tab_extensions table, #tab_config table { width: 96vw } +#tab_extensions table thead, #tab_config table thead { background-color: var(--neutral-700); } +#tab_extensions table, #tab_config table { background-color: var(--primary-900); } + +/* automatic style classes */ +.progressDiv { border-radius: var(--radius-sm) !important; position: fixed; top: 44px; right: 26px; max-width: 262px; height: 48px; z-index: 99; } +.progressDiv .progress { border-radius: var(--radius-lg) !important; background: var(--highlight-color); line-height: 3rem; height: 48px; } +.gallery-item { box-shadow: none !important; } +.performance { color: #888; } +.extra-networks { border-left: 2px solid var(--highlight-color) !important; padding-left: 4px; } +.image-buttons { gap: 10px !important; justify-content: center; } +.image-buttons > button { max-width: 160px; } +.tooltip { background: var(--primary-300); color: black; border: none; border-radius: var(--radius-lg) } +#system_row > button, #settings_row > button, #config_row > button { max-width: 10em; } + +/* gradio elements overrides */ +#div.gradio-container { overflow-x: hidden; } +#img2img_label_copy_to_img2img { font-weight: normal; } + +#txt2img_prompt, #txt2img_neg_prompt, #img2img_prompt, #img2img_neg_prompt, #control_prompt, #control_neg_prompt { background-color: var(--background-color); box-shadow: none !important; } +#txt2img_prompt > label > textarea, #txt2img_neg_prompt > label > textarea, #img2img_prompt > label > textarea, #img2img_neg_prompt > label > textarea, #control_prompt > label > textarea, #control_neg_prompt > label > textarea { font-size: 1.0em; line-height: 1.4em; } +#txt2img_styles, #img2img_styles, #control_styles { padding: 0; } +#txt2img_styles_refresh, #img2img_styles_refresh, #control_styles_refresh { padding: 0; margin-top: 1em; } +#img2img_settings { min-width: calc(2 * var(--left-column)); max-width: calc(2 * var(--left-column)); background-color: var(--primary-950); padding-top: 16px; } +#interrogate, #deepbooru { margin: 0 0px 10px 0px; max-width: 80px; max-height: 80px; font-weight: normal; font-size: 0.95em; } +#quicksettings .gr-button-tool { font-size: 1.6rem; box-shadow: none; margin-left: -20px; margin-top: -2px; height: 2.4em; } +#open_folder_extras, #footer, #style_pos_col, #style_neg_col, #roll_col, #extras_upscaler_2, #extras_upscaler_2_visibility, #txt2img_seed_resize_from_w, #txt2img_seed_resize_from_h { display: none; } +#save-animation { border-radius: var(--radius-sm) !important; margin-bottom: 16px; background-color: var(--primary-950); } +#script_list { padding: 4px; margin-top: 16px; margin-bottom: 8px; } +#settings > div.flex-wrap { width: 15em; } +#settings_search { margin-top: 1em; margin-left: 1em; } +#settings_search textarea { padding: 0.5em; height: 2.2em !important; } +#txt2img_cfg_scale { min-width: 200px; } +#txt2img_checkboxes, #img2img_checkboxes, #control_checkboxes { background-color: transparent; margin-bottom: 0.2em; } +textarea[rows="1"] { height: 33px !important; width: 99% !important; padding: 8px !important; } +#extras_upscale { margin-top: 10px } +#txt2img_progress_row > div { min-width: var(--left-column); max-width: var(--left-column); } +#txt2img_settings { min-width: var(--left-column); max-width: var(--left-column); background-color: var(--primary-950); padding-top: 16px; } +#pnginfo_html2_info { margin-top: -18px; background-color: var(--input-background-fill); padding: var(--input-padding) } +#txt2img_styles_row, #img2img_styles_row, #control_styles_row { margin-top: -6px; } + +/* based on gradio built-in dark theme */ +:root, .light, .dark { + --body-background-fill: var(--background-color); + --color-accent-soft: var(--neutral-700); + --background-fill-secondary: none; + --border-color-accent: var(--background-color); + --border-color-primary: var(--background-color); + --link-text-color-active: var(--primary-500); + --link-text-color: var(--secondary-500); + --link-text-color-hover: var(--secondary-400); + --link-text-color-visited: var(--secondary-600); + --shadow-spread: 1px; + --block-background-fill: None; + --block-border-color: var(--border-color-primary); + --block_border_width: None; + --block-info-text-color: var(--body-text-color-subdued); + --block-label-background-fill: var(--background-fill-secondary); + --block-label-border-color: var(--border-color-primary); + --block_label_border_width: None; + --block-label-text-color: var(--neutral-200); + --block_shadow: None; + --block_title_background_fill: None; + --block_title_border_color: None; + --block_title_border_width: None; + --panel-background-fill: var(--background-fill-secondary); + --panel-border-color: var(--border-color-primary); + --panel_border_width: None; + --checkbox-background-color: var(--neutral-500); + --checkbox-background-color-focus: var(--checkbox-background-color); + --checkbox-background-color-hover: var(--checkbox-background-color); + --checkbox-background-color-selected: var(--primary-500); + --checkbox-border-color: transparent; + --checkbox-border-color-focus: var(--secondary-500); + --checkbox-border-color-hover: var(--neutral-600); + --checkbox-border-color-selected: var(--primary-600); + --checkbox-border-width: var(--input-border-width); + --checkbox-label-background-fill: None; + --checkbox-label-background-fill-hover: None; + --checkbox-label-background-fill-selected: var(--checkbox-label-background-fill); + --checkbox-label-border-color: var(--border-color-primary); + --checkbox-label-border-color-hover: var(--checkbox-label-border-color); + --checkbox-label-border-width: var(--input-border-width); + --checkbox-label-text-color: var(--body-text-color); + --checkbox-label-text-color-selected: var(--checkbox-label-text-color); + --error-background-fill: var(--background-fill-primary); + --error-border-color: var(--border-color-primary); + --error_border_width: None; + --error-text-color: #ef4444; + --input-background-fill-focus: var(--secondary-600); + --input-background-fill-hover: var(--input-background-fill); + --input-border-color: var(--border-color-primary); + --input-border-color-focus: var(--neutral-700); + --input-border-color-hover: var(--input-border-color); + --input_border_width: None; + --input-placeholder-color: var(--neutral-500); + --input-shadow-focus: none; + --loader_color: None; + --slider_color: None; + --stat-background-fill: var(--primary-500); + --table-border-color: var(--neutral-700); + --table-even-background-fill: var(--primary-900); + --table-odd-background-fill: #303030; + --table-row-focus: var(--color-accent-soft); + --button-border-width: var(--input-border-width); + --button-cancel-background-fill: #b91c1c; + --button-cancel-background-fill-hover: #dc2626; + --button-cancel-border-color: #dc2626; + --button-cancel-border-color-hover: var(--button-cancel-border-color); + --button-cancel-text-color: var(--primary-100); + --button-cancel-text-color-hover: var(--button-cancel-text-color); + --button-primary-border-color: var(--primary-500); + --button-primary-border-color-hover: var(--button-primary-border-color); + --button-primary-text-color: var(--primary-100); + --button-primary-text-color-hover: var(--button-primary-text-color); + --button-secondary-border-color: var(--neutral-600); + --button-secondary-border-color-hover: var(--button-secondary-border-color); + --button-secondary-text-color-hover: var(--button-secondary-text-color); + --secondary-50: #eff6ff; + --secondary-100: #dbeafe; + --secondary-200: #bfdbfe; + --secondary-300: #93c5fd; + --secondary-400: #60a5fa; + --secondary-500: #3b82f6; + --secondary-600: #2563eb; + --secondary-700: #1d4ed8; + --secondary-800: #1e40af; + --secondary-900: #1e3a8a; + --secondary-950: #1d3660; + --neutral-50: #f0f0f0; + --neutral-100: #e0e0e0; + --neutral-200: #d0d0d0; + --neutral-300: #b0b0b0; + --neutral-400: #909090; + --neutral-500: #707070; + --neutral-600: #606060; + --neutral-700: #404040; + --neutral-800: #303030; + --neutral-900: #111827; + --neutral-950: #0b0f19; + --radius-xxs: 0; + --radius-xs: 0; + --radius-md: 0; + --radius-xl: 0; + --radius-xxl: 0; + --body-text-size: var(--text-md); + --body-text-weight: 400; + --embed-radius: var(--radius-lg); + --color-accent: var(--primary-500); + --shadow-drop: 0; + --shadow-drop-lg: 0; + --shadow-inset: rgba(0,0,0,0.05) 0px 2px 4px 0px inset; + --block-border-width: 1px; + --block-info-text-size: var(--text-sm); + --block-info-text-weight: 400; + --block-label-border-width: 1px; + --block-label-margin: 0; + --block-label-padding: var(--spacing-sm) var(--spacing-lg); + --block-label-radius: calc(var(--radius-lg) - 1px) 0 calc(var(--radius-lg) - 1px) 0; + --block-label-right-radius: 0 calc(var(--radius-lg) - 1px) 0 calc(var(--radius-lg) - 1px); + --block-label-text-size: var(--text-sm); + --block-label-text-weight: 400; + --block-padding: var(--spacing-xl) calc(var(--spacing-xl) + 2px); + --block-radius: var(--radius-lg); + --block-shadow: var(--shadow-drop); + --block-title-background-fill: none; + --block-title-border-color: none; + --block-title-border-width: 0px; + --block-title-padding: 0; + --block-title-radius: none; + --block-title-text-size: var(--text-md); + --block-title-text-weight: 400; + --container-radius: var(--radius-lg); + --form-gap-width: 1px; + --layout-gap: var(--spacing-xxl); + --panel-border-width: 0; + --section-header-text-size: var(--text-md); + --section-header-text-weight: 400; + --checkbox-border-radius: var(--radius-sm); + --checkbox-label-gap: 2px; + --checkbox-label-padding: var(--spacing-md); + --checkbox-label-shadow: var(--shadow-drop); + --checkbox-label-text-size: var(--text-md); + --checkbox-label-text-weight: 400; + --checkbox-check: url("data:image/svg+xml,%3csvg viewBox='0 0 16 16' fill='white' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='M12.207 4.793a1 1 0 010 1.414l-5 5a1 1 0 01-1.414 0l-2-2a1 1 0 011.414-1.414L6.5 9.086l4.293-4.293a1 1 0 011.414 0z'/%3e%3c/svg%3e"); + --radio-circle: url("data:image/svg+xml,%3csvg viewBox='0 0 16 16' fill='white' xmlns='http://www.w3.org/2000/svg'%3e%3ccircle cx='8' cy='8' r='3'/%3e%3c/svg%3e"); + --checkbox-shadow: var(--input-shadow); + --error-border-width: 1px; + --input-border-width: 0; + --input-radius: var(--radius-lg); + --input-text-size: var(--text-md); + --input-text-weight: 400; + --loader-color: var(--color-accent); + --prose-text-size: var(--text-md); + --prose-text-weight: 400; + --prose-header-text-weight: 400; + --slider-color: ; + --table-radius: var(--radius-lg); + --button-large-padding: 2px 6px; + --button-large-radius: var(--radius-lg); + --button-large-text-size: var(--text-lg); + --button-large-text-weight: 400; + --button-shadow: none; + --button-shadow-active: none; + --button-shadow-hover: none; + --button-small-padding: var(--spacing-sm) calc(2 * var(--spacing-sm)); + --button-small-radius: var(--radius-lg); + --button-small-text-size: var(--text-md); + --button-small-text-weight: 400; + --button-transition: none; + --size-9: 64px; + --size-14: 64px; +} diff --git a/javascript/black-teal.css b/javascript/black-teal.css index 13c65bc73..d1745666a 100644 --- a/javascript/black-teal.css +++ b/javascript/black-teal.css @@ -15,21 +15,37 @@ --primary-800: #2b5656; --primary-900: #224444; --primary-950: #193232; + --neutral-50: #f0f0f0; + --neutral-100: #e0e0e0; + --neutral-200: #d0d0d0; + --neutral-300: #b0b0b0; + --neutral-400: #909090; + --neutral-500: #707070; + --neutral-600: #606060; + --neutral-700: #404040; + --neutral-800: #303030; + --neutral-900: #202020; + --neutral-950: #101010; --highlight-color: var(--primary-200); --inactive-color: var(--primary--800); --body-text-color: var(--neutral-100); --body-text-color-subdued: var(--neutral-300); - --background-color: #000000; + --background-color: #050505; --background-fill-primary: var(--neutral-700); --input-padding: 4px; --input-background-fill: var(--neutral-800); --input-shadow: none; - --button-secondary-text-color: white; + --button-secondary-text-color: var(--neutral-100); --button-secondary-background-fill: linear-gradient(to bottom right, var(--neutral-400), var(--neutral-700)); --button-secondary-background-fill-hover: linear-gradient(to bottom right, var(--neutral-700), var(--neutral-400)); --block-title-text-color: var(--neutral-300); + --radius-xxs: 0; + --radius-xs: 1; --radius-sm: 2px; + --radius-md: 3; --radius-lg: 4px; + --radius-xl: 5; + --radius-xxl: 6; --line-xs: 1.0em; --line-sm: 1.2em; --line-md: 1.4em; @@ -40,20 +56,15 @@ html { font-size: var(--font-size); font-family: var(--font); } body, button, input, select, textarea { font-family: var(--font); } button { max-width: 400px; white-space: nowrap; } img { background-color: var(--background-color); } -input[type=range] { height: var(--line-xs) !important; appearance: none !important; margin-top: 0 !important; min-width: max(4em, 100%) !important; - background-color: var(--background-color) !important; width: 100% !important; background: transparent !important; } -input[type=range]::-webkit-slider-runnable-track { width: 100% !important; height: var(--line-xs) !important; cursor: pointer !important; box-shadow: 2px 2px 3px #111111 !important; - background: var(--input-background-fill) !important; border-radius: var(--radius-lg) !important; border: 0px solid #222222 !important; } -input[type=range]::-moz-range-track { width: 100% !important; height: var(--line-xs) !important; cursor: pointer !important; box-shadow: 2px 2px 3px #111111 !important; background: - var(--input-background-fill) !important; border-radius: var(--radius-lg) !important; border: 0px solid #222222 !important; } -input[type=range]::-webkit-slider-thumb { box-shadow: 2px 2px 3px #111111 !important; border: 0px solid #000000 !important; height: var(--line-xs) !important; width: var(--line-md) !important; - border-radius: var(--radius-lg) !important; background: var(--highlight-color) !important; cursor: pointer !important; appearance: none !important; margin-top: 0px !important; } -input[type=range]::-moz-range-thumb { box-shadow: 2px 2px 3px #111111 !important; border: 0px solid #000000 !important; height: var(--line-xs) !important; width: var(--line-md) !important; - border-radius: var(--radius-lg) !important; background: var(--highlight-color) !important; cursor: pointer !important; appearance: none !important; margin-top: 0px !important; } +input[type=range] { height: var(--line-xs) !important; appearance: none !important; margin-top: 0 !important; min-width: max(4em, 100%) !important; background-color: var(--background-color) !important; width: 100% !important; background: transparent !important; } +input[type=range]::-webkit-slider-runnable-track { width: 100% !important; height: 6px !important; cursor: pointer !important; background: var(--input-background-fill) !important; border-radius: var(--radius-lg) !important; border: 0px solid var(--neutral-900) !important; } +input[type=range]::-moz-range-track { width: 100% !important; height: 6px !important; cursor: pointer !important; background: var(--input-background-fill) !important; border-radius: var(--radius-lg) !important; border: 0px solid var(--neutral-900) !important; } +input[type=range]::-webkit-slider-thumb { border: 0px solid #000000 !important; height: var(--line-xs) !important; width: var(--line-md) !important; border-radius: var(--radius-lg) !important; background: var(--highlight-color) !important; cursor: pointer !important; appearance: none !important; margin-top: -4px !important; } +input[type=range]::-moz-range-thumb { border: 0px solid #000000 !important; height: var(--line-xs) !important; width: var(--line-md) !important; border-radius: var(--radius-lg) !important; background: var(--highlight-color) !important; cursor: pointer !important; appearance: none !important; margin-top: -4px !important; } :root { scrollbar-color: var(--highlight-color) #303030; } ::-webkit-scrollbar { width: 12px; height: 12px; } ::-webkit-scrollbar-track { background: #303030; } -::-webkit-scrollbar-thumb { background-color: var(--highlight-color); border-radius: var(--radius-lg); border-width: 0; box-shadow: 2px 2px 3px #111111; } +::-webkit-scrollbar-thumb { background-color: var(--highlight-color); border-radius: var(--radius-lg); border-width: 0; box-shadow: 2px 2px 3px var(--neutral-950); } div.form { border-width: 0; box-shadow: none; background: transparent; overflow: visible; } /* gradio style classes */ @@ -61,7 +72,7 @@ fieldset .gr-block.gr-box, label.block span { padding: 0; margin-top: -4px; } .border-2 { border-width: 0; } .border-b-2 { border-bottom-width: 2px; border-color: var(--highlight-color) !important; padding-bottom: 2px; margin-bottom: 8px; } .bg-white { color: lightyellow; background-color: var(--inactive-color); } -.gr-box { border-radius: var(--radius-sm) !important; background-color: #111111 !important; box-shadow: none; border-width: 0; padding: 4px; margin: 12px 0px 12px 0px } +.gr-box { border-radius: var(--radius-sm) !important; background-color: var(--neutral-950) !important; box-shadow: none; border-width: 0; padding: 4px; margin: 12px 0px 12px 0px } .gr-button { font-weight: normal; box-shadow: none; font-size: 0.8rem; min-width: 32px; min-height: 32px; padding: 3px; margin: 3px; } .gr-check-radio { background-color: var(--inactive-color); border-width: 0; border-radius: var(--radius-lg); box-shadow: none; } .gr-check-radio:checked { background-color: var(--highlight-color); } @@ -71,6 +82,7 @@ fieldset .gr-block.gr-box, label.block span { padding: 0; margin-top: -4px; } .gr-input-label { color: lightyellow; border-width: 0; background: transparent; padding: 2px !important; } .gr-panel { background-color: var(--background-color); } .eta-bar { display: none !important } +.gradio-slider input[type="number"] { background: var(--neutral-950); } svg.feather.feather-image, .feather .feather-image { display: none } .gap-2 { padding-top: 8px; } .gr-box > div > div > input.gr-text-input { right: 0; width: 4em; padding: 0; top: -12px; border: none; max-height: 20px; } @@ -89,7 +101,7 @@ svg.feather.feather-image, .feather .feather-image { display: none } #tab_extensions table tr:hover, #tab_config table tr:hover { background-color: var(--neutral-500) !important; } #tab_extensions table, #tab_config table { width: 96vw } #tab_extensions table thead, #tab_config table thead { background-color: var(--neutral-700); } -#tab_extensions table, #tab_config table { background-color: #222222; } +#tab_extensions table, #tab_config table { background-color: var(--neutral-900); } /* automatic style classes */ .progressDiv { border-radius: var(--radius-sm) !important; position: fixed; top: 44px; right: 26px; max-width: 262px; height: 48px; z-index: 99; box-shadow: var(--button-shadow); } @@ -110,11 +122,11 @@ svg.feather.feather-image, .feather .feather-image { display: none } #txt2img_prompt > label > textarea, #txt2img_neg_prompt > label > textarea, #img2img_prompt > label > textarea, #img2img_neg_prompt > label > textarea, #control_prompt > label > textarea, #control_neg_prompt > label > textarea { font-size: 1.0em; line-height: 1.4em; } #txt2img_styles, #img2img_styles, #control_styles { padding: 0; } #txt2img_styles_refresh, #img2img_styles_refresh, #control_styles_refresh { padding: 0; margin-top: 1em; } -#img2img_settings { min-width: calc(2 * var(--left-column)); max-width: calc(2 * var(--left-column)); background-color: #111111; padding-top: 16px; } +#img2img_settings { min-width: calc(2 * var(--left-column)); max-width: calc(2 * var(--left-column)); background-color: var(--neutral-950); padding-top: 16px; } #interrogate, #deepbooru { margin: 0 0px 10px 0px; max-width: 80px; max-height: 80px; font-weight: normal; font-size: 0.95em; } #quicksettings .gr-button-tool { font-size: 1.6rem; box-shadow: none; margin-left: -20px; margin-top: -2px; height: 2.4em; } #open_folder_extras, #footer, #style_pos_col, #style_neg_col, #roll_col, #extras_upscaler_2, #extras_upscaler_2_visibility, #txt2img_seed_resize_from_w, #txt2img_seed_resize_from_h { display: none; } -#save-animation { border-radius: var(--radius-sm) !important; margin-bottom: 16px; background-color: #111111; } +#save-animation { border-radius: var(--radius-sm) !important; margin-bottom: 16px; background-color: var(--neutral-950); } #script_list { padding: 4px; margin-top: 16px; margin-bottom: 8px; } #settings > div.flex-wrap { width: 15em; } #settings_search { margin-top: 1em; margin-left: 1em; } @@ -124,7 +136,7 @@ svg.feather.feather-image, .feather .feather-image { display: none } textarea[rows="1"] { height: 33px !important; width: 99% !important; padding: 8px !important; } #extras_upscale { margin-top: 10px } #txt2img_progress_row > div { min-width: var(--left-column); max-width: var(--left-column); } -#txt2img_settings { min-width: var(--left-column); max-width: var(--left-column); background-color: #111111; padding-top: 16px; } +#txt2img_settings { min-width: var(--left-column); max-width: var(--left-column); background-color: var(--neutral-950); padding-top: 16px; } #pnginfo_html2_info { margin-top: -18px; background-color: var(--input-background-fill); padding: var(--input-padding) } #txt2img_styles_row, #img2img_styles_row, #control_styles_row { margin-top: -6px; } @@ -188,7 +200,7 @@ textarea[rows="1"] { height: 33px !important; width: 99% !important; padding: 8p --slider_color: None; --stat-background-fill: linear-gradient(to right, var(--primary-400), var(--primary-600)); --table-border-color: var(--neutral-700); - --table-even-background-fill: #222222; + --table-even-background-fill: var(--neutral-900); --table-odd-background-fill: #303030; --table-row-focus: var(--color-accent-soft); --button-border-width: var(--input-border-width); @@ -196,13 +208,13 @@ textarea[rows="1"] { height: 33px !important; width: 99% !important; padding: 8p --button-cancel-background-fill-hover: linear-gradient(to bottom right, #dc2626, #dc2626); --button-cancel-border-color: #dc2626; --button-cancel-border-color-hover: var(--button-cancel-border-color); - --button-cancel-text-color: white; + --button-cancel-text-color: var(--neutral-50); --button-cancel-text-color-hover: var(--button-cancel-text-color); --button-primary-background-fill: linear-gradient(to bottom right, var(--primary-500), var(--primary-800)); --button-primary-background-fill-hover: linear-gradient(to bottom right, var(--primary-500), var(--primary-300)); --button-primary-border-color: var(--primary-500); --button-primary-border-color-hover: var(--button-primary-border-color); - --button-primary-text-color: white; + --button-primary-text-color: var(--neutral-50); --button-primary-text-color-hover: var(--button-primary-text-color); --button-secondary-border-color: var(--neutral-600); --button-secondary-border-color-hover: var(--button-secondary-border-color); @@ -218,22 +230,6 @@ textarea[rows="1"] { height: 33px !important; width: 99% !important; padding: 8p --secondary-800: #1e40af; --secondary-900: #1e3a8a; --secondary-950: #1d3660; - --neutral-50: #f0f0f0; - --neutral-100: #e0e0e0; - --neutral-200: #d0d0d0; - --neutral-300: #b0b0b0; - --neutral-400: #909090; - --neutral-500: #707070; - --neutral-600: #606060; - --neutral-700: #404040; - --neutral-800: #303030; - --neutral-900: #111827; - --neutral-950: #0b0f19; - --radius-xxs: 0; - --radius-xs: 0; - --radius-md: 0; - --radius-xl: 0; - --radius-xxl: 0; --body-text-size: var(--text-md); --body-text-weight: 400; --embed-radius: var(--radius-lg); From b32dbf16a462c2a71fe02b9d6d74efbb4125f350 Mon Sep 17 00:00:00 2001 From: Vladimir Mandic Date: Fri, 23 Feb 2024 12:09:53 -0500 Subject: [PATCH 04/10] minor updates --- javascript/black-teal.css | 18 ++++++++++-------- javascript/setHints.js | 20 ++++++++++++++++++++ 2 files changed, 30 insertions(+), 8 deletions(-) diff --git a/javascript/black-teal.css b/javascript/black-teal.css index d1745666a..8397453b8 100644 --- a/javascript/black-teal.css +++ b/javascript/black-teal.css @@ -4,7 +4,7 @@ --font: 'NotoSans'; --font-mono: 'ui-monospace', 'Consolas', monospace; --font-size: 16px; - --primary-50: #7dffff; + --primary-50: #7dffff; --primary-100: #72e8e8; --primary-200: #67d2d2; --primary-300: #5dbcbc; @@ -15,7 +15,7 @@ --primary-800: #2b5656; --primary-900: #224444; --primary-950: #193232; - --neutral-50: #f0f0f0; + --neutral-50: #f0f0f0; --neutral-100: #e0e0e0; --neutral-200: #d0d0d0; --neutral-300: #b0b0b0; @@ -30,14 +30,17 @@ --inactive-color: var(--primary--800); --body-text-color: var(--neutral-100); --body-text-color-subdued: var(--neutral-300); - --background-color: #050505; + --background-color: black; --background-fill-primary: var(--neutral-700); --input-padding: 4px; --input-background-fill: var(--neutral-800); --input-shadow: none; + --button-primary-text-color: var(--neutral-100); + --button-primary-background-fill: var(--primary-600); + --button-primary-background-fill-hover: var(--primary-800); --button-secondary-text-color: var(--neutral-100); - --button-secondary-background-fill: linear-gradient(to bottom right, var(--neutral-400), var(--neutral-700)); - --button-secondary-background-fill-hover: linear-gradient(to bottom right, var(--neutral-700), var(--neutral-400)); + --button-secondary-background-fill: var(--neutral-600); + --button-secondary-background-fill-hover: var(--neutral-800); --block-title-text-color: var(--neutral-300); --radius-xxs: 0; --radius-xs: 1; @@ -67,6 +70,8 @@ input[type=range]::-moz-range-thumb { border: 0px solid #000000 !important; ::-webkit-scrollbar-thumb { background-color: var(--highlight-color); border-radius: var(--radius-lg); border-width: 0; box-shadow: 2px 2px 3px var(--neutral-950); } div.form { border-width: 0; box-shadow: none; background: transparent; overflow: visible; } +.button-icon { font-size: 1.5em !important; margin: 0 !important; padding: 0 !important; height: 1.7em !important; min-height: unset !important; } + /* gradio style classes */ fieldset .gr-block.gr-box, label.block span { padding: 0; margin-top: -4px; } .border-2 { border-width: 0; } @@ -210,11 +215,8 @@ textarea[rows="1"] { height: 33px !important; width: 99% !important; padding: 8p --button-cancel-border-color-hover: var(--button-cancel-border-color); --button-cancel-text-color: var(--neutral-50); --button-cancel-text-color-hover: var(--button-cancel-text-color); - --button-primary-background-fill: linear-gradient(to bottom right, var(--primary-500), var(--primary-800)); - --button-primary-background-fill-hover: linear-gradient(to bottom right, var(--primary-500), var(--primary-300)); --button-primary-border-color: var(--primary-500); --button-primary-border-color-hover: var(--button-primary-border-color); - --button-primary-text-color: var(--neutral-50); --button-primary-text-color-hover: var(--button-primary-text-color); --button-secondary-border-color: var(--neutral-600); --button-secondary-border-color-hover: var(--button-secondary-border-color); diff --git a/javascript/setHints.js b/javascript/setHints.js index e7bbe0d7b..66720056b 100644 --- a/javascript/setHints.js +++ b/javascript/setHints.js @@ -41,6 +41,25 @@ async function validateHints(elements, data) { log('in locale but not ui:', missingUI); } +async function replaceButtonText(el) { + // https://www.nerdfonts.com/cheat-sheet + // use unicode of icon with format nf-md-_circle + const textIcons = { + Generate: '\uf144', + Enqueue: '\udb81\udc17', + Stop: '\udb81\ude66', + Skip: '\udb81\ude61', + Pause: '\udb80\udfe5', + Restore: '\udb82\udd9b', + Clear: '\udb80\udd59', + Networks: '\uf261', + }; + if (textIcons[el.innerText]) { + el.classList.add('button-icon'); + el.innerText = textIcons[el.innerText]; + } +} + async function setHints() { if (localeData.finished) return; if (localeData.data.length === 0) { @@ -66,6 +85,7 @@ async function setHints() { localized++; el.textContent = found.localized; } + // replaceButtonText(el); if (found?.hint?.length > 0) { hints++; if (localeData.type === 1) { From 72e938621b07f5afee50ecf8e437a05063b407f3 Mon Sep 17 00:00:00 2001 From: Seunghoon Lee Date: Sat, 24 Feb 2024 13:35:22 +0900 Subject: [PATCH 05/10] fix installer for zluda --- installer.py | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/installer.py b/installer.py index af97fc898..1d1c22f18 100644 --- a/installer.py +++ b/installer.py @@ -920,7 +920,7 @@ def patch_zluda(): if zluda_path is None: log.warning('Failed to automatically patch torch with ZLUDA. Could not find ZLUDA from PATH.') return - venv_path = os.path.dirname(shutil.which('python')) + venv_dir = os.environ.get('VENV_DIR', os.path.dirname(shutil.which('python'))) dlls_to_patch = { 'cublas.dll': 'cublas64_11.dll', 'cudnn.dll': 'cudnn64_8.dll', @@ -929,7 +929,7 @@ def patch_zluda(): } try: for k, v in dlls_to_patch.items(): - shutil.copyfile(os.path.join(zluda_path, k), os.path.join(venv_path, 'Lib', 'site-packages', 'torch', 'lib', v)) + shutil.copyfile(os.path.join(zluda_path, k), os.path.join(venv_dir, 'Lib', 'site-packages', 'torch', 'lib', v)) except Exception as e: log.warning(f'ZLUDA: failed to automatically patch torch: {e}') From f6ef263c0c958d2b66a98515a10610aab780aecc Mon Sep 17 00:00:00 2001 From: Seunghoon Lee Date: Sat, 24 Feb 2024 15:54:08 +0900 Subject: [PATCH 06/10] fix zluda --- installer.py | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/installer.py b/installer.py index 1d1c22f18..1ee471bd3 100644 --- a/installer.py +++ b/installer.py @@ -923,7 +923,7 @@ def patch_zluda(): venv_dir = os.environ.get('VENV_DIR', os.path.dirname(shutil.which('python'))) dlls_to_patch = { 'cublas.dll': 'cublas64_11.dll', - 'cudnn.dll': 'cudnn64_8.dll', + #'cudnn.dll': 'cudnn64_8.dll', 'cusparse.dll': 'cusparse64_11.dll', 'nvrtc.dll': 'nvrtc64_112_0.dll', } From 533951423ed9c8c6c8504ac87a70c295237a7459 Mon Sep 17 00:00:00 2001 From: Vladimir Mandic Date: Sat, 24 Feb 2024 07:42:45 -0500 Subject: [PATCH 07/10] fix en refresh --- modules/ui_extra_networks.py | 13 +------------ wiki | 2 +- 2 files changed, 2 insertions(+), 13 deletions(-) diff --git a/modules/ui_extra_networks.py b/modules/ui_extra_networks.py index 9dabf5565..25f75c9f9 100644 --- a/modules/ui_extra_networks.py +++ b/modules/ui_extra_networks.py @@ -251,10 +251,7 @@ def create_page(self, tabname, skip = False): htmls.append(self.create_html(item, tabname)) self.html += ''.join(htmls) self.page_time = time.time() - if len(subdirs_html) > 0 or len(self.html) > 0: - self.html = f"
{subdirs_html}
{self.html}
" - else: - return '' + self.html = f"
{subdirs_html}
{self.html}
" shared.log.debug(f"Extra networks: page='{self.name}' items={len(self.items)} subfolders={len(subdirs)} tab={tabname} folders={self.allowed_directories_for_previews()} list={self.list_time:.2f} thumb={self.preview_time:.2f} desc={self.desc_time:.2f} info={self.info_time:.2f} workers={shared.max_workers}") if len(self.missing_thumbs) > 0: threading.Thread(target=self.create_thumb).start() @@ -585,8 +582,6 @@ def ui_tab_change(page): executor.submit(page.create_items, ui.tabname) for page in get_pages(): page.create_page(ui.tabname, skip_indexing) - if len(page.items) == 0: - continue with gr.Tab(page.title, id=page.title.lower().replace(" ", "_"), elem_classes="extra-networks-tab") as tab: page_html = gr.HTML(page.html, elem_id=f'{tabname}{page.name}_extra_page', elem_classes="extra-networks-page") ui.pages.append(page_html) @@ -821,12 +816,6 @@ def ui_quicksave_click(name): "prompt": prompt, "negative": params.get('Negative prompt', ''), "extra": '', - # "type": 'Style', - # "title": name, - # "filename": fn, - # "search_term": None, - # "preview": None, - # "local_preview": None, } shared.writefile(item, fn, silent=True) if len(prompt) > 0: diff --git a/wiki b/wiki index 9c62124db..ddd8158ac 160000 --- a/wiki +++ b/wiki @@ -1 +1 @@ -Subproject commit 9c62124dbe7521162a22b297481aadfae1deeb01 +Subproject commit ddd8158ac1b86cfaba1b5fa9929bb5214775bb9f From c1dfb1b28e37f286107b44740ccf6d1733233992 Mon Sep 17 00:00:00 2001 From: Vladimir Mandic Date: Sat, 24 Feb 2024 08:23:08 -0500 Subject: [PATCH 08/10] update changelog --- CHANGELOG.md | 9 +++++++++ javascript/black-teal.css | 4 ++-- javascript/sdnext.css | 2 +- 3 files changed, 12 insertions(+), 3 deletions(-) diff --git a/CHANGELOG.md b/CHANGELOG.md index b5f0a907b..163647ad4 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -1,5 +1,14 @@ # Change Log for SD.Next +## Update for 2024-02-24 + +- **Improvements** + - default theme updates + - additional built-in theme *black-gray* +- **Fixes** + - fix extra networks refresh + - improve ZLUDA installer when using `--use-zluda` cli param, thanks @lshqqytiger + ## Update for 2024-02-22 Only 3 weeks since last release, but here's another feature-packed one! diff --git a/javascript/black-teal.css b/javascript/black-teal.css index 8397453b8..34250a660 100644 --- a/javascript/black-teal.css +++ b/javascript/black-teal.css @@ -87,7 +87,7 @@ fieldset .gr-block.gr-box, label.block span { padding: 0; margin-top: -4px; } .gr-input-label { color: lightyellow; border-width: 0; background: transparent; padding: 2px !important; } .gr-panel { background-color: var(--background-color); } .eta-bar { display: none !important } -.gradio-slider input[type="number"] { background: var(--neutral-950); } +.gradio-slider input[type="number"] { background: var(--neutral-950); margin-top: 2px; } svg.feather.feather-image, .feather .feather-image { display: none } .gap-2 { padding-top: 8px; } .gr-box > div > div > input.gr-text-input { right: 0; width: 4em; padding: 0; top: -12px; border: none; max-height: 20px; } @@ -125,7 +125,7 @@ svg.feather.feather-image, .feather .feather-image { display: none } #txt2img_prompt, #txt2img_neg_prompt, #img2img_prompt, #img2img_neg_prompt, #control_prompt, #control_neg_prompt { background-color: var(--background-color); box-shadow: none !important; } #txt2img_prompt > label > textarea, #txt2img_neg_prompt > label > textarea, #img2img_prompt > label > textarea, #img2img_neg_prompt > label > textarea, #control_prompt > label > textarea, #control_neg_prompt > label > textarea { font-size: 1.0em; line-height: 1.4em; } -#txt2img_styles, #img2img_styles, #control_styles { padding: 0; } +#txt2img_styles, #img2img_styles, #control_styles { padding: 0; margin-top: 2px; } #txt2img_styles_refresh, #img2img_styles_refresh, #control_styles_refresh { padding: 0; margin-top: 1em; } #img2img_settings { min-width: calc(2 * var(--left-column)); max-width: calc(2 * var(--left-column)); background-color: var(--neutral-950); padding-top: 16px; } #interrogate, #deepbooru { margin: 0 0px 10px 0px; max-width: 80px; max-height: 80px; font-weight: normal; font-size: 0.95em; } diff --git a/javascript/sdnext.css b/javascript/sdnext.css index a2af3a78a..597c6b7cc 100644 --- a/javascript/sdnext.css +++ b/javascript/sdnext.css @@ -83,7 +83,7 @@ button.custom-button{ border-radius: var(--button-large-radius); padding: var(-- #txt2img_footer, #img2img_footer, #control_footer { height: fit-content; display: none; } #txt2img_generate_box, #img2img_generate_box, #control_general_box { gap: 0.5em; flex-wrap: wrap-reverse; height: fit-content; } #txt2img_actions_column, #img2img_actions_column, #control_actions_column { gap: 0.3em; height: fit-content; } -#txt2img_generate_box>button, #img2img_generate_box>button, #control_generate_box>button, #txt2img_enqueue, #img2img_enqueue { min-height: 44px; max-height: 44px; line-height: 1em; } +#txt2img_generate_box>button, #img2img_generate_box>button, #control_generate_box>button, #txt2img_enqueue, #img2img_enqueue { min-height: 44px !important; max-height: 44px !important; line-height: 1em; } #txt2img_generate_line2, #img2img_generate_line2, #txt2img_tools, #img2img_tools, #control_generate_line2, #control_tools { display: flex; } #txt2img_generate_line2>button, #img2img_generate_line2>button, #extras_generate_box>button, #control_generate_line2>button, #txt2img_tools>button, #img2img_tools>button, #control_tools>button { height: 2em; line-height: 0; font-size: var(--text-md); min-width: unset; display: block !important; } From 8925cdc51ccc7432e25a388518e4d8bf9a4243a5 Mon Sep 17 00:00:00 2001 From: QuantumSoul Date: Thu, 29 Feb 2024 02:57:15 +0100 Subject: [PATCH 09/10] Update ui_sections.py elemids --- modules/ui_sections.py | 8 ++++---- 1 file changed, 4 insertions(+), 4 deletions(-) diff --git a/modules/ui_sections.py b/modules/ui_sections.py index f5ccb41de..5aea007a2 100644 --- a/modules/ui_sections.py +++ b/modules/ui_sections.py @@ -112,7 +112,7 @@ def create_advanced_inputs(tab): clip_skip = gr.Slider(label='CLIP skip', value=1, minimum=0, maximum=12, step=0.1, elem_id=f"{tab}_clip_skip", interactive=True) with gr.Group(): gr.HTML('
') - with gr.Row(): + with gr.Row(elem_id=f"{tab}_advanced_options"): full_quality = gr.Checkbox(label='Full quality', value=True, elem_id=f"{tab}_full_quality") restore_faces = gr.Checkbox(label='Face restore', value=False, visible=len(shared.face_restorers) > 1, elem_id=f"{tab}_restore_faces") tiling = gr.Checkbox(label='Tiling', value=False, elem_id=f"{tab}_tiling", visible=shared.backend == shared.Backend.ORIGINAL) @@ -165,10 +165,10 @@ def set_sampler_diffuser_options(sampler_options): values = [] values += ['brownian noise'] if shared.opts.data.get('schedulers_brownian_noise', False) else [] values += ['discard penultimate sigma'] if shared.opts.data.get('schedulers_discard_penultimate', True) else [] - sampler_options = gr.CheckboxGroup(label='Sampler options', choices=choices, value=values, type='value') + sampler_options = gr.CheckboxGroup(label='Sampler options', elem_id=f"{tabname}_sampler_options", choices=choices, value=values, type='value') with gr.Row(elem_classes=['flex-break']): shared.opts.data['schedulers_sigma'] = shared.opts.data.get('schedulers_sigma', 'default') - sampler_algo = gr.Radio(label='Sigma algorithm', choices=['default', 'karras', 'exponential', 'polyexponential'], value=shared.opts.data['schedulers_sigma'], type='value') + sampler_algo = gr.Radio(label='Sigma algorithm', elem_id=f"{tabname}_sigma_algo", choices=['default', 'karras', 'exponential', 'polyexponential'], value=shared.opts.data['schedulers_sigma'], type='value') sampler_options.change(fn=set_sampler_original_options, inputs=[sampler_options, sampler_algo], outputs=[]) sampler_algo.change(fn=set_sampler_original_options, inputs=[sampler_options, sampler_algo], outputs=[]) else: @@ -179,7 +179,7 @@ def set_sampler_diffuser_options(sampler_options): values += ['dynamic threshold'] if shared.opts.data.get('schedulers_use_thresholding', False) else [] values += ['low order'] if shared.opts.data.get('schedulers_use_loworder', True) else [] values += ['rescale beta'] if shared.opts.data.get('schedulers_rescale_betas', False) else [] - sampler_options = gr.CheckboxGroup(label='Sampler options', choices=choices, value=values, type='value') + sampler_options = gr.CheckboxGroup(label='Sampler options', elem_id=f"{tabname}_sampler_options", choices=choices, value=values, type='value') sampler_options.change(fn=set_sampler_diffuser_options, inputs=[sampler_options], outputs=[]) return steps, sampler_index From d182cd58d267f9159e64929f4bffac9d189ebdef Mon Sep 17 00:00:00 2001 From: Vladimir Mandic Date: Fri, 1 Mar 2024 09:11:48 -0500 Subject: [PATCH 10/10] refresh --- CHANGELOG.md | 57 +++++++++++++++++++++++++++++++++++++++++++++++----- installer.py | 39 +++++++++++++++++++++++++++++++---- wiki | 2 +- 3 files changed, 88 insertions(+), 10 deletions(-) diff --git a/CHANGELOG.md b/CHANGELOG.md index 163647ad4..f48e47b66 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -1,13 +1,60 @@ # Change Log for SD.Next -## Update for 2024-02-24 - +## TODO + +- EDM samplers for Playground require `diffusers==0.27.0` +- StableCascade requires diffusers `kashif/diffusers.git@wuerstchen-v3` + +## Update for 2024-03-01 + +- [Playground v2.5](https://huggingface.co/playgroundai/playground-v2.5-1024px-aesthetic) + - new model version from Playground: based on SDXL, but with some cool new concepts + - download using networks -> reference + - set sampler to *DPM++ 2M EDM* or *Euler EDM* +- [KOALA 700M](https://github.com/youngwanLEE/sdxl-koala) + - another very fast & light sd-xl model where original unet was compressed and distilled to 54% of original size + - download using networks -> reference + - *note* to download fp16 variant (recommended), set settings -> diffusers -> preferred model variant +- **Image2Video** + - new module for creating videos from images + - simply enable from *img2img -> scripts -> image2video* + - based on [VGen](https://huggingface.co/ali-vilab/i2vgen-xl) +- **VQA** visual question & answer in interrogate + - with support for multiple variations of base models: *GIT, BLIP, ViLT, PIX* +- **Second Pass / Refine** + - independent upscale and hires options: run hires without upscale or upscale without hires or both + - upscale can now run 0.1-8.0 scale and will also run if enabled at 1.0 to allow for upscalers that simply improve image quality + - update ui section to reflect changes + - *note*: behavior using backend:original is unchanged for backwards compatibilty +- **Samplers** + - [TCD](https://mhh0318.github.io/tcd/): Trajectory Consistency Distillation + new sampler that produces consistent results in a very low number of steps (comparable to LCM but without reliance on LoRA) + for best results, use with TCD LoRA: + - *DPM++ 2M EDM* and *Euler EDM* + EDM is a new solver algorithm currently available for DPM++2M and Euler samplers + Note that using EDM samplers with non-EDM optimized models will provide just noise and vice-versa - **Improvements** - - default theme updates - - additional built-in theme *black-gray* + - **FaceID** extend support for LoRA, HyperTile and FreeU, thanks @Trojaner + - **Tiling** now extends to both Unet and VAE producing smoother outputs, thanks @AI-Casanova + - new setting in image options: *include mask in output* + - default theme updates and additional built-in theme *black-gray* + - add **ROCm** 6.0 nightly option to installer, thanks @jicka + - support models with their own YAML model config files + - support models with their own JSON per-component config files, for example: `playground-v2.5_vae.config` +- **Internal** + - remove obsolete textual inversion training code + - remove obsolete hypernetworks training code - **Fixes** + - improve model cpu offload compatibility + - improve model sequential offload compatibility + - improve bfloat16 compatibility - fix extra networks refresh - - improve ZLUDA installer when using `--use-zluda` cli param, thanks @lshqqytiger + - fix sdp memory attention in backend original + - fix autodetect sd21 models + - fix api info endpoint + - fix sampler eta in xyz grid, thanks @AI-Casanova + - exception handler around vram memory stats gather + - improve ZLUDA installer with `--use-zluda` cli param, thanks @lshqqytiger ## Update for 2024-02-22 diff --git a/installer.py b/installer.py index 1ee471bd3..8b7aa18cc 100644 --- a/installer.py +++ b/installer.py @@ -482,13 +482,33 @@ def is_rocm_available(): torch_command = os.environ.get('TORCH_COMMAND', 'torch==2.2.0 torchvision --index-url https://download.pytorch.org/whl/cu118') log.warning("ZLUDA support: experimental") zluda_need_dll_patch = is_windows and not installed('torch') + zluda_path = find_zluda() + if zluda_path is None: + import urllib.request + if is_windows: + import zipfile + archive_type = zipfile.ZipFile + zluda_url = 'https://github.com/lshqqytiger/ZLUDA/releases/download/v3.5-win/ZLUDA-windows-amd64.zip' + else: + import tarfile + archive_type = tarfile.TarFile + zluda_url = 'https://github.com/vosen/ZLUDA/releases/download/v3/zluda-3-linux.tar.gz' + urllib.request.urlretrieve(zluda_url, '_zluda') + with archive_type('_zluda', 'r') as f: + f.extractall('.zluda') + zluda_path = os.path.abspath('./.zluda') + os.remove('_zluda') + log.debug(f'Found ZLUDA in {zluda_path}') + paths = os.environ.get('PATH', '.') + if zluda_path not in paths: + os.environ['PATH'] = paths + ';' + zluda_path elif is_windows: # TODO TBD after ROCm for Windows is released log.warning("HIP SDK is detected, but no Torch release for Windows available") log.info("For ZLUDA support specify '--use-zluda'") log.info('Using CPU-only torch') torch_command = os.environ.get('TORCH_COMMAND', 'torch torchvision') else: - if rocm_ver in {"5.7"}: + if rocm_ver in {"5.7", "6.0"}: torch_command = os.environ.get('TORCH_COMMAND', f'torch torchvision --pre --index-url https://download.pytorch.org/whl/nightly/rocm{rocm_ver}') elif rocm_ver in {"5.5", "5.6"}: torch_command = os.environ.get('TORCH_COMMAND', f'torch torchvision --index-url https://download.pytorch.org/whl/nightly/rocm{rocm_ver}') @@ -909,7 +929,7 @@ def get_onnxruntime_source_for_rocm(rocm_ver): return 'onnxruntime-gpu' -def patch_zluda(): +def find_zluda(): zluda_path = os.environ.get('ZLUDA', None) if zluda_path is None: paths = os.environ.get('PATH', '').split(';') @@ -917,6 +937,11 @@ def patch_zluda(): if os.path.exists(os.path.join(path, 'zluda_redirect.dll')): zluda_path = path break + return zluda_path + + +def patch_zluda(): + zluda_path = find_zluda() if zluda_path is None: log.warning('Failed to automatically patch torch with ZLUDA. Could not find ZLUDA from PATH.') return @@ -1028,8 +1053,6 @@ def check_timestamp(): def add_args(parser): group = parser.add_argument_group('Setup options') - group.add_argument("--log", type=str, default=os.environ.get("SD_LOG", None), help="Set log file, default: %(default)s") - group.add_argument('--debug', default = os.environ.get("SD_DEBUG",False), action='store_true', help = "Run installer with debug logging, default: %(default)s") group.add_argument('--reset', default = os.environ.get("SD_RESET",False), action='store_true', help = "Reset main repository to latest version, default: %(default)s") group.add_argument('--upgrade', default = os.environ.get("SD_UPGRADE",False), action='store_true', help = "Upgrade main repository to latest version, default: %(default)s") group.add_argument('--requirements', default = os.environ.get("SD_REQUIREMENTS",False), action='store_true', help = "Force re-check of requirements, default: %(default)s") @@ -1039,6 +1062,7 @@ def add_args(parser): group.add_argument("--use-ipex", default = os.environ.get("SD_USEIPEX",False), action='store_true', help="Force use Intel OneAPI XPU backend, default: %(default)s") group.add_argument("--use-cuda", default = os.environ.get("SD_USECUDA",False), action='store_true', help="Force use nVidia CUDA backend, default: %(default)s") group.add_argument("--use-rocm", default = os.environ.get("SD_USEROCM",False), action='store_true', help="Force use AMD ROCm backend, default: %(default)s") + group.add_argument('--use-zluda', default=os.environ.get("SD_USEZLUDA", False), action='store_true', help = "Force use ZLUDA, AMD GPUs only, default: %(default)s") group.add_argument("--use-xformers", default = os.environ.get("SD_USEXFORMERS",False), action='store_true', help="Force use xFormers cross-optimization, default: %(default)s") group.add_argument('--skip-requirements', default = os.environ.get("SD_SKIPREQUIREMENTS",False), action='store_true', help = "Skips checking and installing requirements, default: %(default)s") group.add_argument('--skip-extensions', default = os.environ.get("SD_SKIPEXTENSION",False), action='store_true', help = "Skips running individual extension installers, default: %(default)s") @@ -1053,6 +1077,13 @@ def add_args(parser): group.add_argument('--ignore', default = os.environ.get("SD_IGNORE",False), action='store_true', help = "Ignore any errors and attempt to continue") group.add_argument('--safe', default = os.environ.get("SD_SAFE",False), action='store_true', help = "Run in safe mode with no user extensions") + group = parser.add_argument_group('Logging options') + group.add_argument("--log", type=str, default=os.environ.get("SD_LOG", None), help="Set log file, default: %(default)s") + group.add_argument('--debug', default = os.environ.get("SD_DEBUG",False), action='store_true', help = "Run installer with debug logging, default: %(default)s") + group.add_argument("--profile", default=os.environ.get("SD_PROFILE", False), action='store_true', help="Run profiler, default: %(default)s") + group.add_argument('--docs', default=os.environ.get("SD_DOCS", False), action='store_true', help = "Mount API docs, default: %(default)s") + group.add_argument("--api-log", default=os.environ.get("SD_APILOG", False), action='store_true', help="Enable logging of all API requests, default: %(default)s") + def parse_args(parser): # command line args diff --git a/wiki b/wiki index ddd8158ac..5c52cbb73 160000 --- a/wiki +++ b/wiki @@ -1 +1 @@ -Subproject commit ddd8158ac1b86cfaba1b5fa9929bb5214775bb9f +Subproject commit 5c52cbb7301c3e008a9dfd76702f9321ae7b3a34