refactor: rename 'lora-card' to 'model-card' across styles and scripts for consistency

This commit is contained in:
Will Miao
2025-07-25 23:23:57 +08:00
parent e4ce384023
commit 381bd3938a
21 changed files with 58 additions and 60 deletions

View File

@@ -73,12 +73,12 @@
}
/* Style for selected cards */
.lora-card.selected {
.model-card.selected {
box-shadow: 0 0 0 2px var(--lora-accent);
position: relative;
}
.lora-card.selected::after {
.model-card.selected::after {
content: "✓";
position: absolute;
top: 10px;

View File

@@ -14,7 +14,7 @@
box-sizing: border-box; /* Include padding in width calculation */
}
.lora-card {
.model-card {
background: var(--lora-surface);
border: 1px solid var(--lora-border);
border-radius: var(--border-radius-base);
@@ -30,12 +30,12 @@
overflow: hidden;
}
.lora-card:hover {
.model-card:hover {
transform: translateY(-2px);
background: oklch(100% 0 0 / 0.6);
}
.lora-card:focus-visible {
.model-card:focus-visible {
outline: 2px solid var(--lora-accent);
outline-offset: 2px;
}
@@ -47,7 +47,7 @@
grid-template-columns: repeat(auto-fill, minmax(270px, 1fr));
}
.lora-card {
.model-card {
max-width: 270px;
}
}
@@ -59,7 +59,7 @@
grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
}
.lora-card {
.model-card {
max-width: 280px;
}
}
@@ -70,7 +70,7 @@
grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
}
.lora-card {
.model-card {
max-width: 240px;
}
}
@@ -259,8 +259,8 @@
transition: opacity 0.2s ease;
}
.hover-reveal .lora-card:hover .card-header,
.hover-reveal .lora-card:hover .card-footer {
.hover-reveal .model-card:hover .card-header,
.hover-reveal .model-card:hover .card-footer {
opacity: 1;
}
@@ -345,7 +345,7 @@
grid-template-columns: minmax(260px, 1fr); /* Adjusted minimum size for mobile */
}
.lora-card {
.model-card {
max-width: 100%; /* Allow cards to fill available space on mobile */
}
}
@@ -425,8 +425,8 @@
}
/* Prevent text selection on cards and interactive elements */
.lora-card,
.lora-card *,
.model-card,
.model-card *,
.card-actions,
.card-actions i,
.toggle-blur-btn,
@@ -510,7 +510,7 @@
}
}
/* Add after the existing .lora-card:hover styles */
/* Add after the existing .model-card:hover styles */
@keyframes update-pulse {
0% { box-shadow: 0 0 0 0 var(--lora-accent-transparent); }
@@ -523,7 +523,7 @@
--lora-accent-transparent: oklch(var(--lora-accent-l) var(--lora-accent-c) var(--lora-accent-h) / 0.6);
}
.lora-card.updated {
.model-card.updated {
animation: update-pulse 1.2s ease-out;
}

View File

@@ -195,7 +195,7 @@
}
/* Make cards in duplicate groups have consistent width */
.card-group-container .lora-card {
.card-group-container .model-card {
flex: 0 0 auto;
width: 240px;
margin: 0;
@@ -241,26 +241,26 @@
}
/* Duplicate card styling */
.lora-card.duplicate {
.model-card.duplicate {
position: relative;
transition: all 0.2s ease;
}
.lora-card.duplicate:hover {
.model-card.duplicate:hover {
border-color: var(--lora-accent-l) var(--lora-accent-c) var(--lora-accent-h);
}
.lora-card.duplicate.latest {
.model-card.duplicate.latest {
border-style: solid;
border-color: oklch(var(--lora-warning-l) var(--lora-warning-c) var(--lora-warning-h));
}
.lora-card.duplicate-selected {
.model-card.duplicate-selected {
border: 2px solid oklch(var(--lora-accent-l) var(--lora-accent-c) var(--lora-accent-h));
box-shadow: 0 0 8px rgba(0, 0, 0, 0.2);
}
.lora-card .selector-checkbox {
.model-card .selector-checkbox {
position: absolute;
top: 10px;
right: 10px;
@@ -271,7 +271,7 @@
}
/* Latest indicator */
.lora-card.duplicate.latest::after {
.model-card.duplicate.latest::after {
content: "Latest";
position: absolute;
top: 10px;
@@ -365,13 +365,13 @@
}
/* Hash Mismatch Styling */
.lora-card.duplicate.hash-mismatch {
.model-card.duplicate.hash-mismatch {
border: 2px dashed oklch(var(--lora-warning-l) var(--lora-warning-c) var(--lora-warning-h));
opacity: 0.85;
position: relative;
}
.lora-card.duplicate.hash-mismatch::before {
.model-card.duplicate.hash-mismatch::before {
content: "";
position: absolute;
top: 0;
@@ -389,7 +389,7 @@
pointer-events: none;
}
.lora-card.duplicate.hash-mismatch .card-preview {
.model-card.duplicate.hash-mismatch .card-preview {
filter: grayscale(20%);
}
@@ -407,7 +407,7 @@
}
/* Disabled checkbox style */
.lora-card.duplicate.hash-mismatch .selector-checkbox {
.model-card.duplicate.hash-mismatch .selector-checkbox {
opacity: 0.5;
cursor: not-allowed;
}

View File

@@ -109,7 +109,7 @@
}
@media (prefers-reduced-motion: reduce) {
.lora-card,
.model-card,
.progress-bar,
.current-item-bar {
transition: none;