extern/easydiffusion
1
0
Fork 1
mirror of https://github.com/easydiffusion/easydiffusion.git synced 2025-04-02 03:59:00 +02:00
Code Issues Packages Projects Releases Wiki Activity

Keep the min-width of a dropdown equal to the width of the input element

Browse Source
This commit is contained in:
cmdr2 2023-02-24 20:08:19 +05:30
parent fce8b96d3b
commit bd82480fa3
3 changed files with 7 additions and 3 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
ui/media/css/main.css
View File

@ -770,7 +770,7 @@ input::file-selector-button {
opacity: 1; opacity: 1;
} }
.model-filter { .model-filter {
width: calc(100% - 20px); width: 90%;
padding-right: 20px; padding-right: 20px;
white-space: nowrap; white-space: nowrap;
overflow: hidden; overflow: hidden;

6
ui/media/js/searchable-models.js
View File

@ -476,7 +476,8 @@ class ModelDropdown
createDropdown() { createDropdown() {
// create dropdown entries // create dropdown entries
this.modelFilter.insertAdjacentElement('afterend', this.createRootModelList(this.inputModels)) let rootModelList = this.createRootModelList(this.inputModels)
this.modelFilter.insertAdjacentElement('afterend', rootModelList)
this.modelFilter.insertAdjacentElement( this.modelFilter.insertAdjacentElement(
'afterend', 'afterend',
this.createElement( this.createElement(
@ -507,6 +508,9 @@ class ModelDropdown
this.modelList.addEventListener('mousemove', this.bind(this.highlightModelAtPosition, this)) this.modelList.addEventListener('mousemove', this.bind(this.highlightModelAtPosition, this))
this.modelList.addEventListener('mousedown', this.bind(this.processClick, this)) this.modelList.addEventListener('mousedown', this.bind(this.processClick, this))
let modelFilterStyle = window.getComputedStyle(this.modelFilter)
rootModelList.style.minWidth = modelFilterStyle.width
this.selectEntry(this.activeModel) this.selectEntry(this.activeModel)
} }

2
ui/plugins/ui/merge.plugin.js
View File

@ -239,7 +239,7 @@
merge.innerHTML = ` merge.innerHTML = `
<div class="merge-container panel-box"> <div class="merge-container panel-box">
<div class="merge-input"> <div class="merge-input" style="position: relative">
<p><label for="#mergeModelA">Select Model A:</label></p> <p><label for="#mergeModelA">Select Model A:</label></p>
<input id="mergeModelA" type="text" spellcheck="false" autocomplete="off" class="model-filter" data-path="" /> <input id="mergeModelA" type="text" spellcheck="false" autocomplete="off" class="model-filter" data-path="" />
<p><label for="#mergeModelB">Select Model B:</label></p> <p><label for="#mergeModelB">Select Model B:</label></p>