fix dropdwon blank space bug
This commit is contained in:
@@ -39,14 +39,14 @@
|
||||
<div v-else-if="displayedOptions.length === 0" class="px-3 py-2 text-xs text-gray-500">
|
||||
{{ emptyText }}
|
||||
</div>
|
||||
<ul v-else class="menu p-0">
|
||||
<ul v-else class="flex flex-col">
|
||||
<li
|
||||
v-for="(option, index) in displayedOptions"
|
||||
:key="resolveValue(option) ?? index"
|
||||
>
|
||||
<button
|
||||
type="button"
|
||||
class="w-full text-left px-3 py-2 hover:bg-base-200 focus:bg-base-200 focus:outline-none"
|
||||
class="flex w-full flex-col items-start gap-1 px-3 py-2 text-left hover:bg-base-200 focus:bg-base-200 focus:outline-none"
|
||||
:class="{
|
||||
'bg-base-200': isOptionSelected(option),
|
||||
'bg-base-300/60': highlightedIndex === index
|
||||
@@ -55,18 +55,16 @@
|
||||
@mouseleave="highlightedIndex = -1"
|
||||
@click="selectOption(option)"
|
||||
>
|
||||
<div class="flex flex-col">
|
||||
<span class="font-medium text-sm">
|
||||
<slot name="option-label" :option="option">
|
||||
{{ resolveLabel(option) }}
|
||||
</slot>
|
||||
</span>
|
||||
<span v-if="resolveDescription(option)" class="text-xs text-gray-500">
|
||||
<slot name="option-description" :option="option">
|
||||
{{ resolveDescription(option) }}
|
||||
</slot>
|
||||
</span>
|
||||
</div>
|
||||
<span class="font-medium text-sm">
|
||||
<slot name="option-label" :option="option">
|
||||
{{ resolveLabel(option) }}
|
||||
</slot>
|
||||
</span>
|
||||
<span v-if="resolveDescription(option)" class="text-xs text-gray-500">
|
||||
<slot name="option-description" :option="option">
|
||||
{{ resolveDescription(option) }}
|
||||
</slot>
|
||||
</span>
|
||||
</button>
|
||||
</li>
|
||||
</ul>
|
||||
|
||||
Reference in New Issue
Block a user