mirror of
https://github.com/willmiao/ComfyUI-Lora-Manager.git
synced 2026-03-21 21:22:11 -03:00
0dc396e148
- Updated RecipeModal.js to dynamically handle video and image previews based on the file type. - Modified recipe-modal.css to ensure proper styling for both images and videos. - Adjusted recipe_modal.html to accommodate the new media handling structure.
71 lines
3.3 KiB
HTML
71 lines
3.3 KiB
HTML
<div id="recipeModal" class="modal">
|
|
<div class="modal-content">
|
|
<button class="close" onclick="modalManager.closeModal('recipeModal')">×</button>
|
|
|
|
<header class="recipe-modal-header">
|
|
<h2 id="recipeModalTitle">Recipe Details</h2>
|
|
<!-- Recipe Tags Container -->
|
|
<div class="recipe-tags-container">
|
|
<div class="recipe-tags-compact" id="recipeTagsCompact"></div>
|
|
<div class="recipe-tags-tooltip" id="recipeTagsTooltip">
|
|
<div class="tooltip-content" id="recipeTagsTooltipContent"></div>
|
|
</div>
|
|
</div>
|
|
</header>
|
|
|
|
<div class="modal-body">
|
|
<!-- Top Section: Preview and Generation Parameters -->
|
|
<div class="recipe-top-section">
|
|
<div class="recipe-preview-container" id="recipePreviewContainer">
|
|
<img id="recipeModalImage" src="" alt="Recipe Preview" class="recipe-preview-media">
|
|
</div>
|
|
|
|
<div class="info-section recipe-gen-params">
|
|
<h3>Generation Parameters</h3>
|
|
|
|
<div class="gen-params-container">
|
|
<!-- Prompt -->
|
|
<div class="param-group info-item">
|
|
<div class="param-header">
|
|
<label>Prompt</label>
|
|
<button class="copy-btn" id="copyPromptBtn" title="Copy Prompt">
|
|
<i class="fas fa-copy"></i>
|
|
</button>
|
|
</div>
|
|
<div class="param-content" id="recipePrompt"></div>
|
|
</div>
|
|
|
|
<!-- Negative Prompt -->
|
|
<div class="param-group info-item">
|
|
<div class="param-header">
|
|
<label>Negative Prompt</label>
|
|
<button class="copy-btn" id="copyNegativePromptBtn" title="Copy Negative Prompt">
|
|
<i class="fas fa-copy"></i>
|
|
</button>
|
|
</div>
|
|
<div class="param-content" id="recipeNegativePrompt"></div>
|
|
</div>
|
|
|
|
<!-- Other Parameters -->
|
|
<div class="other-params" id="recipeOtherParams"></div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Bottom Section: Resources -->
|
|
<div class="info-section recipe-bottom-section">
|
|
<div class="recipe-section-header">
|
|
<h3>Resources</h3>
|
|
<div class="recipe-section-actions">
|
|
<span id="recipeLorasCount"><i class="fas fa-layer-group"></i> 0 LoRAs</span>
|
|
<button class="copy-btn" id="copyRecipeSyntaxBtn" title="Copy Recipe Syntax">
|
|
<i class="fas fa-copy"></i>
|
|
</button>
|
|
</div>
|
|
</div>
|
|
<div class="recipe-loras-list" id="recipeLorasList"></div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|