alphard/ComfyUI-Lora-Manager
1
0
Fork 0
mirror of https://github.com/willmiao/ComfyUI-Lora-Manager.git synced 2026-03-21 21:22:11 -03:00
Code Issues Packages Projects Releases Wiki Activity

feat: standardize LoRA Manager frontend with CSS classes and improved styles

Browse Source 
- 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:
Will Miao
2025-10-21 17:42:32 +08:00
parent 49b9b7a5ea
commit f4eb916914
8 changed files with 584 additions and 569 deletions
Download Patch File Download Diff File Expand all files Collapse all files

10
tests/frontend/components/lorasWidgetEvents.interactions.test.js
View File

@@ -28,14 +28,14 @@ vi.mock(COMPONENTS_MODULE, () => ({
describe('LoRA widget drag interactions', () => {
beforeEach(() => {
document.body.innerHTML = '';
const dragStyle = document.getElementById('comfy-lora-drag-style');
const dragStyle = document.getElementById('lm-lora-shared-styles');
if (dragStyle) {
dragStyle.remove();
}
});
afterEach(() => {
document.body.classList.remove('comfy-lora-dragging');
document.body.classList.remove('lm-lora-strength-dragging');
});
it('adjusts a single LoRA strength while syncing collapsed clip strength', async () => {
@@ -84,7 +84,7 @@ describe('LoRA widget drag interactions', () => {
const previewSpy = { hide: vi.fn() };
const dragEl = document.createElement('div');
dragEl.className = 'comfy-lora-entry';
dragEl.className = 'lm-lora-entry';
document.body.append(dragEl);
const widget = {
@@ -95,7 +95,7 @@ describe('LoRA widget drag interactions', () => {
module.initDrag(dragEl, 'Test', widget, false, previewSpy, renderSpy);
dragEl.dispatchEvent(new MouseEvent('mousedown', { clientX: 50, bubbles: true }));
expect(document.body.classList.contains('comfy-lora-dragging')).toBe(true);
expect(document.body.classList.contains('lm-lora-strength-dragging')).toBe(true);
document.dispatchEvent(new MouseEvent('mousemove', { clientX: 70, bubbles: true }));
expect(renderSpy).toHaveBeenCalledWith(widget.value, widget);
@@ -103,6 +103,6 @@ describe('LoRA widget drag interactions', () => {
expect(widget.value[0].strength).not.toBe(0.5);
document.dispatchEvent(new MouseEvent('mouseup'));
expect(document.body.classList.contains('comfy-lora-dragging')).toBe(false);
expect(document.body.classList.contains('lm-lora-strength-dragging')).toBe(false);
});
});