mirror of
https://github.com/willmiao/ComfyUI-Lora-Manager.git
synced 2026-03-21 21:22:11 -03:00
feat: standardize LoRA Manager frontend with CSS classes and improved styles
- Replace inline styles with CSS classes for better maintainability - Update class names to use consistent 'lm-' prefix across components - Add comprehensive CSS stylesheet with tooltip system and responsive layouts - Improve accessibility with proper focus states and keyboard navigation - Implement hover and active state transitions for enhanced UX - Refactor expand button to use CSS classes instead of inline styles - Update test files to reflect new class naming convention
This commit is contained in:
37
web/comfyui/lm_styles_loader.js
Normal file
37
web/comfyui/lm_styles_loader.js
Normal file
@@ -0,0 +1,37 @@
|
||||
const STYLE_ID = "lm-lora-shared-styles";
|
||||
let stylePromise = null;
|
||||
|
||||
function injectStyles(cssText) {
|
||||
let styleEl = document.getElementById(STYLE_ID);
|
||||
if (!styleEl) {
|
||||
styleEl = document.createElement("style");
|
||||
styleEl.id = STYLE_ID;
|
||||
document.head.appendChild(styleEl);
|
||||
}
|
||||
styleEl.textContent = cssText;
|
||||
}
|
||||
|
||||
async function loadCssText() {
|
||||
const cssUrl = new URL("./lm_styles.css", import.meta.url);
|
||||
const response = await fetch(cssUrl);
|
||||
if (!response.ok) {
|
||||
throw new Error(`Failed to load ${cssUrl}`);
|
||||
}
|
||||
return await response.text();
|
||||
}
|
||||
|
||||
export function ensureLmStyles() {
|
||||
if (!stylePromise) {
|
||||
stylePromise = loadCssText()
|
||||
.then((cssText) => {
|
||||
injectStyles(cssText);
|
||||
return true;
|
||||
})
|
||||
.catch((error) => {
|
||||
console.warn("Failed to load LoRA Manager styles", error);
|
||||
stylePromise = null;
|
||||
return false;
|
||||
});
|
||||
}
|
||||
return stylePromise;
|
||||
}
|
||||
Reference in New Issue
Block a user