feat(ui): add setting to toggle version name display on model cards (#916)

locales/de.json

@@ -428,6 +428,8 @@
                 "hover": "Bei Hover anzeigen"
             },
             "cardInfoDisplayHelp": "Wählen Sie, wann Modellinformationen und Aktionsschaltflächen angezeigt werden sollen",
+            "showVersionOnCard": "Version auf Karte anzeigen",
+            "showVersionOnCardHelp": "Den Versionsnamen auf Modellkarten ein- oder ausblenden",
             "modelCardFooterAction": "Aktion der Modellkarten-Schaltfläche",
             "modelCardFooterActionOptions": {
                 "exampleImages": "Beispielbilder öffnen",

locales/en.json

@@ -428,6 +428,8 @@
                 "hover": "Reveal on Hover"
             },
             "cardInfoDisplayHelp": "Choose when to display model information and action buttons",
+            "showVersionOnCard": "Show Version on Card",
+            "showVersionOnCardHelp": "Show or hide the version name on model cards",
             "modelCardFooterAction": "Model Card Button Action",
             "modelCardFooterActionOptions": {
                 "exampleImages": "Open Example Images",

locales/es.json

@@ -428,6 +428,8 @@
                 "hover": "Mostrar al pasar el ratón"
             },
             "cardInfoDisplayHelp": "Elige cuándo mostrar información del modelo y botones de acción",
+            "showVersionOnCard": "Mostrar versión en la tarjeta",
+            "showVersionOnCardHelp": "Mostrar u ocultar el nombre de versión en las tarjetas de modelo",
             "modelCardFooterAction": "Acción del botón de tarjeta de modelo",
             "modelCardFooterActionOptions": {
                 "exampleImages": "Abrir imágenes de ejemplo",

locales/fr.json

@@ -428,6 +428,8 @@
                 "hover": "Révéler au survol"
             },
             "cardInfoDisplayHelp": "Choisissez quand afficher les informations du modèle et les boutons d'action",
+            "showVersionOnCard": "Afficher la version sur la carte",
+            "showVersionOnCardHelp": "Afficher ou masquer le nom de version sur les cartes de modèle",
             "modelCardFooterAction": "Action du bouton de carte de modèle",
             "modelCardFooterActionOptions": {
                 "exampleImages": "Ouvrir les images d'exemple",

locales/he.json

@@ -428,6 +428,8 @@
                 "hover": "חשוף בריחוף"
             },
             "cardInfoDisplayHelp": "בחר מתי להציג מידע על המודל וכפתורי פעולה",
+            "showVersionOnCard": "הצג גרסה בכרטיס",
+            "showVersionOnCardHelp": "הצג או הסתר את שם הגרסה בכרטיסי המודל",
             "modelCardFooterAction": "פעולת כפתור כרטיס מודל",
             "modelCardFooterActionOptions": {
                 "exampleImages": "פתח תמונות דוגמה",

locales/ja.json

@@ -428,6 +428,8 @@
                 "hover": "ホバー時に表示"
             },
             "cardInfoDisplayHelp": "モデル情報とアクションボタンの表示タイミングを選択",
+            "showVersionOnCard": "カードにバージョンを表示",
+            "showVersionOnCardHelp": "モデルカード上のバージョン名の表示/非表示を切り替えます",
             "modelCardFooterAction": "モデルカードボタンのアクション",
             "modelCardFooterActionOptions": {
                 "exampleImages": "例画像を開く",

locales/ko.json

@@ -428,6 +428,8 @@
                 "hover": "호버 시 표시"
             },
             "cardInfoDisplayHelp": "모델 정보 및 액션 버튼을 언제 표시할지 선택하세요",
+            "showVersionOnCard": "카드에 버전 표시",
+            "showVersionOnCardHelp": "모델 카드에 버전 이름 표시 여부를 전환합니다",
             "modelCardFooterAction": "모델 카드 버튼 동작",
             "modelCardFooterActionOptions": {
                 "exampleImages": "예시 이미지 열기",

locales/ru.json

@@ -428,6 +428,8 @@
                 "hover": "Показать при наведении"
             },
             "cardInfoDisplayHelp": "Выберите когда отображать информацию о модели и кнопки действий",
+            "showVersionOnCard": "Показывать версию на карточке",
+            "showVersionOnCardHelp": "Показать или скрыть название версии на карточках моделей",
             "modelCardFooterAction": "Действие кнопки карточки модели",
             "modelCardFooterActionOptions": {
                 "exampleImages": "Открыть примеры изображений",

locales/zh-CN.json

@@ -428,6 +428,8 @@
                 "hover": "悬停时显示"
             },
             "cardInfoDisplayHelp": "选择何时显示模型信息和操作按钮",
+            "showVersionOnCard": "在卡片上显示版本",
+            "showVersionOnCardHelp": "在模型卡片上显示或隐藏版本名称",
             "modelCardFooterAction": "模型卡片按钮操作",
             "modelCardFooterActionOptions": {
                 "exampleImages": "打开示例图片",

locales/zh-TW.json

@@ -428,6 +428,8 @@
                 "hover": "滑鼠懸停顯示"
             },
             "cardInfoDisplayHelp": "選擇何時顯示模型資訊與操作按鈕",
+            "showVersionOnCard": "在卡片上顯示版本",
+            "showVersionOnCardHelp": "在模型卡片上顯示或隱藏版本名稱",
             "modelCardFooterAction": "模型卡片按鈕操作",
             "modelCardFooterActionOptions": {
                 "exampleImages": "開啟範例圖片",

py/services/settings_manager.py

@@ -97,6 +97,7 @@ DEFAULT_SETTINGS: Dict[str, Any] = {
     "priority_tags": DEFAULT_PRIORITY_TAG_CONFIG.copy(),
     "model_name_display": "model_name",
     "model_card_footer_action": "replace_preview",
+    "show_version_on_card": True,
     "update_flag_strategy": "same_base",
     "auto_organize_exclusions": [],
     "metadata_refresh_skip_paths": [],

static/css/components/card.css

@@ -507,6 +507,11 @@
     font-size: 0.75em;
 }
 
+/* Hide civitai version name when setting is disabled */
+body.hide-card-version .civitai-version {
+    display: none;
+}
+
 /* Prevent text selection on cards and interactive elements */
 .model-card,
 .model-card *,

static/js/components/shared/ModelCard.js

@@ -645,7 +645,7 @@ export function createModelCard(model, modelType) {
                 <div class="model-info">
                     <span class="model-name" title="${getDisplayName(model).replace(/"/g, '&quot;')}">${getDisplayName(model)}</span>
                     <div>
-                        ${model.civitai?.name ? `<span class="version-name">${model.civitai.name}</span>` : ''}
+                        ${model.civitai?.name ? `<span class="version-name civitai-version">${model.civitai.name}</span>` : ''}
                         ${hasUsageCount ? `<span class="version-name" title="${translate('modelCard.usage.timesUsed', {}, 'Times used')}">${model.usage_count}×</span>` : ''}
                     </div>
                 </div>

static/js/managers/SettingsManager.js

@@ -879,6 +879,12 @@ export class SettingsManager {
             modelCardFooterActionSelect.value = state.global.settings.model_card_footer_action || 'example_images';
         }
 
+        // Set show version on card
+        const showVersionOnCardCheckbox = document.getElementById('showVersionOnCard');
+        if (showVersionOnCardCheckbox) {
+            showVersionOnCardCheckbox.checked = state.global.settings.show_version_on_card !== false;
+        }
+
         // Set model name display setting
         const modelNameDisplaySelect = document.getElementById('modelNameDisplay');
         if (modelNameDisplaySelect) {
@@ -2890,6 +2896,10 @@ export class SettingsManager {
         const cardInfoDisplay = state.global.settings.card_info_display || 'always';
         document.body.classList.toggle('hover-reveal', cardInfoDisplay === 'hover');
 
+        // Apply show version on card setting
+        const showVersionOnCard = state.global.settings.show_version_on_card !== false;
+        document.body.classList.toggle('hide-card-version', !showVersionOnCard);
+
         const shouldShowSidebar = state.global.settings.show_folder_sidebar !== false;
         if (sidebarManager && typeof sidebarManager.setSidebarEnabled === 'function') {
             sidebarManager.setSidebarEnabled(shouldShowSidebar).catch((error) => {

static/js/state/index.js

@@ -38,6 +38,7 @@ const DEFAULT_SETTINGS_BASE = Object.freeze({
     show_folder_sidebar: true,
     model_name_display: 'model_name',
     model_card_footer_action: 'example_images',
+    show_version_on_card: true,
     include_trigger_words: false,
     compact_mode: false,
     priority_tags: { ...DEFAULT_PRIORITY_TAG_CONFIG },

templates/components/modals/settings_modal.html

@@ -554,6 +554,24 @@
                                 </div>
                             </div>
 
+                            <div class="setting-item">
+                                <div class="setting-row">
+                                    <div class="setting-info">
+                                        <label for="showVersionOnCard">
+                                        {{ t('settings.layoutSettings.showVersionOnCard') }}
+                                        <i class="fas fa-info-circle info-icon" data-tooltip="{{ t('settings.layoutSettings.showVersionOnCardHelp') }}"></i>
+                                    </label>
+                                    </div>
+                                    <div class="setting-control">
+                                        <label class="toggle-switch">
+                                            <input type="checkbox" id="showVersionOnCard"
+                                                   onchange="settingsManager.saveToggleSetting('showVersionOnCard', 'show_version_on_card')">
+                                            <span class="toggle-slider"></span>
+                                        </label>
+                                    </div>
+                                </div>
+                            </div>
+
                             <div class="setting-item">
                                 <div class="setting-row">
                                     <div class="setting-info">